/* =============================================================================
    * 管理画面スタイリング
    * ========================================================================== */
html, body {
    height: 100%;
}

/* 共通 */
.navbar {
    margin-bottom: 0;
    border-bottom: 1px solid #2C3E50;
}
.well {
    border: 0;
}
.main-container {
    padding-top: 18px;
}
.note {
    font-size: 12px;
    color: #999;
}
@media screen and (max-width: 767px) {
    #adminPage {
        padding-right: 0;
        padding-left: 0;
    }
    .main-container {
        padding: 0 15px!important;
    }
}
@media screen and (min-width: 768px) {
    .adminBody {
        padding-left: 0;
    }
}

/* サイドナビゲーション */
.sidebar-nav {
    padding-top: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    background: #2C3E50;
}
.navbar-inner {
    padding: 5px 0;
    background: #34495E;
    border-radius: 0;
}
.nav-tabs.nav-stacked {
    background: #2C3E50;
}

.nav-tabs.nav-stacked > li {
    border-bottom: 1px solid #7F8C8D;
    border-top: 1px solid #7F8C8D;
}
.nav-tabs.nav-stacked > li.active a,
.nav-tabs.nav-stacked > li.active a:hover {
  background: #FFF!important;
  color: #2C3E50!important;
}
.nav-tabs.nav-stacked > li > a {
    padding: 15px 20px;
    background: #2C3E50;
    border: 0;
    color: #FFF;
    font-size: 14px;
}
.nav-tabs.nav-stacked > li > a:hover {
    background: #2C3E50;
}
.nav-tabs.nav-stacked li a .glyphicon {
    margin-right: 5px;
    font-size: 13px;
    vertical-align: top;
}

.nav .nav-header {
    padding-top: 20px;
    background: #2C3E50;
    color: #BDC3C7;
    text-shadow: none;
    border-top: 0!important;
}




/* PC時 サイドバーの高さを100%に */
@media screen and (min-width: 769px) {
    .adminBody {
        height: 100%;
        position: relative;
    }
    
    .sidebar-nav {
        position: absolute;
        overflow: scroll;
        width: 190px;
        height: 100%;
    }
}
@media (min-width:769px) and (max-width:1200px) {
    .sidebar-nav {
        width: 150px;
    }
    .nav-tabs.nav-stacked > li > a {
        font-size: 12px;
    }
}

/* 見出し */
.adminBody h1 {
    position: relative;
    margin-bottom: 20px;
    font-size: 24px;
    border-bottom: solid 2px #2C3E50;
}
.adminBody h1:after {
    position: absolute;
    content: " ";
    display: block;
    border-bottom: solid 2px #FF557C;
    bottom: -2px;
    width: 20%;
}

/* ボタン */
.adminBody .btn {
    margin-bottom: 10px;
}
.adminTable .btn {
    margin-bottom: 0;
}
.adminTable .not_on_sale {
  background: #FEE9E9;
}
.box-accordion .pure-button {
    margin-top: 15px;
}
.btn-delete {
  display: block;
  padding: 5px 0;
  color: #333;
}
.btn-delete:hover {
  color: #666;
  text-decoration: none;
}
.btn-delete:before {
  font-family: 'Glyphicons Halflings';
  content: "\e014";
  color: #d32f2f;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    margin-right: 5px;
    line-height: 1;
    vertical-align: text-top;
    -webkit-font-smoothing: antialiased;
}
.btn-container-fixed {
  position: fixed;
  width: 100%;
    padding: 10px 0 1px;
    background: #FFF;
    box-shadow: 0 -2px 1px rgba(0,0,0,.15);
    bottom: 0;
    left: 0;
}
.btn-static {
  width: 250px;
  margin-bottom: 10px;
}
.container-relative {
  position: relative;
  height: 100%;
  padding-bottom: 100px;
  height: auto !important;
  height: 100%;
  min-height: 100%;
}
@media screen and (max-width: 767px) {
  .container-relative {
    position: static;
  }
}

/* フォーム */
.errorMessage {
    margin-bottom: 15px;
    font-size: 13px;
}
.pure-control-group label {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    color: #727677;
}
.js-droparea,
.js-droparea2 {
    height: 40px;
    padding: 30px 0 10px;
    margin: 10px 0px;
    border: 1px #FF557C solid;
    color: #FF557C;
    border-radius: 5px;
    text-align: center;
    vertical-align: middle;
    background-color: #FFEEF1;
  font-size: 11px;
}
.box-category .chosen-single {
  position: relative;
  background: #FFF!important;
}
.box-category .chosen-single b {
  display: none;
}
.box-category .chosen-single span:after {
  float: right;
  font-family: 'Glyphicons Halflings';
  content: "\e252";
  color: #999;
  position: absolute;
  right: 5px;
  font-size: 10px;
}
.related .related-block {
  margin: 5px 10px 0 10px;
}
/* テーブル */
.table.no-border th,
.table.no-border td {
  border-top: 0;
}
.adminTable {
    width: 100%;
}
.adminTable .top {
  vertical-align: top;
  padding-top: 20px;
}
.adminTable label {
 font-size: 12px;
}
.adminTable .sku_image_set_area {
  min-height: 190px;
}
.adminTable .table-bordered {
  border-left: 1px solid #dddddd;
}

