/* ---------------------- */
/* custom-uikit */
/* ---------------------- */
.uk-offcanvas-bar {
  color: #333333 !important;
  background: #fff !important;
}
.uk-offcanvas-bar h3{
  color: #333333 !important;
}
.uk-offcanvas-bar .uk-close{
  color: #333333 !important;
}

/* ---------------------- */
/* height */
/* ---------------------- */
.uk-height-100pre {
  height: 100% !important;
}
.uk-height-100px {
  height: 100px;
}

/* ---------------------- */
/* line-height */
/* ---------------------- */
.uk-line-height-small {
  line-height: 2rem;
}

/* ---------------------- */
/* padding */
/* ---------------------- */
.uk-padding-left-1-5rem {
  padding-left: 1.5rem !important;
}

/* ---------------------- */
/* margin */
/* ---------------------- */
.uk-margin-negative-top-1px {
  margin-top: -1px !important;
}

/* ---------------------- */
/* width */
/* ---------------------- */
.uk-width-200px {
  width: 200px !important;
}

/* ---------------------- */
/* wrapper */
/* ---------------------- */
.sbs-nav-wrapper{
  background-color: #fff;
  padding: 0 20px;
}
.sbs-wrapper {
  background-color: #f5f5f5;
}
.sbs-main-wrapper {
  background-color: #fff;
}

/* ---------------------- */
/* part */
/* ---------------------- */
.sbs-title-obi {
  background-color: #eef1f3;
  padding-left: 10px;
}

/* Avoid collapsing 3 digits quantity */
.sbs-number-quantity {
  min-width: 60px;
  text-align: center;
}

/* ---------------------- */
/* table */
/* ---------------------- */
.uk-table th{
  white-space: nowrap !important;
}
.uk-table button{
  white-space: nowrap !important;
}
.uk-table td.sbs-nowrap {
  white-space: nowrap !important;
}

.uk-table-border-top {
  border-top: 1px solid #e5e5e5 !important;
}

.uk-table-border-bottom {
  border-bottom: 1px solid #e5e5e5 !important;
}

.uk-table-collapse-separate {
  border-collapse: separate;
  border-spacing: 0 5px;
}

.uk-table-collapse-separate th,
.uk-table-collapse-separate td {
  vertical-align: middle;
}

.uk-table-collapse-separate th {
  font-weight: 700;
}

.uk-table-align-top {
  vertical-align: top !important;
}

.uk-table-xsmall td, .uk-table-xsmall th {
  padding: 10px 2px;
}

/* Pseudo table header for vertical alignment */
@media (max-width: 959px) {
  .uk-table-responsive td:before {
    content: attr(data-label);
    float: left;
    margin-right: 20px;
    font-size: .875rem;
    font-weight: 400;
    color: #999;
  }
  .uk-table-responsive td.required:before {
      color: #f0506e;
  }
}

/**
 * footer
 */
#wrapper {
  display: flex;
  flex-flow: column;
  min-height: 100vh;
}
main {
  flex: 1;
}

.align-center {
  align-items: center;
}


.box select{
  width: 100px;
}


/* OnClick + Active */
/* Style modifiers
 ========================================================================== */
/*
 * Outline-Default
 */
 .uk-button-outline-default {
  background-color: #ffffff;
  color: #333;
  border: 1px solid #e5e5e5;
}
/* Hover */
.uk-button-outline-default:hover {
  background-color: #999999;
  color: #333;
  border-color: #b2b2b2;
}
/* OnClick + Active */
.uk-button-outline-default:active,
.uk-button-outline-default.uk-active {
  background-color: #b2b2b2;
  color: #333;
  border-color: #999999;
}
 /*
 *  Outline-Primary
 */
 .uk-button-outline-primary {
  background-color: #ffffff;
  color: #333;
  border: 1px solid #1e87f0;
}
/* Hover */
.uk-button-outline-primary:hover {
  background-color: #0f7ae5;
  color: #fff;
}
/* OnClick + Active */
.uk-button-outline-primary:active,
.uk-button-outline-primary.uk-active {
  background-color: #0e6dcd;
  color: #fff;
}

/* Small
 ========================================================================== */
 .uk-margin-xsmall {
  margin-bottom: 5px;
}
* + .uk-margin-xsmall {
  margin-top: 5px !important;
}
.uk-margin-xsmall-top {
  margin-top: 5px !important;
}
.uk-margin-xsmall-bottom {
  margin-bottom: 5px !important;
}
.uk-margin-xsmall-left {
  margin-left: 5px !important;
}
.uk-margin-xsmall-right {
  margin-right: 5px !important;
}

/* ========================================================================
   Component: Padding
 ========================================================================== */
/* XSmall
 ========================================================================== */
 .uk-padding-xsmall {
  padding: 10px;
}
.uk-padding-exsmall {
  padding: 5px;
}


/* ========================================================================
   Component: Border
 ========================================================================== */
/* boder-top
 ========================================================================== */
 .sbs-border-top {
  border: 1px solid #e5e5e5;
 }
 .sbs-confirm-item > div {
  border: 0;
  border-top: 1px solid #e5e5e5;
 }
 .sbs-border-top-none {
  border: 0px !important;
 }

 /* ========================================================================
   Component: Headline
 ========================================================================== */
/* Screen Headline
 ========================================================================== */
 .sbs-headline {
  border: 0;
  border-left: 6px solid #1688b0;
  padding-left: 5px;
  color: #1688b0 !important;
}

/* ========================================================================
   Component: Label
 ========================================================================== */
/* Color modifiers
 ========================================================================== */
/*
 * default
 */
.uk-label-default {
  background-color: #999;
  color: #fff;
}

/* ========================================================================
   Component: Image
 ========================================================================== */
.sbs-img-source {
  max-height: 300px;
}
.sbs-img-data {
  background-size: contain;
  background-repeat: no-repeat;
  height: 300px;
  width: 100%;
  padding: 0;
}

/* ========================================================================
   Component: Width
 ========================================================================== */
/* Single Widths
 ========================================================================== */
/* Pixel */
.uk-width-xsmall {
  width: 100px;
}
.uk-width-exsmall {
  width: 60px;
}

@media (min-width: 640px) {
  .uk-width-xsmall\@s {
    width: 100px;
  }
  .uk-width-exsmall\@s {
    width: 60px;
  }
}
@media (min-width: 960px) {
  .uk-width-xsmall\@m {
    width: 100px;
  }
  .uk-width-exsmall\@m {
    width: 60px;
  }
}
@media (min-width: 1200px) {
  .uk-width-xsmall\@l {
    width: 100px;
  }
  .uk-width-exsmall\@l {
    width: 60px;
  }
}
@media (min-width: 1600px) {
  .uk-width-xsmall\@xl {
    width: 100px;
  }
  .uk-width-exsmall\@xl {
    width: 60px;
  }
}

/* ========================================================================
   Component: Br
 ========================================================================== */
/* スマートフォン表示などで文字列が折り返される場合、任意の場所で改行する
 ========================================================================== */
.sbs-br-sp {
  display: none;
}
@media (max-width: 640px) {
  .sbs-br-sp {
      display: block;
  }
}

/* ========================================================================
   Text
 ========================================================================== */
/* 2行目以降字下げ
 ========================================================================== */
.sbs-text-indent {
  padding-left: 1rem;
  text-indent: -1rem;
}

.sbs-document-contents{
  white-space: pre-wrap;
}

/* Accordion
 ========================================================================== */

/*
 * 開閉アイコンを左に
 */
.uk-accordion-title::before {
  float: left;
}

.sbs-text-wrap-anywhere {
  overflow-wrap: anywhere;
}