.table-th-s {
    width: 55px;
    text-align: center;
}
.table-th-m {
    width: 130px;
}
.adminTable tr[data-depth="1"],
.adminTable tr.depth1,
.adminTable tr.depth2 {
    background: #F6F6F6;
}
.adminTable.pure-stripe tr:nth-child(even) {
    background: #FAFAFA;
}
.orderTable td {
  vertical-align: top;
}
.admin-title {
    margin-top: 10px;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5;
}
.label-admin {
    display: inline-block;
    margin-bottom: 3px;
    margin-right: 3px;
    padding: 2px 10px;
    font-size: 12px;
    border: 1px solid #00B9A8;
    border-radius: 2px;
    color: #00B9A8;
}
.label-false {
    border: 1px solid #F47A5E;
    color: #F47A5E;
}
.adminTable.child th {
    background: #BDC3C7;
    font-size: 12px;
    padding: 2px 13px;
}
.sub_table {
    width: 100%;
}
.sub_table th,
.sub_table td {
    border: 0;
}
.sub_table th {
}
.sub_table input {
    margin-bottom: 0;
}
@media screen and (max-width: 767px) {
    .sp-none {
        display: none;
    }
    .sp-block {
        display: block;
        width: 100%;
        box-sizing: border-box;
        border-bottom: 0!important;
    }
    .sp-border {
        border-bottom: 1px solid #cbcbcb!important;
    }
    .sub_table input{
        width: auto;
    }
}

/* ページャー */
#adminPage .yiiPager li {
  background: none!important;
  border: 0!important;
  padding: 10px 0;
}
#adminPage ul.yiiPager {
  display: block;
  margin-top: 30px;
}
#adminPage ul.yiiPager a:link,
#adminPage ul.yiiPager a:visited {
  padding: 5px 10px;
  border-radius: 2px;
}

/* 商品一覧 */
.box-content .span3 select {
    width: 130px;
}
.adminTable .glyphicon-heart {
    color: #FF879F;
    font-size: 16px;
    vertical-align: text-bottom;
}

/* 商品編集 */

.rabelsetting {
    display:none;
}

.select-label {
    display: block;
}
.label-selected {
    border: 3px solid #0099cc;
}

    
.sliders .image-sort-area {
    
}

.row-fluid.ui-sortable [class*="span"]:nth-child(13n) {
    margin-left: 0;
}

/*
.sliders .image-sort-area-item:nth-child(7n){
    margin-left: -16px;
}
*/

.container-thumbnail {
    max-width: 945px;
}
.container-thumbnail h3 {
  font-size: 13px;
}
.container-thumbnail .js-droparea,
.container-thumbnail .js-droparea2 {
  margin-top: 0;
}
.container-thumbnail .span3 {
  overflow: hidden;
}
.container-thumbnail input.upload_image {
  margin-top: 3px;
  font-size: 10px;
  line-height: 10px;
}
.adminBody .control {
    background: #EAEAEA;
    color: #333;
}
#hana_select .products_list p.prev,
#hana_select .products_list p.next {
    background: #EAEAEA;
}
#hana_select .products_list p.prev i,
#hana_select .products_list p.next i {
    color: #333;
}
.list_selected {
    border: 1px solid #EAEAEA;
    box-sizing: border-box;
}
#hana_select .selected_itemList {
    width: 98%;
}
#hana_select .selected_itemList dt {
    background: #FFF;
    color: #333;
    font-weight: normal;
    font-size: 13px;
}
#hana_select .selected_itemList > div {
    width: 20%;
}
.adminBody .total dl {
    margin: 0;
}
.adminBody .total dd {
    margin-top: 5px;
    font-size: 18px;
    font-weight: bold;
}
.span6 .chosen-container {
    margin-right: 5px;
    vertical-align: text-bottom;
}
@media screen and (min-width: 1024px) {
  .status_custom {
    width: 25%;
  }
}

/* 商品表示順変更 */
h2.pagecount {
    display: block;
    overflow: hidden;
  margin-right: 20px;
    margin-bottom: 30px;
    padding: 0 15px;
    overflow: hidden;
    clear: both;
    background: #95A5A6;
    color: #FFF;
    font-size: 18px;
}
.rank-name {
  float: left;
  font-size: 10px;
  text-align: left;
  color: #666;
  line-height: 1.3;
}

/* ボックス */
.box-content {
    overflow: hidden;
}
.box-header {
    background: #34495E;
    color: #FFF;
}
.title-accordion h2 {
    display: block;
    width: 100%;
    box-sizing: border-box;
}
.title-accordion h2:after {
    float: right;
    content: "\e114";
    font-family: 'Glyphicons Halflings';
}
.title-accordion.active h2:after {
    content: "\e113";
}

/* もっと見るボタン */
.content-wrap {
  padding: 15px 0;
  height: 90px;
  overflow: hidden;
  position: relative;
  margin: 0;
}
.close-btn, .more-btn {
  display: block;
  width: 100%;
  padding: 15px 0 0;
  position: absolute;
  bottom: 0;
  left: 0;
  text-align: center;
  background: -moz-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 60%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 60%
  );
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 1) 60%
  );
  filter: progid:DXImageTransform.Microsoft.gradient(
      startColorstr='#00ffffff',
      endColorstr='#ffffff',
      GradientType=0
    );
}
.close-btn {
  background: none;
}
.slide-up {
  height: 90px;
  overflow: hidden;
}
.slide-down {
  height: auto;
  overflow: visible;
  padding-bottom: 50px;
}
.more-btn p {
  display: inline-block;
  color: #fff;
  cursor: pointer;
  border: 1px solid #FF557C;
  padding: 5px 20px;
  width: 100px;
  border-radius: 5px;
  color: #FF557C;
}
.close-btn {
  padding:0;
}
.close-btn p {
  border: 1px solid #aaa;
  color: #aaa;
}
.more-btn .glyphicon {
    margin-left: 15px;
    font-size: 11px;
    vertical-align: baseline;
}


/* 商品ピックアップリスト選択ページ */
.pickup-item {
  font-size: 10px;
  line-height: 1.4;
}
.pickup-item .glyphicon {
  float: right;
  color: #999;
  font-size: 12px;
}
.pickuped .pickup-item-img {
  position: relative;
  background: #000;
}
.pickuped .pickup-item-img img {
  opacity: .6;
}
.pickup-item-checked .pickup-item-img {
  position: relative;
  background: #FF557C;
}
.pickup-item-checked .pickup-item-img:before {
  display: none;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  width: 30px;
  height: 30px;
  font-family: 'Glyphicons Halflings';
  content: "\e013";
  color: #FFF;
  font-size: 30px;
}
.pickup-item-checked .pickup-item-img img {
  opacity: .6;
}
.pickup-item-checked .pickup-item-img:before {
  display: block;
  opacity: 1;
  z-index: 100;
}
.span2.pickup-item {
  width: 10%;
  float: left!important;
  margin: 10px !important;
  box-sizing: border-box;
}
@media screen and (max-width: 768px) {
  .span2.pickup-item {
    width: 13%!important;
    margin: 10px !important;
    box-sizing: border-box;
    white-space: nowrap;
    font-size: 9px;
  }
}
@media screen and (max-width: 440px) {
  .span2.pickup-item {
    width: 23%!important;
    margin: 10px !important;
    box-sizing: border-box;
  }
}


/* =============================================================================
    * ラベル
    * ========================================================================== */

/* 管理画面 */
.admin-one-item {
  width: 100px;
  height: 100px;
  overflow: hidden;
  position: relative;
}
.upload-one-item {
  overflow: hidden;
  position: relative;
}
.relative {
  position: relative;
}
.label-container {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  text-align: right;
}
.label-container img {
  width: 25%;
  height: 25%;
  min-width: 30px;
  min-height: 30px;
}
.upload-one-item .label-container {
  margin-top: 0!important;
}
.upload-one-item .label-container img,
.upload_result_area .label-container img {
  width: 30%;
  height: 30%;
}
.upload_result_area .label-container {
  top: 18px;
}
.upload-one-item {
  max-width: 100px;
}

.label-double {
  position: absolute;
  top: 5px;
  left: 5px;
  color: #FFF;
  font-size: 12px;
  text-shadow: 0 0 3px #000;
}

@media screen and (max-width: 767px) {
  .label-container img {
    width: 25%;
    height: 25%;
    min-width: 30px;
    min-height: 30px;
  }
}

/* スマートフォン対応 */
@media screen and (max-width: 440px) {
  .sp-img-box {
    width: 250px;
  }
  .sp-img-box-img {
    float: left!important;
  }
  .sp-img-box-img img {
    width: 70px!important;
    height: 70px!important;
  }
  .sp-img-box-img .label-container img {
    width: 30px!important;
    height: 30px!important;
  }
  .sp-img-box-text {
    float: right!important;
    width: 170px!important;
  }
  .sp-img-box-text .admin-title {
    margin-top: 0;
    margin-bottom: 0;
  }
  .label-admin {
    font-size: 10px;
  }
  .note {
    font-size: 10px;
    line-height: 1.4;
  }
}


/* ====== 動作選択モーダル ========= */
.movin-modal{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  z-index: 1000000;
  display: none;
}
.movin-modal .overlay{
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #000;
  opacity: 0.7;
  top: 0;
  left: 0;
}
.movin-modal-wrapper{
  width: 100%;
  max-width: 650px;
  min-width: 300px;
  height: 100%;
  max-height: 550px;
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.movin-modal-contents{
  overflow: auto;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  position: relative;
}
.movin-modal-content{
  margin: 25px;
}
.movin-modal-close{
  position: absolute;
  top: 5px;
  right: 10px;
  text-decoration: none;
}
