@charset "utf-8";

/* ==========================================================================
   目次
   ========================================================================== */


/*
 * 01 RESET 　　
 * 
 * 02 LAYOUT 
 * 
 *    02-01 HEADER
 *    02-02 SIDE
 *    02-03 CONTENT
 *    02-04 FOOTER
 * 
 * 03 NAVIGATION
 * 
 *    03-01 GLOBAL NAVI
 *    03-02 BREADCRUMBS
 *    03-03 TAB
 *    
 * 04 CONTENTS  
 *
 *    04-01 BOX-STYLE
 *    04-02 TITLE
 *    04-03 TEXT-STYLE
 *    04-04 TABLE
 *    04-05 FORM
 *    04-06 BUTTON
 *    04-07 LIST
 *    04-08 PANEL
 *    04-09 IMAGE
 *    04-10 HR
 *    04-11 INPUT
 *    04-12 ALERT  
 * 
 * 05 POPUP
 * 
 * 06 COMMON
 * 
 *    06-01 FLOAT
 *    06-02 PADDING
 *    06-03 MARGIN
 *    06-04 TEXT
 *    06-05 COLOR
 *    06-06 BG-COLOR
 *    06-07 BORDER
 */


/* ==========================================================================
   01 RESET
   ========================================================================== */

html {
  overflow-y: scroll;
}
body {
  font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Lucida Grande", Verdana, "ＭＳ Ｐゴシック", sans-serif;
}
body{-webkit-print-color-adjust: exact;}
.container {
  padding-right: 10px;
  padding-left: 10px;
  margin-right: auto;
  margin-left: auto;
}
@media (min-width: 1200px) {
  .container {
    width: 1000px;
  }
}
@media (max-width: 767px) {
  body {
    font-size: 12px;
  }
  .container {
    padding-right: 5px;
    padding-left: 5px;
    margin-right: auto;
    margin-left: auto;
  }
}
textarea {
  resize: vertical;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.4;
  color: inherit;
}
/* bootstrap
   ========================================================================== */

#main-contents {
  padding: 0;
}
.row {
  margin-left: 0px;
  margin-right: 0px;
}
.row:before,
.row:after {
  width:0px;
}

.row-eq-height {
  display: flex;
  flex-wrap: wrap;
}
.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
  position: relative;
  min-height: 1px;
  padding: 4px;
}
.btn {
  display: inline-block;
  padding: 6px 12px 8px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: none;
  border-radius: 4px;
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25);
  color: #FFF;
}
.btn:hover,
.btn:focus,
.btn.focus {
  color: #FFF;
  text-decoration: none;
}
.btn:active {
  padding: 5px 12px 5px;
  margin: 4px 0 0 0;
  box-shadow: inset 0 99999px 0 rgba(255, 255, 255, .50), inset 0 0 0 rgba(0, 0, 0, .25);
}
.btn-xs,
.btn-group-xs > .btn {
  padding: 2px 5px 2px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
}
.btn-sm,
.btn-group-sm > .btn {
  padding: 5px 10px 7px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25);
}
.btn-lg,
.btn-group-lg > .btn {
  padding: 11px 16px 16px;
  font-size: 18px;
  line-height: 1;
  border-radius: 6px;
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25);
}
.btn-default {
  color: #555;
  background-color: #e2e2e2;
  border: none;
}
.btn-default:hover {
  color: #555;
  background-color: #e2e2e2;
  border-color: #adadad;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #555;
  background-color: #e2e2e2;
  border-color: #adadad;
}
.btn-default:focus,
.btn-default.focus {
  color: #555;
  background-color: #e2e2e2;
  border-color: #8c8c8c;
}
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled.focus,
.btn-default[disabled].focus,
fieldset[disabled] .btn-default.focus {
  color: #555;
  background-color: #e2e2e2;
  border-color: #8c8c8c;
}

.btn-dropshadow {
  padding: 6px 20px 8px;
  line-height: 32px !important;
  box-shadow: 0 0 3px rgba(0, 0, 0, .5);
  font-weight: normal;
  font-size: 14px !important;
}

.table {word-break: break-word;}
.table-bordered {
  border: 1px solid #ddd;
}
.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
  border-bottom-width: 1px;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  padding: 6px;
  line-height: 1.42857143;
  vertical-align: middle;
  border: 1px solid #ddd;
}
th {
  /*z-index: -1;*/
  font-weight: normal;
  background-color: #f2f2f2;
}
.modal-body img {
  max-width: 100%;
  height: auto;
}
.form-control {
  padding: 6px;
}
.form-group {
  margin-bottom: 0;
}
.panel .table {
  margin-bottom: 0px;
}
.panel-heading {
  padding: 10px;
}
.modal-header {
  color: #FFF;
  background: #444444;
  padding: 15px;
  border-bottom: 1px solid #e5e5e5;
}
.modal-title {
  font-weight: bold;
  margin: 0;
  line-height: 1.42857143;
  font-size: 16px;
}
.modal-body {
  line-height: 1.8;
}
.modal-content {
  border: 5px solid #d2d2d2;
}
.modal-footer {
  background: #fcfcfc;
  text-align: center;
}
.label {
  padding: .3em .6em .3em;
  font-size: 86%;
}
label {
  font-weight: normal;
}
.popover {
  max-width: 500px;
  font-family: メイリオ, Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Lucida Grande", Verdana, "ＭＳ Ｐゴシック", sans-serif;
}
.tooltip-inner {
  max-width: 500px;
}

/*additional*/

@media (max-width: 767px) {
  .panel-body {
    padding: 10px;
  }
}
@media (max-width: 767px) {}
@media (min-width: 768px) {}
@media (min-width: 992px) {}
@media (min-width: 1200px) {}
.pay .has-success .form-control {
  border-color: #18bb1b;
  background: #f5fff6;
}
.pay .has-error .form-control {
  border-color: #ff100b;
  background: #ffefef;
}


/*input-xs*/
.form-control-static.input-lg,
.form-control-static.input-sm,
.form-control-static.input-xs {
  padding-right: 0;
  padding-left: 0;
}
.input-xs {
      height: 22px;
    padding: 2px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}
select.input-xs {
  height: 22px;
  line-height: 18px;
}
textarea.input-xs,
select[multiple].input-xs {
  height: auto;
}
.form-group-xs .form-control {
  height: 22px;
  padding: 2px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.form-group-xs select.form-control {
  height: 22px;
  line-height: 18px;
}
.form-group-xs textarea.form-control,
.form-group-xs select[multiple].form-control {
  height: auto;
}
.form-group-xs .form-control-static {
  height: 22px;
  min-height: 24px;
  padding: 2px 5px;
  font-size: 12px;
  line-height: 1.5;
}

/* ==========================================================================
   02 LAYOUT 
   ========================================================================== */


/*     HEADER
   ========================================================================== */

header {
  font-size: 11px;
  line-height: 100%;
  color: #5b5b5b;
}
header i {
  margin: 0 5px 0 0;
}
header ul {
  margin: 0;
  padding: 0;
  font-size: 0;
  list-style: none;
}
header ul li {
  border-right: 1px solid #DDD;
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 12px;
}
header ul li:first-child {
  border-left: 1px solid #ddd;
}
header ul li:hover {
  background: #EEE;
}
header ul li a {
  display: inline-block;
  vertical-align: middle;
  padding: 0 10px;
  text-decoration: none;
  color: #5b5b5b;
  line-height: 50px;
  height: 50px;
}
header ul li a:hover {
  text-decoration: none;
}
header ul li a img:hover {}
.hdr-btn {
  display: inline-block;
  vertical-align: middle;
  padding: 0 7px;
  font-size: 11px;
  line-height: 20px;
  background: #aaa;
  margin: 0 8px 0 12px;
  border-radius: 3px;
  color: #FFF;
}
.hdr-btn:hover,
.hdr-btn:focus {
  opacity: 0.7;
  color: #FFF;
  text-decoration: none;
}
.hdr-spacer {
  padding: 10px 0 6px;
}
.hdr-info-area {
  box-shadow: 0 3px 3px -3px rgba(0, 0, 0, 0.1) inset, 0 -3px 3px -3px rgba(0, 0, 0, 0.1) inset;
  margin: 0 0 20px 0;
  border-top: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
}
.hdr-info {
  display: inline-block;
  margin: 0 8px 0 12px;
  color: #FFF;
  font-size: 11px;
  line-height: 21px;
}
.hdr-biz-id {
  display: inline-block;
  vertical-align: middle;
  border-radius: 3px 0 0 3px;
  background: #f19149;
  padding: 0 7px;
}
.hdr-biz-no {
  display: inline-block;
  vertical-align: middle;
  border-radius: 0 3px 3px 0;
  background: #e3680c;
  padding: 0 7px;
}
.hdr-ope-id {
  display: inline-block;
  vertical-align: middle;
  border-radius: 3px 0 0 3px;
  background: #B3D465;
  padding: 0 7px;
}
.hdr-ope-no {
  display: inline-block;
  vertical-align: middle;
  border-radius: 0 3px 3px 0;
  background: #91BF41;
  padding: 0 7px;
}
.hdr-ope-img {}
.hdr-ope-img img {
  vertical-align: middle;
  max-width: 21px;
  border-radius: 3px 0 0 3px;
  height: auto;
}
.hdr-ope-name {
  display: inline-block;
  vertical-align: middle;
  background: #91BF41;
  padding: 0 7px;
}
.hdr-ope-btn {
  display: inline-block;
  vertical-align: middle;
  background: #009944;
  padding: 0 7px;
  font-size: 11px;
  line-height: 21px;
  margin: 0 8px 0 12px;
  border-radius: 0 3px 3px 0;
  color: #FFF;
}
.hdr-ope-btn:hover,
.hdr-ope-btn:focus {
  opacity: 0.7;
  color: #FFF;
  text-decoration: none;
}
.hdr-chat-contact-new {
  background: #F00;
  border-radius: 4px;
  color: #ffffff;
  font-size: 12px;
  padding: 0px 5px;
  margin: 0 0 0 3px;
  line-height: 0;
}

/* ==========================================================================
   パンくず
   ========================================================================== */

#breadcrumbs {
  background: #fff;
  border: 1px solid #ededed;
  border-radius: 5px;
  overflow: hidden;
  width: 100%;
  margin: 15px 0 15px;
  color: #777;
  height: 30px;
}
#breadcrumbs i {
  margin: 0;
}
#breadcrumbs ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#breadcrumbs li {
  float: left;
  border: none;
  font-size: 11px;
}
#breadcrumbs a {
  float: left;
  padding: 7px 11px 8px 20px;
  text-decoration: none;
  color: #777;
  position: relative;
  background-color: #fff;
  border-radius: -30px 0px 0px -30px !important;
  height: 30px;
  line-height: 1.42857143;
  font-size: 11px;
}
#breadcrumbs li:first-child a {
  padding-left: 1em;
  border-radius: 5px 0 0 5px;
}
#breadcrumbs a::after,
#breadcrumbs a::before {
  content: "";
  position: absolute;
  top: 50%;
  right: -11px;
  padding-right: 11px;
  height: 30px;
  margin-top: -16px;
  width: 16px;
  border-radius: 0px 25px 25px 0px !important;
}
#breadcrumbs a::after {
  z-index: 2;
  border-left-color: #fff;
  border-radius: 0px 27px 27px 0px !important;
  background: #fff;
}
#breadcrumbs a::before {
  border: 1px solid #e0e0e0;
  border-left: none;
  z-index: 1001;
}
#breadcrumbs a:hover::after {
  border-left-color: #fff;
  border-right: none;
}
#breadcrumbs .current,
#breadcrumbs .current:hover {
  padding: 7px 10px 8px 20px;
  background: none;
  border: none;
  height: 30px;
  line-height: 1.42857143;
}
#breadcrumbs .current::after,
#breadcrumbs .current::before {
  content: normal;
}
#breadcrumbs a:hover {
  background: #e70000 !important;
  z-index: 3;
  color: #FFF;
}
#breadcrumbs a:hover::after {
  z-index: 2;
  border: none;
  background: #e70000 !important;
}
#breadcrumbs a:hover::before {
  z-index: 2;
  border: none;
  background: #e70000 !important;
}
/*#breadcrumbs .active {
  background: #00a9ce;
  color: #FFF;
}
#breadcrumbs .active::after {
  z-index: 2;
  border-left-color: #00a9ce;
  border: none;
}*/
#breadcrumbs a:nth-child(1)::after {
  z-index: 5;
}
#breadcrumbs a:nth-child(2)::after {
  z-index: 4;
}
#breadcrumbs a:nth-child(3)::after {
  z-index: 3;
}
#breadcrumbs a:nth-child(4)::after {
  z-index: 2;
}
#breadcrumbs a:nth-child(5)::after {
  z-index: 1;
}
#breadcrumbs .fa-home {
  font-size: 13px;
  position: relative;
  top: 1px;
  left: 2px;
}
.breadcrumbs-home .active a {
  background: #bfbfbf !important;
}
.breadcrumbs-form .active a {
  background: #FE859F !important;
}
.breadcrumbs-webeditor .active a {
  background: #45D2FF !important;
}
.breadcrumbs-mail .active a {
  background: #ec6941 !important;
}
.breadcrumbs-line .active a {
  background: #1dcd00 !important;
}
.breadcrumbs-seller .active a {
  background: #448aca !important;
}
.breadcrumbs-seminar .active a {
  background: #ffa800 !important;
}
.breadcrumbs-mla .active a {
  background: #398826 !important;
}
.breadcrumbs-affiliate .active a {
  background: #8fc31f !important;
}
.breadcrumbs-opt .active a {
  background: #8957a1 !important;
}
.breadcrumbs-chat .active a {
  background: #ffd800 !important;
}
.breadcrumbs-keiyaku .active a {
  background: #7d7d7d !important;
}
.breadcrumbs-home .active a {
  background: #bfbfbf !important;
}
.breadcrumbs-expa .active a {
  background: #44bb88 !important;
}
.breadcrumbs-form .active a::before {
  background: #FE859F !important;
  z-index: 3;
}
.breadcrumbs-webeditor .active a::before {
  background: #45D2FF !important;
  z-index: 3;
}
.breadcrumbs-mail .active a::before {
  background: #ec6941 !important;
  z-index: 3;
}
.breadcrumbs-line .active a::before {
  background: #1dcd00 !important;
  z-index: 3;
}
.breadcrumbs-seller .active a::before {
  background: #448aca !important;
}
.breadcrumbs-seminar .active a::before {
  background: #ffa800 !important;
}
.breadcrumbs-mla .active a::before {
  background: #398826 !important;
}
.breadcrumbs-affiliate .active a::before {
  background: #8fc31f !important;
}
.breadcrumbs-opt .active a::before {
  background: #8957a1 !important;
}
.breadcrumbs-chat .active a::before {
  background: #ffd800 !important;
}
.breadcrumbs-keiyaku .active a::before {
  background: #7d7d7d !important;
}
.breadcrumbs-expa .active a::before {
  background: #44bb88 !important;
}
.breadcrumbs-form .active a,
.breadcrumbs-webeditor .active a,
.breadcrumbs-mail .active a,
.breadcrumbs-line .active a,
.breadcrumbs-seller .active a,
.breadcrumbs-seminar .active a,
.breadcrumbs-mla .active a,
.breadcrumbs-affiliate .active a,
.breadcrumbs-opt .active a,
.breadcrumbs-chat .active a,
.breadcrumbs-keiyaku .active a,
.breadcrumbs-expa .active a {
  color: #fff !important;
}

/*     SIDE
   ========================================================================== */


/* LEFT SIDEBAR */


/* header */

#header-inner {
  width: 970px;
}
#header-inner #logo p,
#header-inner #logo a {
  display: block;
  width: 261px;
  height: 0;
  padding: 27px 0 0;
  background: url(/c2/img/logo.png) no-repeat;
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
  margin: 0;
}
#head-bar .customer-id-left {
  color: #fff;
  border-radius: 4px 0 0 4px;
  -webkit-border-radius: 4px 0 0 4px;
  background-color: #f19149;
  font-size: 11px;
  padding: 5px 8px;
  font-weight: bold;
}
#head-bar .customer-id-right {
  border-radius: 0 4px 4px 0;
  -webkit-border-radius: 0 4px 4px 0;
  color: #fff;
  background-color: #ee8449;
  font-size: 11px;
  padding: 5px 8px;
}
#head-bar .login-profile-center {
  font-size: 11px;
  background: #959595;
  color: #fff;
  padding: 5px 8px;
  border-radius: 4px;
}
.customer-id-area,
.login-id-area,
.login-profile-area,
.login-profile-area {
  display: inline-block;
}
#sidebar {
  padding: 0 20px 0 0;
}
@media screen and (max-width: 991px) {
  #sidebar {
    padding: 0;
  }
}
@media screen and (min-width: 992px) {
  #sidebar {
    display: block!important;
  }
}

/* panel-small */

.panel.panel-small {
  border: 1px solid #939393;
  margin-bottom: 10px;
}
.panel-small .panel-heading {
  color: #FFF;
  background-color: #939393;
  border: none;
  font-size: 12px;
  font-weight: bold;
  padding-top: 7px;
  padding-right: 0;
  padding-bottom: 7px;
}
.panel-small .panel-heading i {
  font-size: 14px;
}
.panel-small .panel-body {
  padding: 0;
  border-bottom: 1px solid #939393;
}
.panel-small .panel-body:last-child {
  border: none;
}
.panel-small .panel-body .list-group {
  margin: 0;
  font-size: 12px;
}
.panel-small .panel-body .list-group-item {
  border: none;
  padding: 0px;
}
.panel-small .panel-body .list-group-item:hover {
  background: #f5f5f5;
}
.panel-small .panel-body .list-group-item:first-child a {
  padding: 10px 10px 5px 10px;
}
.panel-small .panel-body .list-group-item:last-child a {
  padding: 5px 10px 5px 10px;
}
.panel-small .panel-body .list-group-item a {
  display: block;
  padding: 5px 10px;
}
.panel-small .panel-body .list-group-item a.active {
  background: #fff3bf;
}
.panel-small .panel-body .list-group-item i {
  color: #939393;
}

/* sidr */

.sidr ul li {
  line-height: 36px;
}
.sidr ul li:hover,
.sidr ul li.active,
.sidr ul li.sidr-class-active {
  line-height: 36px;
}


/*ビジネス画面のカルーセル用の指定*/
.carousel-control.left {background:transparent;}
.carousel-control.right {background:transparent;}
.carousel-control {width: 40px;}
.h-opacity-07:hover {opacity: 0.7;}


/*     CONTENT
   ========================================================================== */


/*     FOOTER
   ========================================================================== */


/* footer */

footer {
  background: #333333;
  padding: 10px 0;
  text-align: center;
  margin: 0;
}
.footer-credit {
  font-size: 12px;
  font-weight: bold;
  margin: 0 auto;
  color: #FFF;
  line-height: 20px;
}

/* footer-customer */

footer.footer-customer div {
  background: transparent;
}
footer.footer-customer .footer-border {
  margin-top: 30px;
  border-top: 1px dashed #ddd;
}
footer.footer-customer .copyright {
  width: 100%;
  text-align: center;
  padding: 7px 5px;
}
footer.footer-customer .copyright p {
  margin: 0;
}
@media screen and (max-width: 480px) {
  footer.footer-customer .copyright {
    font-size: 10px;
  }
}
footer.footer-customer {
  background-color: #FFF;
  color: #000;
}
.footer-customer .footer-nav {
  padding: 20px 0;
  border-top: 1px solid #d2d2d2;
}
.footer-customer .footer-nav ul {
  font-size: 0;
  line-height: 0;
  list-style: none;
}
.footer-customer .footer-nav li {
  display: inline-block;
  font-size: 12px;
  line-height: 12px;
  border-right: 1px solid #d2d2d2;
}
.footer-customer .footer-nav li:first-child {
  border-left: 1px solid #d2d2d2;
}
.footer-customer .footer-nav li a {
  display: block;
  padding: 0 18px;
  text-decoration: none;
  color: #000;
}
.footer-customer .footer-nav li a:hover {
  background: #f5f5f5;
}
@media (max-width: 767px) {
  .footer-customer .footer-nav ul {
    font-size: 0;
    line-height: 0;
    list-style: none;
  }
  .footer-customer .footer-nav li {
    display: block;
    font-size: auto;
    line-height: auto;
    border-right: none;
  }
  .footer-customer .footer-nav li:first-child {
    border-left: none;
  }
  .footer-customer .footer-nav li a {
    display: block;
    padding: 0 18px;
    text-decoration: none;
    color: #000;
    background: #f5f5f5;
    border-bottom: 1px solid #e5e5e5;
  }
  .footer-customer .footer-nav li a:hover {
    background: #eeeeee;
  }
}

/* ==========================================================================
   03 NAVIGATION
   ========================================================================== */

.contents {
  width: 1000px;
  padding-right: 10px;
  padding-left: 10px;
  margin-right: auto;
  margin-left: auto;
  font-size: 13px;
}
#gnav {
  width: 100%;
  background: #f8f8f8;
}
#gnav i {
  margin: 0;
}
#gnav ul {
  display: block;
  list-style: none;
  margin: 0;
  background: #f8f8f8;
}
#gnav ul > li {
  height: 39px;
  width: 103px;
  float: left;
  font-size: 14px;
  text-align: center;
  position: relative;
  border: none;
}
#gnav ul > li:first-child {
  height: 39px;
  width: 49px;
  float: left;
  font-size: 14px;
  text-align: center;
  position: relative;
}
#gnav ul > li:nth-child(2) {
  height: 39px;
  width: 107px;
  float: left;
  font-size: 14px;
  text-align: center;
  position: relative;
}
#gnav ul > li a {
  color: #616161;
  font-size: 14px;
  display: block;
  text-decoration: none;
  -webkit-box-shadow: inset 0 0 1px 1px #fff;
  -moz-box-shadow: inset 0 0 1px 1px #fff;
  box-shadow: none;
  -webkit-transition: background .3s ease;
  -moz-transition: background .3s ease;
  -o-transition: background .3s ease;
  transition: background .3s ease;
  line-height: 39px;
  height: 39px;
  padding: 0;
}
.gnav-border-home .active {
  background: #bfbfbf;
}
.gnav-border-form .active {
  background: #FE859F;
}
.gnav-border-webeditor .active {
  background: #45D2FF;
}
.gnav-border-mail .active {
  background: #ec6941;
}
.gnav-border-line .active {
  background: #1dcd00;
}
.gnav-border-seller .active {
  background: #448aca;
}
.gnav-border-mla .active {
  background: #398826;
}
.gnav-border-seminar .active {
  background: #ffa800;
}
.gnav-border-affiliate .active {
  background: #8fc31f;
}
.gnav-border-opt .active {
  background: #8957a1;
}
.gnav-border-chat .active {
  background: #ffa800;
}
.gnav-border-keiyaku .active {
  background: #7d7d7d;
}
.gnav-border-home .active a,
.gnav-border-form .active a,
.gnav-border-webeditor .active a,
.gnav-border-mail .active a,
.gnav-border-line .active a,
.gnav-border-seller .active a,
.gnav-border-mla .active a,
.gnav-border-seminar .active a,
.gnav-border-affiliate .active a,
.gnav-border-opt .active a,
.gnav-border-chat .active a,
.gnav-border-keiyaku .active a {
  color: #fff !important;
}
.gnav-li-home a,
.gnav-li-form a,
.gnav-li-webeditor a,
.gnav-li-mail a,
.gnav-li-line a,
.gnav-li-seller a,
.gnav-li-mla a,
.gnav-li-seminar a,
.gnav-li-affiliate a,
.gnav-li-opt a,
.gnav-li-chat a,
.gnav-li-keiyaku a {
  color: #555;
}
.gnav-border-home {
  border-bottom: 4px solid #bfbfbf;
}
.gnav-border-form {
  border-bottom: 4px solid #FE859F;
}
.gnav-border-webeditor {
  border-bottom: 4px solid #45D2FF;
}
.gnav-border-mail {
  border-bottom: 4px solid #ec6941;
}
.gnav-border-line {
  border-bottom: 4px solid #1dcd00;
}
.gnav-border-seller {
  border-bottom: 4px solid #448aca;
}
.gnav-border-mla {
  border-bottom: 4px solid #398826;
}
.gnav-border-seminar {
  border-bottom: 4px solid #ffa800;
}
.gnav-border-affiliate {
  border-bottom: 4px solid #8fc31f;
}
.gnav-border-opt {
  border-bottom: 4px solid #8957a1;
}
.gnav-border-chat {
  border-bottom: 4px solid #ffa800;
}
.gnav-border-keiyaku {
  border-bottom: 4px solid #7d7d7d;
}
.gnav-li-home a:hover {
  background: #bfbfbf;
  color: #fff !important;
}
.gnav-li-form a:hover {
  background: #FE859F;
  color: #fff !important;
}
.gnav-li-webeditor a:hover {
  background: #45D2FF;
  color: #fff !important;
}
.gnav-li-mail a:hover {
  background: #ec6941;
  color: #fff !important;
}
.gnav-li-line a:hover {
  background: #1dcd00;
  color: #fff !important;
}
.gnav-li-seller a:hover {
  background: #448aca;
  color: #fff !important;
}
.gnav-li-mla a:hover {
  background: #398826;
  color: #fff !important;
}
.gnav-li-seminar a:hover {
  background: #ffa800;
  color: #fff !important;
}
.gnav-li-affiliate a:hover {
  background: #8fc31f;
  color: #fff !important;
}
.gnav-li-opt a:hover {
  background: #8957a1;
  color: #fff !important;
}
.gnav-li-chat a:hover {
  background: #ffd800;
  color: #fff !important;
}
.gnav-li-keiyaku a:hover {
  background: #7d7d7d;
  color: #fff !important;
}
.nav-btn.condensed > li {
  font-size: 12px;
}
.nav-btn.condensed > li > a {
  padding: 5px 10px;
}
.g-nav-biz.active,
.g-nav-biz.active i {
  background: #3c763d;
  color: #FFF!important;
}
.g-nav-usr.active,
.g-nav-usr.active i {
  background: #ffa400;
  color: #FFF!important;
}
.g-nav-afr.active,
.g-nav-afr.active i {
  background: #33b3ed;
  color: #FFF!important;
}
.g-nav-afr.active .fa-stack-2x {
  background: transparent;
  color: #FFF!important;
}
.g-nav-afr.active .fa-stack-1x {
  background: transparent;
  color: #33b3ed!important;
}
.g-nav-btn.active,
.g-nav-btn.active i {
  background: #aaa;
  color: #FFF!important;
}

/*gnav-バッジ*/

.gnav-count {
  position: inherit;
  top: -48px;
  display: inline-block;
  z-index: 1;
  font-size: 10px;
  background: #f00;
  color: #FFF;
  border-radius: 100px;
  padding: 0 6px;
  line-height: 1.42857143;
}

/* line-stepbar
   ==========================================================================  */

.line-stepbar {
  position: relative;
  list-style: none;
  margin: 0 0 1em;
  padding: 0;
  text-align: left;
  width: 100%;
  overflow: hidden;
  *zoom: 1;
  border: 1px solid #1dcd00;
  background: #FFF;
  border-radius: 6px;
}
.line-stepbar .step {
  position: relative;
  float: left;
  display: inline-block;
  line-height: 36px;
  padding: 0 16px 0 10px;
  background-color: #FFF;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #1dcd00;
}
.line-stepbar .step:before,
.line-stepbar .step:after {
  position: absolute;
  left: -5px;
  display: block;
  content: '';
  background-color: #FFF;
  border-left: 1px solid #1dcd00;
  width: 10px;
  height: 18px;
}
.line-stepbar .step:after {
  top: 0;
  -moz-transform: skew(30deg);
  -ms-transform: skew(30deg);
  -webkit-transform: skew(30deg);
  transform: skew(30deg);
}
.line-stepbar .step:before {
  bottom: 0;
  -moz-transform: skew(-30deg);
  -ms-transform: skew(-30deg);
  -webkit-transform: skew(-30deg);
  transform: skew(-30deg);
}
.line-stepbar .step:first-child {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.line-stepbar .step:first-child:before,
.line-stepbar .step:first-child:after {
  content: none;
}
.line-stepbar .step:last-child {
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.line-stepbar .step.current {
  color: #FFF;
  background-color: #1dcd00;
}
.line-stepbar .step.current:before,
.line-stepbar .step.current:after {
  background-color: #1dcd00;
}
.line-stepbar.step2 .step {
  width: 50%;
}
.line-stepbar.step3 .step {
  width: 33.333%;
}
.line-stepbar.step4 .step {
  width: 25%;
}
.line-stepbar.step5 .step {
  width: 20%;
}


/* simple-stepbar
   ==========================================================================  */
    
ul.simple-stepbar{padding:0;margin:0;}
.simple-stepbar li{display: inline-block; font-size:16px;color:#00a9ce;}
.simple-stepbar li:after{display: inline-block;content:">";margin:0 4px;color:#bfbfbf; font-weight: normal;}
.simple-stepbar li:last-child:after{display: inline-block;content:"";}
.simple-stepbar li.active{font-weight:bold;}

@media (max-width: 767px) {
  .simple-stepbar li { font-size:12px;}
}

/* ==========================================================================
   04 CONTENTS  
   ========================================================================== */

/*===================LANKING======================*/

.main-content > .ranking{
	width: 755px;
}

.main-content > .ranking .mailmagazine{
	width: 370px;
}

.main-content > .ranking .seminar{
	width: 370px;
}

.ranking ul{
	font-size:0;
	line-height:0;
	list-style:none;
  padding: 0;
  margin: 0;
}

.l-tab > .l-tab-btn{
	width: calc(50% - 3px);
	border-radius:3px;
	font-size:16px;
	line-height:16px;
	display:inline-block;
	text-align:center;
	padding:8px 0 4px 0;
	margin:2px 0 6px 0;
	text-decoration:none;
	color:#FFF;
	cursor: pointer;
	}
.l-tab > .l-tab-btn:hover{
	opacity:0.7;
	}
	
.l-tab > .l-tab-btn.active{
	border-radius:3px 3px 0 0;
	font-size:16px;
	line-height:16px;
	color:#000;
	font-weight:bold;
	padding:10px 0;
	margin:0;
	}

.l-tab > .l-tab-btn.active:hover{
	opacity:0.7;
	}
	
.l-tab + div{
	padding:5px;
	}
	
.l-tab + div + div,
.l-3tab + div + div {
	padding:10px 0 0 0;
	text-align:right;
	}
.l-tab + div + div a,
.l-3tab + div + div a {
	color: #3d9bff;
	}

.l-3tab > .l-tab-btn{
	width: calc(33.333% - 4px);
	border-radius:3px;
	font-size:14px;
	line-height:16px;
	display:inline-block;
	text-align:center;
	padding:8px 0 4px 0;
	margin-top:2px;
	margin-bottom:6px;
	text-decoration:none;
	color:#FFF;
	font-weight:bold;
	cursor: pointer;
	}
.l-3tab > .l-tab-btn:hover{
	opacity:0.7;
	}
	
.l-3tab > .l-tab-btn.active{
	border-radius:3px 3px 0 0;
	font-size:16px;
	line-height:16px;
	color:#000;
	font-weight:bold;
	padding:10px 0;
	margin-top:0;
	margin-bottom:0;
	}

.l-3tab > .l-tab-btn.active:hover{
	opacity:0.7;
	}
	
.l-3tab + div{
	padding:5px;
	}


.m-tab li{
    display: inline-block;
    width: calc(25% - 6px);
    margin: 2px 8px 2px 0;
    border-radius: 3px;
    padding: 6px 0;
    text-align: center;
    font-size: 16px;
    line-height: 16px;
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
    cursor: pointer;
}

.m-tab li.active,
.m-tab li:hover{
display: inline-block;
    width: calc(25% - 6px);
    margin: 0px 8px 0 0;
    border-radius: 3px 3px 0 0;
    padding: 11px 0;
    text-align: center;
    font-size: 16px;
    line-height: 16px;
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
    border-bottom: none;
}

.mailmagazine .m-tab li.active,
.mailmagazine .m-tab li:hover{
	background:#009966!important;
}

.seminar .m-tab li{
	font-size: 11px;
    line-height: 16px;}

.seminar .m-tab li.active,
.seminar .m-tab li:hover{
	background:#7b4101!important;
	padding:14px 0;
	text-align:center;
	font-size:11px;
	line-height:10px;
	color:#FFF;
	font-weight:bold;
	text-decoration:none;
	border-bottom:none;
	
}

.m-tab li:last-child,
.m-tab li:last-child:hover,
.m-tab li.active:last-child{
	margin:0;
}



.m-tab + div > div:first-child {
    padding: 10px 10px 2px 10px;
    font-size: 10px;
    color: #FFF;
    text-align: center;
}

.m-tab + div > div{
	
	}
.m-tab + div > div span{
	font-size: 13px;
    line-height: 12px;
	}

.m-tab + div > div select {
    width: 80px;
    height: 18px;
    line-height: 14px;
    margin-top: -4px;
    font-size: 11px;
    min-height: 18px;
    color: #000;
	}
	
.mailmagazine .s-tab li{
	display:inline-block;
	width:58px;
	margin: 8px 4px 8px 0;
	border-radius:3px;
	padding:4px 0;
	text-align:center;
	font-size:11px;
	line-height:11px;
	color:#000;
	text-decoration:none;
	cursor: pointer;
}

.mailmagazine .s-tab li.bgc-white.active{
	display:inline-block;
	width:58px;
	margin: 8px 4px 8px 0;
	border-radius:3px;
	background:#8FC31F;
}

.mailmagazine .s-tab li.bgc-white:hover{
	background:#CCE198;
}

.mailmagazine .s-tab li:last-child,
.mailmagazine .s-tab li:last-child:hover,
.mailmagazine .s-tab li.active:last-child{
	margin:8px 0 8px 0;
}

.seminar .s-tab li{
	display:inline-block;
	width:58px;
	margin: 8px 4px 8px 0;
	border-radius:3px;
	padding:4px 0;
	text-align:center;
	font-size:11px;
	line-height:11px;
	color:#000;
	text-decoration:none;
	cursor: pointer;
}

.seminar .s-tab li.bgc-white.active{
	background:#f38c01;
}

.seminar .s-tab li.bgc-white:hover{
	background:#fed636;
}



.seminar .s-tab li:last-child,
.seminar .s-tab li:last-child:hover,
.seminar .s-tab li.active:last-child{
	margin:8px 0 8px 0;
}

.s-tab ul{text-align:center;}

.ranking .record li{
	display:table;
	width:100%;
	height:80px;
	font-size:14px;
	line-height:14px;
	background:#FFF;
	border: 1px solid #ccc;
    border-bottom: none;
	box-sizing:border-box;
	}
.ranking .record li:last-child {
	border-bottom: 1px solid #ccc;
	}

.ranking .record li div:nth-child(2){
  width: calc(100% - 39px);
  
}

.ranking .record li > div:first-child {
	display: inline-block;
    width: 39px;
    font-size: 12px;
    padding: 18px 10px;
    line-height: 15px;
    text-align: center;
    border-right: 1px solid #ccc;
	}

.seminar .record li > div:first-child {
	display: block;
    vertical-align: top;
    text-align: center;
    width: 90px;
    background: #FFF;
    padding: 8px;
    border-right: none;
    min-height: 74px;
	}

.ranking .record li > div:nth-child(2) > div:first-child > a img,
.ranking .record li > div:nth-child(2) > div:first-child > span img,
.seminar .record li > div:first-child > a img,
.seminar .record li > div:first-child > span img{
	border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    height: 45px;
    width: 45px;
	}
.seminar .record li > div:first-child > a img,
.seminar .record li > div:first-child > span img{
	height: 74px;
    width: 74px;
}
	
.ranking .record li.common > div:first-child {
    width: 39px;
    padding: 25px 0px 26px;
	}
	
.ranking .record li.first > div:first-child {
	background:#ffe400;
	}

.ranking .record li.first > div:first-child i{
	color:#E0AD1E;
	}
.ranking .record li.second > div:first-child {
	background:#e5e5e5;
	}

.ranking .record li.second > div:first-child i{
	color:#ADADAD;
	}
.ranking .record li.third > div:first-child {
	background:#dfac68;
	}

.ranking .record li.third > div:first-child i{
	color:#B24718;
	}

.ranking .record li > div:nth-child(2) > div:first-child {
	display: block;
    vertical-align: top;
    text-align: center;
    height: 61px;
    background: #FFF;
    padding: 8px;
	}

.seminar .record li > div:nth-child(1) > div:first-child {
	display: block;
    vertical-align: top;
    text-align: center;
    width: 45px;
    height: 64px;
    background: #FFF;
    padding: 8px;
	}
	
.seminar .record li > div:nth-child(2) > div:first-child {
	display: block;
    vertical-align: top;
    text-align: left;
    width: auto;
    height: 14px;
    background: none;
    padding: 0;
	}
.ranking .record li > div:nth-child(2) > div:first-child > img{
	border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    height: 45px;
    width: 45px;
	}	

.seminar .record li > div:first-child > div {
	display: block;
    text-align: center;
    width: 45px;
    height: 10px;
	font-size:8px;
	line-height: 11px;
	font-weight:bold;
	color:#FFF;
	}
.seminar .record li > div:nth-child(2) > div:first-child > div {
	color: #666;
    font-size: 11px;
    line-height: 10px;
    text-align: right;
    font-weight: 100;
	width: auto;
    height: auto;
	}

.seminar .record li > div:nth-child(2) > div:first-child > div.right span{
	font-size: 10px;
	text-decoration: underline;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) {
	display:block;
	background:#FFF;
	padding:8px 8px 8px 2px;
	width:calc(100% - 61px);
	height: 64px;
	}
	
.seminar .record li > div:nth-child(2) {
	display: block;
    background: transparent;
    padding: 8px 8px 8px 2px;
	width: 380px;
    height: auto;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(2) {
	display: block;
    background: none;
    padding: 0;
    width: 370px;
    height: inherit;
    max-height: 36px;
    overflow: hidden;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(2) a{
	text-decoration: none;
    color: #3d9bff;
    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(2) a:hover{
	text-decoration: underline;
    color: #C00;
	}
	
	
.seminar-infobox_speaker{
	display:block;
	height:16px;
	font-size:11px;
	line-height:16px;
	font-weight:bold;
	color:#000;
	margin:0 0 4px 0;
	}
.seminar-infobox_speaker span {
	display: inline-block;
	background:#000;
	color:#FFF;
	font-size:11px !important;
	line-height: 15px !important;
	font-weight:100;
	border-radius:3px;
	padding: 1px 2px 0px;
	margin:0 5px 0 0;
	}
.seminar-infobox_place,
.seminar-infobox_price,
.seminar-infobox_capacity{
	display:inline-block;
	height:16px;
	font-size:11px;
	line-height:16px;
	color:#898989;
	margin:0;
	padding:0;
	}
.seminar-infobox_place{width:86px;}
.seminar-infobox_price{width:96px;}
.seminar-infobox_capacity{width:72px; color:#0cb000;}
.seminar-infobox_capacity.full{color:#f10000;}
.seminar-infobox_capacity.close{color:#898989;}

.seminar-infobox_place span,
.seminar-infobox_price span,
.seminar-infobox_capacity span {
	display: inline-block;
	background: #898989;
    color: #FFF;
    font-size: 11px !important;
    line-height: 15px !important;
    border-radius: 3px;
    padding: 1px 2px 0px;
    margin: 0 5px 0 0;
	}



	
.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1){
	text-decoration: underline ;
	text-decoration-color: #ccc ;
    color: #2b2b2b;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	}

.seminar .record li > div:nth-child(2) > div:nth-child(1){
	text-decoration: none ;
	text-decoration-color: #ccc ;
    color: #2b2b2b;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	text-decoration: none;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(1) span{
	text-decoration: none;
    color: #666;
    font-size: 14px;
    font-weight: 100;
    line-height: 10px;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) span{
	text-decoration: none ;
    color: #2b2b2b;
    font-size: 10px;
    font-weight: 100;
    line-height: 10px;
	}
	
.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) span.red{
	text-decoration: underline ;
    color:#FF0000;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(1) span.red{
	text-decoration: none ;
    color:#FF0000;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) span.blue{
	text-decoration: underline ;
    color:#0000FF;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	}
.seminar .record li > div:nth-child(2) > div:nth-child(1) span.blue{
	text-decoration: none;
    color:#0000FF;
    font-size: 14px;
    font-weight: bold;
    line-height: 14px;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) > div{
    color: #b1b1b1;
    font-size: 10px;
    line-height: 10px;
	text-align:right;
	font-weight:100;
  width: unset !important;
	}
.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) > div.right span {
    font-size: 10px;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) a{
	text-decoration: none;
	color: #3d9bff;
	font-size: 14px;
	line-height: 14px;
    font-weight: bold;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) span{
	text-decoration: none;
	color: #000;
	font-size: 14px;
	line-height: 14px;
    font-weight: bold;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) a:hover,
.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) span:hover{
	text-decoration: underline;
	color:#C00;
	}	


.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(3){
	font-size: 11px;
    line-height: 14px;
    color: #666;
	}

.ranking .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(3) > span.bold{
	font-size: 11px;
    line-height: 13px;
    color: #000;
	font-weight:bold;
	}

.item > div:first-child{
	text-align: center;
    border-radius: 5px 5px 0 0;
    padding: 9px 0;
    color: #FFF;
    font-weight: bold;
    font-size: 13px;
    line-height: 13px;
	}

.item > div:nth-child(2){
	padding:5px 8px;
	}
.item > div:nth-child(3) {
    border-radius: 0 0 5px 5px;
	padding: 0 8px 8px 8px;
}

.item > div:nth-child(3) a{
    border: 1px solid #CCC;
    display: block;
    text-align: center;
    font-size: 13px;
    line-height: 13px;
    color: #3d9bff;
    padding: 8px 0;
}


.item .m-tab li {
    display: inline-block;
    width: 52px;
    margin: 2px 4px 2px 0px;
    border-radius: 3px;
	padding: 5px 0;
    text-align: center;
    font-size: 11px;
    line-height: 11px;
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
}

.item .m-tab li:last-child,
.item .m-tab li:last-child:hover,
.item .m-tab li.active:last-child {
    margin: 0;
}

.item .m-tab li.active,
.item .m-tab li:hover{
	display: inline-block;
    width: 52px;
    margin: 0 4px 0 0;
    border-radius: 3px 3px 0 0;
	background: #313131;
    padding: 10px 0;
    text-align: center;
    font-size: 11px;
    line-height: 11px;
    color: #FFF;
    font-weight: bold;
    text-decoration: none;
    border-bottom: none;
}

.item .m-tab + div > div:first-child {
	padding:2px 0 0 0;
	font-size:10px;
	color:#000;
	text-align:center;
}

.ranking .item .record li {
    display: table;
    width: 164px;
    height: 50px;
    font-size: 14px;
    line-height: 14px;
    background: #FFF;
    border: 1px solid #ccc;
    border-bottom: none;
    box-sizing: border-box;
	cursor: pointer;
}
.ranking .record li:last-child {
	border-bottom: 1px solid #ccc;
}

.ranking .item .record li.first > div:first-child {
	background:#ffe400;
	}

.ranking .item .record li.second > div:first-child {
	background:#e5e5e5;
	}

.ranking .item .record li.third > div:first-child {
	background:#dfac68;
	}


.ranking .item .record li > div:first-child {
    display: inline-block;
    width: 11px;
    height: 47px;
    font-size: 12px;
    background: #FFF;
    padding: 3px 4px 0px;
    line-height: 15px;
}

.ranking .item .record li.common > div:first-child {
    height: 38px;
    width: 19px;
    padding: 12px 0 0 0;
	}
.ranking .item .record li > div:nth-child(2) > div:first-child {
    display: block;
    vertical-align: top;
    text-align: center;
    width: 42px;
    height: 42px;
    background: #FFF;
    padding: 4px;
}

.ranking .item .record li > div:nth-child(2) > div:first-child > img {
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    height: 40px;
    width: 40px;
}

.ranking .item .record li > div:nth-child(2) > div:nth-child(2) {
    display: block;
    background: #FFF;
    padding: 11px 4px 11px 0px;
    width: 88px;
    height: 28px;
}

.ranking .item .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1){
    text-decoration: none;
}

.ranking .item .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) a {
    text-decoration: none;
    color: #3d9bff;
    font-size: 10px;
    line-height: 10px;
    font-weight: bold;
}

.ranking .item .record li > div:nth-child(2) > div:nth-child(2) > div:nth-child(1) a:hover {
    text-decoration: underline;
}

/* display
   ========================================================================== */
.disnon {
  display: none;
}


/*===================line@======================*/


/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/


/*トークコンテンツ(右カラム)*/


/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/

.line-col-right {
  padding: 0;
  border-left: 1px solid #CCC;
}
@media (max-width: 767px) {
  .line-col-right {
    border-left: none;
  }
}

/*トークタイトル*/

.line-talk-title {
  padding: 13px 10px 13px 20px;
  border-bottom: 1px solid #CCC;
}

/*トークエリア*/

.line-talk-area-wrapper {
  display: flex;
  flex-direction: column;
  height: 60vh;
  min-height: 600px;
}
.line-talk-area-shortview {
  position: absolute;
  top: 0;
  right: 20px;
  border-radius: 0 0 4px 4px;
  padding: 8px 12px;
  font-size: 12px;
  border-bottom: 1px solid #CCC;
  border-right: 1px solid #CCC;
  border-left: 1px solid #CCC;
  background: #ffffff;
  color: #8c8c8c;
  z-index: 1;
  text-decoration: none;
}
a:hover.line-talk-area-shortview {
  background: #f39800!important;
  color: #FFF!important;
  box-shadow: inset 0 99999px 0 rgba(255, 255, 255, .50);
  text-decoration: none;
}
a:focus.line-talk-area-shortview {
  background: #fff;
  color: #8c8c8c;

  box-shadow: inset 0 99999px 0 rgba(255, 255, 255, .50);
  text-decoration: none;
}
.line-talk-area-shortview.active {
  background: #f39800;
  color: #FFF;
  text-decoration: none;
}
a:hover.line-talk-area-shortview.active {
  background: #f39800;
  color: #FFF;
  box-shadow: inset 0 99999px 0 rgba(255, 255, 255, .50)!important;
  text-decoration: none;
}
a:focus.line-talk-area-shortview.active {
  background: #f39800;
  color: #FFF;
  box-shadow: none;
  text-decoration: none;
}
.line-talk-area {
  width: 100%;
  margin: 0;
  overflow-y: scroll;
  height: 100%
}
.line-content-goback {
  margin: 0 0 20px 0;
  border-bottom: 1px dashed #CCC;
  background: #F6F6F6;
}
.line-content-goback:hover,
.line-content-goback:focus,
.line-content-goback:active,
.line-content-goback.active {
  background: #FFF;
  cursor: pointer;
  border-bottom: 1px dashed #CCC;
}
.line-content-datebar {
  padding: 20px 20px 0 20px;
  margin: 0 0 20px 0;
}
.line-content-right {
  padding: 0 0 0 20px;
  margin: 0 0 20px 0;
  text-align: right;
}
.line-content-left {
  padding: 0 0 0 20px;
  margin: 0 0 20px 0;
}
.line-content-inner {
  display: inline-block;
  max-width: 85%;
}
.line-content-timestamp {
  font-size: 10px;
  color: #959595;
  display: inline-block;
  vertical-align: bottom;
}
.line-content-timestamp p {
  margin: 0;
}
.line-content-img-flex {
  height: auto;
  width: 100%;
  max-width: 200px;
}
.line-contact-list li.focused {
  background: #eaffd6;
}
li.active .line-contact-stuckpin-bg {
  position: absolute;
  top: 0;
  left: 0px;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 30px 0 0;
  border-color: #fff transparent transparent transparent;
}
.line-contact-stuckpin-star {
  position: absolute;
  top: 2px;
  left: 2px;
  color: #FFF !important;
  z-index: 1;
}
li.active .line-contact-stuckpin-star,
li:hover .line-contact-stuckpin-star {
  color: #e8ebf2 !important;
}
.line-contact-stuckpin-star.active,
li:hover .line-contact-stuckpin-star.active,
li.active:hover .line-contact-stuckpin-star.active,
li.active .line-contact-stuckpin-star.active {
  color: #f39800 !important;
}
.line-contact-stuckpin-bg {
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 30px 0 0;
  border-color: #fff transparent transparent transparent;
}
.line-contact-stuckpin-star.active + .line-contact-stuckpin-bg {
  border-color: #e8ebf2 transparent transparent transparent;
}
li.active .line-contact-stuckpin-star.active + .line-contact-stuckpin-bg,
li:hover .line-contact-stuckpin-star.active + .line-contact-stuckpin-bg {
  border-color: #FFF transparent transparent transparent;
}

/* ------ line-contact-tag ------ */

.line-contact-status-1 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 0 0 30px;
  border-color: transparent transparent transparent #d9534f;
}
.line-contact-status-2 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 0 0 30px;
  border-color: transparent transparent transparent #f0ad4e;
}
.line-contact-status-3 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 0 0 30px;
  border-color: transparent transparent transparent #5cb85c;
}
.line-contact-status-4 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 0 0 30px;
  border-color: transparent transparent transparent #5bc0de;
}
.line-contact-status-5 {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 0;
  width: 0;
  border-style: solid;
  border-width: 30px 0 0 30px;
  border-color: transparent transparent transparent #baa1ca;
}

/*入力欄*/

.line-input-area {
  border-top: 1px solid #CCC;
  background: #FFF;
  width: 100%;
  min-height: 116px;
  flex: 0 0 auto;
}
.line-input-macro {
  border-top: 1px solid #CCC;
  padding: 10px 10px 5px 10px;
  flex: 0 0 auto;
}
@media (max-width: 767px) {
  .line-input-macro {
    border-bottom: 1px solid #CCC;
  }
}
.line-input-area textarea {
  margin: 0;
  padding: 10px;
  border: none;
  box-shadow: none!important;
  overflow-y: scroll;
  min-height: 53px;
  max-height: 300px;
  border-bottom: 1px dashed #e4e4e4;
}
.line-input-area a i {
  font-size: 24px;
  vertical-align: middle;
  color: #959595;
}
.line-input-area a:hover i {
  color: #33b3ed;
}
.line-input-area .uploadifive-button input {
  cursor: pointer!important;
}
.line-input-area .uploadifive-button:hover i {
  color: #33b3ed!important;
}
.line-short-link {
  background: #f0f0f0;
  border: 1px solid #cecece;
  border-radius: 6px;
  padding: 10px;
  word-break: break-all;
  display: inline-block;
  min-width: 50%;
}
.line-short-link-active {
  background: #cce198;
  border: 1px solid #1dcd00;
  border-radius: 6px;
  padding: 10px;
  word-break: break-all;
  display: inline-block;
  min-width: 50%;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝*/


/*コンタクト管理（左カラム）*/


/*＝＝＝＝＝＝＝＝＝＝＝＝＝*/

.line-col-left {
  padding: 0;
}

/*コンタクト検索*/

.line-contact-search {
  padding: 10px;
  border-bottom: 1px solid #CCC;
}
.line-contact-search i {
  color: #959595;
}

/*コンタクトリスト*/

.line-contact-list {
  height: 60vh;
  min-height: 600px;
  position: relative;
  display: flex;
  flex-direction: column;
}
.line-contact-list i {
  color: #959595;
}
@media (max-width: 767px) {
  .line-contact-list {
    max-height: 335px;
  }
}
.line-contact-list ul,
.line-contact-list li {}
.line-contact-list ul {
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  list-style: none;
}
.line-contact-list li {
  font-size: 10px;
  line-height: normal;
  border-bottom: 1px solid #EEE;
}
.line-contact-list li:hover,
.line-contact-list li:focus,
.line-contact-list li:active,
.line-contact-list li.active {
  background: #e8ebf2;
  cursor: pointer;
}
.line-contact-icon {
  margin: 10px 7px 10px 10px;
  display: inline-block;
  width: 46px;
  height: 46px;
}
.line-contact-icon img {
  width: 46px;
  height: 46px;
}
.line-contact-info-wrapper {
  display: inline-block;
  vertical-align: middle;
  max-width: 51%;
  padding: 10px 0;
}
.line-contact-info-title {
  font-size: 12px;
  font-weight: bold;
  width: 100px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.line-contact-info-comment {
  color: #959595;
}
.line-contact-info-recent {
  color: #959595;
  position: absolute;
  top: 10px;
  right: 10px;
}
.line-contact-info-badge {
  position: absolute;
  top: 26px;
  right: 0;
  display: inline-block;
  width: 34px;
  padding: 3px 0px;
  font-size: 11px;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  background-color: #0bc060;
  border-radius: 10px;
}
.line-contact-more {
  background: #F6F6F6;
  line-height: 66px;
  padding: 0 0 0 20px;
}
.line-contact-more:hover,
.line-contact-more:focus,
.line-contact-more:active,
.line-contact-more.active {
  background: #fff;
  cursor: pointer;
}
.line-contact-pagination {
  padding: 10px 10px 5px 10px;
  border-top: 1px solid #CCC;
  width: 100%;
  flex-shrink: 0;
}




/* ==========================================================================
   consulting
   ========================================================================== */
   table.consulting {
     width:100%;
     margin-bottom:30px;
   }
   table.consulting th,
   table.consulting td{
     background:#fff;
     border-top:1px solid #ddd;
     border-bottom:1px solid #ddd;
     padding: 12px 0 8px 0 ;
     font-size: 14px
   }
   @media (min-width: 768px){
   table.consulting td{
     font-size: 16px
     }
   }

   table.consulting thead th{
     border-top:none;
     font-size: 13px;
      padding: 17px 0 13px 0;
   }
   table.consulting thead th span{
     font-size:10px;
   }
   @media (min-width: 768px){
     table.consulting thead th span{
       padding: 0.6em 1em 0.4em;
       border-radius:6px;
       font-size: 12px;
     }
   }

  table.consulting thead th,
  table.consulting tbody td{
     text-align: center;
   }
   table.consulting tbody th{
     color:#0072ff;
   }
   table.consulting tbody td{
     color:#b5b5b5;
     font-size: 26px;
   }



/*     04-01 BOX-STYLE
   ========================================================================== */


/*     04-02 TITLE
   ========================================================================== */

.bdr-btm-1s-g {
  border-bottom: 1px solid #dddddd;
}
.bdr-btm-1d-g {
  border-bottom: 1px dashed #ddd;
}
.heading_lg,
.heading_md,
.heading_sm {
  position: relative;
}
.heading_lg h1 {
  margin: 0 0 20px 0;
  padding: 12px 15px 10px;
  font-weight: bold;
  font-size: 18px;
  border-radius: 6px;
  border: none;
  background: #959595;
  color: #fff;
}
.heading_md h2 {
  margin: 0 0 20px 0;
  padding: 7px 10px 4px 10px;
  font-weight: bold;
  font-size: 15px;
  border-top: 3px solid #959595;
  border-bottom: 1px dashed #959595;
  line-height: 26px;
}
.heading_sm h3 {
  font-size: 14px;
  padding: 5px 7px;
  margin: 0 0 10px 0;
  border-left: 5px solid #CCC;
  border-bottom: 1px dotted #ccc;
}
.heading_lg-link {
  position: absolute;
  top: 10px;
  bottom: 0;
  right: 10px;
}
.heading_md-link {
  position: absolute;
  top: 10px;
  bottom: 0;
  right: 5px;
}
.heading_sm-link {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 5px;
}
.heading_pay_lg h2 {
  font-size: 30px;
  color: #fff;
  font-weight: bold;
  position: relative;
  margin: 20px 0;
  padding: 15px 15px 12px;
  text-align: center;
  background: #ff9c00;
  display: block;
}
.heading_pay_lg h2:after {
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border: solid transparent;
  border-color: rgba(255, 255, 255, 0);
  border-top-color: #ff9c00;
  border-width: 15px;
  top: 100%;
  left: 50%;
  margin-left: -15px;
}
.heading_pay_lg h2 span {
  background: #009944;
  border-radius: 6px;
  padding: 1px 10px 0px;
  font-size: 20px;
  margin: 4px 10px 9px 0;
  line-height: 45px;
  vertical-align: text-bottom;
}
@media screen and (max-width: 767px) {
  .heading_pay_lg h2 span {
    vertical-align: middle;
  }
}
.heading_pay_md h2 {
  font-size: 20px;
  color: #f0ad4e;
  font-weight: bold;
  position: relative;
  margin: 20px 0 0;
  padding: 0 0 5px 0px;
}
.heading_pay_sm h3 {
    min-height: 25px;
    font-size: 16px;
    padding: 0 0 8px 0;
    position: relative;
    color: #f0ad4e;
    font-weight: bold;
    margin-bottom: 0;
}


/*     04-03 TEXT STYLE
   ========================================================================== */

.text-danger {
  color: #f00 !important;
}

/*     04-04 TABLE
   ========================================================================== */


/* 汎用クラス */

.th-fw-b th {
  font-weight: bold;
}
.th-fw-n th {
  font-weight: normal;
}
.td-fw-b td {
  font-weight: bold;
}
.td-fw-n td {
  font-weight: normal;
}

table.table tr > th {
  z-index: -1;
}
.modal-body table.table tr > th,
.panel-body table.table tr > th {
    z-index: auto;
}
/* -- table-var -- */

.table.table-var > thead > tr > th,
.table.table-var > tbody > tr > th,
.table.table-var > tr > th,
.table.table-var > thead > tr > td,
.table.table-var > tbody > tr > td,
.table.table-var > tr > td {
  border: 1px solid #ddd;
}
table.table.table-var > thead > tr > th,
table.table.table-var > tbody > tr > th,
table.table.table-var > tr > th {
  width: 25%;
  position: relative;
}
table.table.table-var > thead > tr > th .label,
table.table.table-var > tbody > tr > th .label,
table.table.table-var > tr > th .label {
  position: absolute;
  top: 50%;
  right: 8px;
  margin: -9px 0 0 0;
}
@media screen and (max-width: 767px) {
  .table.table-var > thead > tr > th,
  .table.table-var > tbody > tr > th,
  .table.table-var > tr > th,
  .table.table-var > thead > tr > td,
  .table.table-var > tbody > tr > td,
  .table.table-var > tr > td {
    display: block;
    width: 100% !important;
  }
  table.table.table-var > thead > tr > th,
  table.table.table-var > tbody > tr > th,
  table.table.table-var > tr > th {
    border: none;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    font-weight: bold;
    padding: 4px 6px;
  }
  table.table.table-var > thead > tr > td,
  table.table.table-var > tbody > tr > td,
  table.table.table-var > tr > td {
    padding-bottom: 15px;
    border: none;
  }
  .table.table-var > thead > tr:last-child > td:last-child,
  .table.table-var > tbody > tr:last-child > td:last-child,
  .table.table-var > tr:last-child > td:last-child {
    border-bottom: none;
  }
}

/* -- table-block -- */

.table.table-block {
  margin: 0;
}
.table.table-block > thead > tr,
.table.table-block > tbody > tr,
.table.table-block > tr {
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
  border-bottom: none;
  border-left: 1px solid #ddd;
}
.table.table-block > thead > tr:last-child,
.table.table-block > tbody > tr:last-child,
.table.table-block > tr:last-child {
  border-bottom: 1px solid #ddd;
}
.table.table-block > thead > tr > th,
.table.table-block > tbody > tr > th,
.table.table-block > tr > th,
.table.table-block > thead > tr > td,
.table.table-block > tbody > tr > td,
.table.table-block > tr > td {
  display: block;
  width: 100% !important;
}
.table.table-block > thead > tr > th,
.table.table-block > tbody > tr > th,
.table.table-block > tr > th {
  border: none;
  padding: 4px 6px;
  border-bottom: 1px solid #ddd;
}
.table.table-block > thead > tr > td,
.table.table-block > tbody > tr > td,
.table.table-block > tr > td {
  padding: 0;
  border: none;
  background: #FFF;
}

/* -- radio-table -- */

.table.radio-table {
  display: table;
  width: 100%;
  margin-bottom: 20px;
}
.radio-table-row:first-child {
  display: block;
  border: 1px solid #ddd;
}
.radio-table-row {
  display: block;
  border-top: none;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  border-left: 1px solid #ddd;
}
.radio-table-cell {
  display: table-cell;
  border-right: 1px solid #ddd;
  vertical-align: middle;
}

/* datepicker */

.datepicker table tr td:first-child {
	color: #F00;
}

.datepicker table tr td:last-child {
	color: #00F;
}

/* position-format */
table.table.position-format > thead > tr > th,
table.table.position-format > tbody > tr > th,
table.table.position-format > tr > th {
  position: unset!important;
}


/*     04-05 FORM
   ========================================================================== */

form .form-control-inline-block {
  display: inline-block;
  width: auto;
}
@media screen and (max-width: 767px) {
  form .form-control-inline-block {
    display: inline-block;
    width: 85%;
    margin-bottom: 10px;
  }
}

/*     04-06 BUTTON
   ========================================================================== */

.cursor-pointer {
  cursor: pointer;
}
.cursor-pointer:hover,
.cursor-pointer:hover:active,
.cursor-pointer.active {
  cursor: pointer;
  box-shadow: inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn:hover {
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn:focus {
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25)
}
.btn:hover:active {
  box-shadow: inset 0 0 0 rgba(0, 0, 0, .25), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn-xs:active,
.btn-group-xs:active > .btn {
  padding: 1px 5px 2px;
  margin: 1px 0 0 0;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-sm:active,
.btn-group-sm:active > .btn {
  padding: 4px 10px 5px;
  margin: 3px 0 0 0;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-lg:active,
.btn-group-lg:active > .btn {
  padding: 11px 16px 12px;
  margin: 4px 0 0 0;
  font-size: 18px;
  line-height: 1;
  border-radius: 6px;
}
.btn-xs:hover,
.btn-group-xs:hover > .btn {
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn-xs:focus,
.btn-group-xs:focus > .btn {
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25);
}
.btn-sm:hover,
.btn-group-sm:hover > .btn {
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn-sm:focus,
.btn-group-sm:focus > .btn {
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25);
}
.btn-lg:hover,
.btn-group-lg:hover > .btn {
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.btn-lg:focus,
.btn-group-lg:focus > .btn {
  box-shadow: inset 0 -4px 0 rgba(0, 0, 0, .25);
}
.btn-cancel {
  color: #fff;
  background-color: #a9a9a9;
}
.btn-cancel:hover {
  color: #fff;
  background-color: #a9a9a9;
}
.btn-cancel:focus,
.btn-cancel.focus {
  color: #fff;
  background-color: #a9a9a9;
}
.btn-cancel:active,
.btn-cancel.active,
.open > .dropdown-toggle.btn-cancel {
  color: #fff;
  background-color: #a9a9a9;
}
.btn-return {
  white-space: normal;
}
@media screen and (max-width: 991px) {
  #btn-menu-collapse {
    display: inline-block;
  }
}

/* entrance-btn */

a.entrance-btn-biz:hover,
a.entrance-btn-biz:focus,
a.entrance-btn-customer:hover,
a.entrance-btn-customer:focus {
  text-decoration: none;
}
.entrance-btn-biz:hover tr,
.entrance-btn-biz:hover td,
.entrance-btn-customer:hover th,
.entrance-btn-customer:hover td {
  opacity: 0.7;
}
.entrance-btn-biz:active table,
.entrance-btn-customer:active table {
  margin: 5px 0 -5px 0;
}
.entrance-btn-biz:active th,
.entrance-btn-biz:active td,
.entrance-btn-customer:active th,
.entrance-btn-customer:active td {
  box-shadow: none;
}
.entrance-btn-biz th {
  border-radius: 6px 0 0 6px;
  color: #fff;
  background: #067500;
  box-shadow: 0px 5px 0px #056800;
}
.entrance-btn-biz td {
  border-radius: 0 6px 6px 0;
  color: #fff;
  width: 100%;
  background: #079a00;
  box-shadow: 0px 5px 0px #068300;
}
.entrance-btn-customer th {
  border-radius: 6px 0 0 6px;
  color: #fff;
  background: #ff9000;
  box-shadow: 0px 5px 0px #ff7000;
}
.entrance-btn-customer td {
  border-radius: 0 6px 6px 0;
  color: #fff;
  width: 100%;
  background: #ffb400;
  box-shadow: 0px 5px 0px #ff9600;
}


/*new entrance-btn*/
.entrance-btn{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(0,0,0,.2);
  width:100px;
  position: relative;
}
.entrance-btn:hover{
  background:rgba(255,255,255,.2);
}
.entrance-btn.length2{
  width:205px
}
.entrance-btn.length3{
  width:311px
}

/*new entrance-btn tip*/
.entrance-btn .tip-new{
  background: #F00;
  height: 40px;
  width: 40px;
  position: absolute;
  top: 0;
  right: -20px;
  border-radius: 9999px;
  line-height: 40px;
  padding: 1px 0 0 2px;
  font-weight: bold;
  text-align: center;
  font-size: 12px;
}

/*new entrance-btn 2*/
.entrance-btn-ex-yellow{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(255,164,0,1);
  width:100px;
  position: relative;
}
.entrance-btn-ex-yellow:hover{
  background:rgba(255,164,0,.8);
}
.entrance-btn-ex-blue{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(0,169,206,1);
  width:100px;
  position: relative;
}
.entrance-btn-ex-blue:hover{
  background:rgba(0,169,206,.8);
}
.entrance-btn-ex-red{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(255,58,73,1);
  width:100px;
  position: relative;
}
.entrance-btn-ex-red:hover{
  background:rgba(255,58,73,.8);
}
.entrance-btn-ex-green{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgb(56,186,0,1);
  width:100px;
  position: relative;
}
.entrance-btn-ex-green:hover{
  background:rgb(56,186,0,.8);
}

.entrance-btn-user-yellow{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(255,137,0,1);
  width:100px;
  position: relative;
}
.entrance-btn-user-yellow:hover{
  background:rgba(255,137,0,.8);
}
.c-user-yellow{
  color: #ff8900 !important;
}
.entrance-btn-green{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(68,187,136,1);
  width:100px;
  position: relative;
}
.entrance-btn-green:hover{
  background:rgba(68,187,136,0.8);
}
.entrance-btn-yellow{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(255,170,0,1);
  width:100px;
  position: relative;
}
.entrance-btn-yellow:hover{
  background:rgba(255,170,0,0.8);
}
.entrance-btn-blue{
  text-align: center;
  color: #FFF!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(34,170,204,1);
  width:100px;
  position: relative;
}
.entrance-btn-blue:hover{
  background:rgba(34,170,204,0.8);
}

.entrance-btn-white{
  text-align: center;
  color: #333!important;
  border-radius: 6px;
  text-decoration: none!important;
  padding: 12px 0 0 0;
  background:rgba(255,255,255,1);
  width:100px;
  position: relative;
  border:solid 1px #ccc;
}
.entrance-btn-white:hover{
  background:rgba(242,242,242,1);
}

.entrance-btn-ex-yellow.pointer-ev-off,
.entrance-btn-ex-blue.pointer-ev-off,
.entrance-btn-ex-red.pointer-ev-off,
.entrance-btn-ex-green.pointer-ev-off,
.entrance-btn-green.pointer-ev-off,
.entrance-btn-yellow.pointer-ev-off,
.entrance-btn-blue.pointer-ev-off,
.entrance-btn-white.pointer-ev-off{
  background:rgba(228,228,228,1);
}

.entrance-btn-ex-yellow.pointer-ev-off:hover,
.entrance-btn-ex-blue.pointer-ev-off:hover,
.entrance-btn-ex-red.pointer-ev-off:hover,
.entrance-btn-ex-green.pointer-ev-off:hover,
.entrance-btn-green.pointer-ev-off:hover,
.entrance-btn-yellow.pointer-ev-off:hover,
.entrance-btn-blue.pointer-ev-off:hover,
.entrance-btn-white.pointer-ev-off:hover{
  background:rgba(228,228,228,0.8);
}


/*tip-corner-count*/
.entrance-btn:hover .tip-corner-count:before{border-top-color:#ff8888;border-right-color:#ff8888;}
                                  
.tip-corner-count{
  position: absolute;
  top:0;
  right:0;
  color:#FFF;
  z-index:0;
  font-weight:bold;
  font-size:12px;
  padding: 2px;
  width:27px;
  text-align: center;
}
.tip-corner-count:before{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-top: solid #f00 20px;
  border-right: solid #f00 20px;
  border-left: solid transparent 20px;
  border-bottom: solid transparent 20px;
  border-radius: 0 6px 0 0;
  z-index: -1;
}


/* btn active style */

.btn.active:hover {
  box-shadow: inset 0 4px 0 rgba(0, 0, 0, .0625), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.active.btn-xs:hover,
.btn-group-xs:hover > .btn.active {
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, .0625), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.active.btn-xs:focus,
.btn-group-xs:focus > .btn.active {
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, .0625);
}
.active.btn-sm:hover,
.btn-group-sm:hover > .btn.active {
  box-shadow: inset 0 3px 0 rgba(0, 0, 0, .0625), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.active.btn-sm:focus,
.btn-group-sm:focus > .btn.active {
  box-shadow: inset 0 3px 0 rgba(0, 0, 0, .0625);
}
.active.btn-lg:hover,
.btn-group-lg:hover > .btn.active {
  box-shadow: inset 0 4px 0 rgba(0, 0, 0, .0625), inset 0 99999px 0 rgba(255, 255, 255, .50);
}
.active.btn-lg:focus,
.btn-group-lg:focus > .btn.active {
  box-shadow: inset 0 4px 0 rgba(0, 0, 0, .0625);
}
.btn.disabled,
.btn:disabled{
    background: #e4e4e4;
    color: #FFF;
    opacity: 0.3!important;
}


.btn.disabled:hover,
.btn.disabled:focus,
.btn:disabled{
  box-shadow: none;
}



/*btn_v2規格*/
.btn-v2{ 
  border-radius: 4px; 
  overflow: hidden; 
  position: relative;
  pointer-events: inherit; 
  cursor:pointer;
}
.btn-v2_overlay{
  display:none; 
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-color:rgba(255,255,255,.5);
  pointer-events: none;
  cursor:pointer;
}
.btn-v2:hover .btn-v2_overlay{
  display:block;
}
.btn-v2_entity{}

/*ヘルプを出すアイコン*/
.tip-icon{
  line-height: 1;
  cursor: pointer;
  color:#bfbfbf;
  font-size: 18px;
}
.tip-icon:hover{color:#4dbb80;}

/*     04-07 LIST
   ========================================================================== */

.popup-bank-list {
  list-style: none;
  margin: 0;
  padding: 0;
  line-height: 0;
}
.popup-bank-list li {
  margin: 20px;
  font-size: 13px;
  line-height: 13px;
  position: relative;
  padding: 0 0 0 17px;
}
.popup-bank-list li i {
  margin: 0 5px 0 0;
  font-size: 13px;
  line-height: 20px;
  vertical-align: middle;
  color: #F6B37F;
  position: absolute;
  top: 0;
  left: 0;
}
.popup-bank-list li .popup-bank-list-title {
  font-size: 17px;
  line-height: 20px;
  text-decoration: underline;
  font-weight: bold;
  padding: 0 0 5px 0;
}
.popup-bank-list li .popup-bank-list-title:hover {
  color: #C00;
}
.popup-bank-list li .popup-bank-list-title span {
  font-size: 13px;
  line-height: 13px;
  font-weight: normal;
}


/*schedule-list*/

.schedule-list li {
    border-top: 1px solid #dddddd;
    padding: 8px 3px;
    position: relative;
}
.schedule-list li:last-child {
    border-bottom: 1px solid #ddd;
}


.schedule-icon {
    padding: 0 12px;
    flex: 0 0 auto;
    font-size: 25px;
    color: #999999;
    align-self: start;
}
@media screen and (max-width: 767px){
  .schedule-icon{
    padding:0 8px 0 1px;
  }
}
.schedule-content {
    flex: 1 1 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.text-return {
    text-overflow: unset;
    overflow: unset;
    white-space: unset;
    word-wrap: break-word;
}




/*     04-08 PANEL
   ========================================================================== */

.panel-userid-info {
  display: inline-block;
  letter-spacing: normal;
  font-size: 11px;
  line-height: 11px;
  padding: 7px 8px;
  color: #FFF;
}
@media (max-width: 767px) {
  .xs-panel-userid-info {
    display: inline-block;
    letter-spacing: normal;
    font-size: 10px;
    line-height: 10px;
    padding: 6px 5px 4px;
    color: #FFF;
  }
}


.panel-danger {
  border-color: #ebccd1;
}
.panel-danger > .panel-heading {
  color: #e92232;
  background-color: #ffd3d6;
  border-color: #ebccd1;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #ebccd1;
}
.panel-danger > .panel-heading .badge {
  color: #ffd3d6;
  background-color: #e92232;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #ebccd1;
}


/*     04-09 IMAGE
   ========================================================================== */

.img-flex {
  height: auto;
  width: 100%;
}
.circle {
  border-radius: 50%;
}

/*     04-10 HR
   ========================================================================== */


/*     04-11 INPUT
   ========================================================================== */

.label.label-essential {
  background: #ffa544;
  color: #ffffff;
  margin: 0 5px;
  float: right;
}
.label.label-optional {
  background: #ccc;
  color: #FFF;
  margin: 0 5px;
  float: right;
}
.label-status {
  color: #FFF;
  font-weight: bold;
  line-height: 1em;
  padding: 0.3em 0.6em;
  border-radius: 0.25em;
}

/*checkboxやradioの代替部品*/

input.hidden + label {
  cursor: pointer;
  margin-bottom: 0;
}
.radio-inline,
.checkbox-inline {
  padding-left: 26px;
}
input[type="radio"],
input[type="checkbox"] {
  line-height: normal;
  width: 22px;
  height: 22px;
  top: 50%;
  left: 22px;
  margin: -11px 0px 0px 0px;
}
.radio label,
.checkbox label {
  min-height: 22px;
  padding-left: 22px;
  line-height: 22px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;
}
.radio input[type="radio"],
.radio-inline input[type="radio"],
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
  position: absolute;
  margin-top: 4px \9;
  margin-left: -22px;
}
@media (max-width: 767px) {
  .radio-inline,
  .checkbox-inline {
  padding-left: 26px;
  }
  input[type="radio"],
  input[type="checkbox"] {
    margin: 0;
    margin-top: 1px \9;
    line-height: normal;
  }
  .radio input[type="radio"],
  .radio-inline input[type="radio"],
  .checkbox input[type="checkbox"],
  .checkbox-inline input[type="checkbox"] {
    line-height: normal;
    width: 22px;
    height: 22px;
    top: 50%;
    left: 0;
    margin: -11px 0px 0px 0px;
  }
}
.radio-style {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  background: #FFF;
  color: #ebebeb;
  text-align: center;
  border: 1px solid #bbb;
  cursor: pointer;
  margin: 0 5px 0 0;
}
input:checked + label .radio-style,
.radio-style.active,
.radio-style:active {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  border-radius: 50%;
  background: #ee7622;
  color: #FFFFFF;
  text-align: center;
  border: 1px solid #ee7622;
}
.checkbox-style {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  background: #FFF;
  color: #ebebeb;
  text-align: center;
  border: 1px solid #bbb;
  cursor: pointer;
  margin: 0 5px 0 0;
}
input:checked + label .checkbox-style,
.checkbox-style.active,
.checkbox-style:active {
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 24px;
  background: #ee7622;
  color: #FFFFFF;
  text-align: center;
  border: 1px solid #ee7622;
}
.radio-style-label,
.checkbox-style-label {
  display: inline-block;
  border-radius: 4px;
  line-height: 24px;
  font-weight: normal;
  vertical-align: middle;
  padding-top: 1px;
}

.disabled .radio-style,
.disabled .checkbox-style,
.radio-style.disabled,
.checkbox-style.disabled{
  background: #ebebeb!important;
  border: 1px solid #ebebeb!important;
  color: #FFF!important;
  cursor: not-allowed!important;
}

.disabled .radio-style-label,
.disabled .checkbox-style-label,
.radio-style-label.disabled,
.checkbox-style-label.disabled{
  color: #ebebeb!important;
  cursor: not-allowed!important;
}



/*     04-12 ALERT
   ========================================================================== */

#flashMessage {
  padding: 10px 15px;
  color: #e64c80;
  font-size: 1.5em;
  border: solid 1px #e64c80;
  border-radius: 4px;
  margin-bottom: 25px;
}
.alert i {
  position: absolute;
  top: 10px;
  left: 10px;
}
.alert-success {
  border: none;
  border-radius: 6px;
  font-weight: bold;
  padding: 10px 10px 10px 25px;
  background: #cce198;
  color: #3c763d;
  line-height: 160%;
  position: relative;
}
.alert-info {
  border: none;
  border-radius: 6px;
  font-weight: bold;
  padding: 10px 10px 10px 25px;
  background: #a0e3f7;
  color: #286090;
  line-height: 160%;
  position: relative;
}
.alert-warning {
  border: none;
  border-radius: 6px;
  font-weight: bold;
  padding: 10px 10px 10px 25px;
  background: #fff799;
  color: #ee7622;
  line-height: 160%;
  position: relative;
}
.alert-danger {
  border: none;
  border-radius: 6px;
  font-weight: bold;
  padding: 10px 10px 10px 25px;
  background: #ffd3d6;
  color: #e92232;
  line-height: 160%;
  position: relative;
}

/*     04-13 TAB
   ========================================================================== */


/* tab-sm
   ========================================================================== */

#tab-sm {
  height: 40px;
  border-bottom: 2px solid #5fab51;
  font-weight: bold;
  background: #b9d4a5;
}
#tab-sm .tab-tit {
  background: #333;
  padding: 6px 7px 4px;
  border-radius: 3px;
  color: #FFF;
  font-weight: bold;
  margin: 7px 3px 0px 5px;
  float: left;
  font-size: 11px;
}
#tab-sm ul {
  display: block;
  list-style: none;
  margin: 0;
}
#tab-sm ul > li {
  float: left;
  text-align: center;
  margin: 6px 2px 0;
}
#tab-sm ul > li a {
  color: #444;
  border-radius: 3px;
  border: 1px solid #c0c0c0;
  display: block;
  text-decoration: none;
  font-size: 12px;
  padding: 5px 12px 3px;
  box-shadow: #FFF 0px 0px 0px 1px inset;
  -webkit-box-shadow: #FFF 0px 0px 0px 1px inset;
  -moz-box-shadow: #FFF 0px 0px 0px 1px inset;
  background: #fefefe;
  /* Old browsers */
  background: -moz-linear-gradient(top, #fefefe 0%, #f0f0f0 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fefefe), color-stop(100%, #f0f0f0));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #fefefe 0%, #f0f0f0 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #fefefe 0%, #f0f0f0 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #fefefe 0%, #f0f0f0 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #fefefe 0%, #f0f0f0 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f0f0f0', GradientType=0);
  /* IE6-9 */
}
#tab-sm .active a,
#tab-sm ul > li a:hover {
  color: #333;
  text-shadow: none;
  border: 2px solid #5fab51;
  border-radius: 4px 4px 0 0;
  padding: 4px 11px 1px;
  margin: -10px 0 0 0;
  line-height: 37px;
  border-bottom: none;
  background: #f0f0f0;
  /* Old browsers */
  background: -moz-linear-gradient(top, #f0f0f0 0%, #ffffff 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f0f0f0), color-stop(100%, #ffffff));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #f0f0f0 0%, #ffffff 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #f0f0f0 0%, #ffffff 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #f0f0f0 0%, #ffffff 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #f0f0f0 0%, #ffffff 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#ffffff', GradientType=0);
  /* IE6-9 */
}

/* calendar
   ========================================================================== */

.calendar {
  padding-left: 15px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
}
.calendar ul {
  padding-left: 20px;
  margin-bottom: 0px;
  display: inline-block;
  vertical-align: middle;
}
.calendar-year {
  display: inline-block;
  line-height: 40px;
  vertical-align: middle;
}
.calendar-year > p.calendar-left,
.calendar-year > a.calendar-left {
  float: left;
}
.calendar-year > p.calendar-right,
.calendar-year > a.calendar-right {
  float: right;
}
.calendar_on_right {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: -115px -5px;
  display: block;
}
.calendar_on_left {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: 0px -5px;
  display: block;
}
.calendar_off_right {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: -115px -88px;
  display: block;
}
.calendar_off_left {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: 0px -88px;
  display: block;
}

/*hover css*/

a.calendar_on_right:hover {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: -115px -47px;
  display: block;
}
a.calendar_on_left:hover {
  height: 22px;
  width: 10px;
  background: url(../../img/entre/calendar_sprite.png) no-repeat;
  background-position: 0px -47px;
  display: block;
}
.calendar-year > h2 {
  font-size: 20px;
  font-weight: bold;
  margin: 0;
  float: left;
  padding: 0 8px;
}
.calendar-year > h2 > span {
  font-size: 14px;
}
.calendar-month {
  font-size: 15px;
  font-weight: bold;
  list-style: none;
  border-right: 1px dotted #AAAAAA;
  display: inline-block;
  margin: 8px 0 9px 0;
}
.calendar-month:first-child {
  border-left: 1px dotted #AAAAAA;
}
.calendar-month a {
  color: #7A7A7A;
  padding: 0px 8px;
  text-decoration: none;
}
.calendar-month a:hover {
  border-bottom: 3px solid #5FAB51;
}
.calendar-month-off a {
  color: #ECECEC;
  border-right: 1px dotted #ECECEC;
}
.calendar-month-off a:hover {
  color: #ECECEC;
  border-bottom: none;
}
.calendar-month-active {
  border-bottom: 3px solid #5FAB51;
}

/* ==========================================================================
   05 POPUP
   ========================================================================== */

.line-sticker-select {
  height: 280px;
  overflow-y: auto;
}
.line-sticker-select ul {
  margin: 0;
  padding: 0;
  line-height: 0;
  font-size: 0;
  list-style: none;
}
.line-sticker-select li {
  display: inline-block;
}
.line-sticker-select li:hover,
.line-sticker-select li:focus,
.line-sticker-select li:active,
.line-sticker-select li.active {
  background: #e8ebf2;
  cursor: pointer;
}
.line-sticker-nav ul li:hover a,
.line-sticker-nav ul li:focus a,
.line-sticker-nav ul li:active a,
.line-sticker-nav ul li.active a {
  background: #e8ebf2!important;
  cursor: pointer;
  border: 1px solid #ddd!important;
}
.line-sticker-nav ul li a {
  line-height: 50px;
  width: 50px;
  padding: 0;
}



/*expa-toast用クラス*/
/*expa-toasterの右下に出す場合のスタイル*/
  .toasted-container.expa-toaster.bottom-right {
    right: 16px;
    bottom: 16px;
  }
  .toasted-container.expa-toaster.top-right {
    top: 72px;
    right: 32px;
  }
  .toasted-container.expa-toaster.bottom-left {
    bottom: 16px;
    left: 450px;
  }
  @media (min-width: 768px) {
   .toasted-container.expa-toaster.bottom-right {
      right: 32px;
      bottom: 32px;
    }
  }
  
  /*expa-toastの基礎クラス*/
  .toasted .expa-toast, .toasted.expa-toast {
    display: flex;
    border-radius: 4px;
    background-color: rgba(51, 51, 51, .7);
    padding: 8px 16px;
    color:#FFF;
  }

  /*expa-toastの内部のアイコン*/
  .toasted-container.expa-toaster i{font-size: 48px;line-height: 32px;margin-right: 8px;flex: 0 0 auto;}
  /*expa-toastのメッセージ部分の入れ物*/
  .toasted-container.expa-toaster .text-box{display: block;line-height: 1.6;flex: 0 0 auto;max-width: 192px;padding-right: 16px;}
  /*expa-toastのメッセージ部分のタイトル部*/
  .toasted-container.expa-toaster .text-box .heading{font-weight:bold;font-size: 16px;}
  /*expa-toastのメッセージ部分のメッセージ部*/
  .toasted-container.expa-toaster .text-box .message{font-size: 12px;}
  /*expa-toastのアクションボタン部分*/
  .toasted-container.expa-toaster a.action.expa-toast-action i{font-size: 16px;line-height: 16px;color: #FFF;margin: 0;}


/*accent指定群*/
/*アクセントカラーに変色するパネル関連*/
/*エディター内部のアクセントのカラー指定
何もつけないとデフォルト（青灰）
.accent-green
.accent-blue
.accent-yellow
.accent-gray
.accent-l-yellow
.accent-emerald-green
}
*/

/*.c-accent       文字色をアクセントカラーに変更する*/
/*.bd-c-accent    ボーダーカラーをアクセントカラーに変更する*/
/*.h-bgc-accent   背景色をアクセントカラーに変更する*/


.accent-green .selectable.selected{
  border-color:#38ba00!important;
}
.accent-blue .selectable.selected{
  border-color:#00A9CE!important;
}
.accent-yellow .selectable.selected{
  border-color:#ffa400!important;
}
.accent-red .selectable.selected{
  border-color:#FF3A49!important;
}
.accent-gray .selectable.selected{
  border-color:#555555!important;
}
.accent-l-yellow .selectable.selected{
  border-color:#FFCC00!important;
}
.accent-emerald-green .selectable.selected{
  border-color:#4DBB80!important;
}
.accent-gray .selectable.bd-c-accent_darktheme.selected{
  border-color:#cccccc!important;
}


.accent-green .checkable.checked{
  border-color:#38ba00!important;
}
.accent-blue .checkable.checked{
  border-color:#00A9CE!important;
}
.accent-yellow .checkable.checked{
  border-color:#ffa400!important;
}
.accent-red .checkable.checked{
  border-color:#FF3A49!important;
}
.accent-gray .checkable.checked{
  border-color:#555555!important;
}
.accent-emerald-green .checkable.checked{
  border-color:#4DBB80!important;
}


/*アクセントカラー　フォントカラー*/
.c-accent,.c-accent i{color:#778899;}

.accent-green .c-accent,
.accent-green i{
color:#38ba00;
}
.accent-blue .c-accent,
.accent-blue i{

color:#00a9ce;
}
.accent-yellow .c-accent,
.accent-yellow i{
color: #ffa400;
}
.accent-red .c-accent,
.accent-red i{
color:#FF3A49;

}
.accent-gray .c-accent,
.accent-gray i{
color:#555555;
}
.accent-l-yellow .c-accent,
.accent-l-yellow i{
  color:#FFCC00;
}
.accent-emerald-green .c-accent,
.accent-emerald-green i{
  color:#4DBB80;
}

.accent-gray .c-accent_darktheme,
.accent-gray i.c-accent_darktheme{
  color:#CCCCCC;
}

/*アクセントカラー　背景色*/
.bgc-accent{
  color:#fff!important;
  background-color:#778899!important;
}

.accent-green .bgc-accent{
color:#fff!important;
background-color:#38ba00!important;
}
.accent-blue .bgc-accent{
color:#fff!important;
background-color:#00a9ce!important;
}
.accent-yellow .bgc-accent{
color:#fff!important;
background-color:#ffa400!important;
}
.accent-red .bgc-accent{
color:#fff!important;
background-color:#FF3A49!important;
}
.accent-gray .bgc-accent{
color:#fff!important;
background-color:#555555!important;
}
.accent-l-yellow .bgc-accent{
color:#fff!important;
background-color:#ffcc00!important;
}
.accent-emerald-green .bgc-accent{
  color:#fff!important;
  background-color:#4DBB80!important;
}


.bgc-l-accent{
background-color:#bbccdd!important;
}
.accent-green .bgc-l-accent{
background-color:#EAF7E4!important;
}
.accent-blue .bgc-l-accent{
background-color: #E4F5F9!important;
}
.accent-yellow .bgc-l-accent{
background-color: #FFF5E4!important;
}
.accent-red .bgc-l-accent{
background-color: #FFEAEB!important;
}
.accent-gray .bgc-l-accent{
background-color: #EDEDED!important;
}
.accent-l-yellow .bgc-l-accent{
background-color: #FFFAE5!important;
}
.accent-emerald-green .bgc-l-accent{
  background-color:#EDF8F2!important;
}

/*アクセントカラー　ボーダーカラー*/
.bd-c-accent{
border-color:#778899!important;
}

.accent-green .bd-c-accent{
border-color:#38ba00!important;
}
.accent-blue .bd-c-accent{
border-color: #00a9ce!important;
}
.accent-yellow .bd-c-accent{
border-color: #ffa400!important;
}
.accent-red .bd-c-accent{
border-color: #FF3A49!important;
}
.accent-gray .bd-c-accent{
border-color: #555555!important;
}
.accent-l-yellow .bd-c-accent{
border-color: #ffcc00!important;
}
.accent-emerald-green .bd-c-accent{
border-color:#4DBB80!important;
}
/* .accent-gray .bd-c-accent_darktheme{
  border-color: #CCCCCC!important;
} */

/*アクセントカラー　ホバーカラー*/
.h-bgc-accent:hover,
.h-bgc-accent:hover select{
background-color:#F0F2F4!important;
}

.accent-green .h-bgc-accent:hover,
.accent-green .h-bgc-accent:hover select{
background-color:#EAF7E4!important;
}
.accent-blue .h-bgc-accent:hover,
.accent-blue .h-bgc-accent:hover select{
background-color: #E4F5F9!important;
}
.accent-yellow .h-bgc-accent:hover,
.accent-yellow .h-bgc-accent:hover select{
background-color: #FFF5E4!important;
}
.accent-red .h-bgc-accent:hover,
.accent-red .h-bgc-accent:hover select{
background-color: #FFEAEB!important;
}
.accent-gray .h-bgc-accent:hover,
.accent-gray .h-bgc-accent:hover select{
background-color: #EDEDED!important;
}
.accent-l-yellow .h-bgc-accent:hover,
.accent-l-yellow .h-bgc-accent:hover select{
background-color: #FFFAE5!important;
}
.accent-emerald-green .h-bgc-accent:hover,
.accent-emerald-green .h-bgc-accent:hover select{
  background-color:#EDF8F2!important;
}


.h-bgc-accent.active,
.h-bgc-accent .active,
.h-bgc-accent.active:hover,
.h-bgc-accent .active:hover{
  color:#fff!important;
  background-color:#778899!important;
}

.accent-green .h-bgc-accent.active,
.accent-green .h-bgc-accent .active,
.accent-green .h-bgc-accent.active:hover,
.accent-green .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#38ba00!important;
}
.accent-blue .h-bgc-accent.active,
.accent-blue .h-bgc-accent .active,
.accent-blue .h-bgc-accent.active:hover,
.accent-blue .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#00a9ce!important;
}
.accent-yellow .h-bgc-accent.active,
.accent-yellow .h-bgc-accent .active,
.accent-yellow .h-bgc-accent.active:hover,
.accent-yellow .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#ffa400!important;
}
.accent-red .h-bgc-accent.active,
.accent-red .h-bgc-accent .active,
.accent-red .h-bgc-accent.active:hover,
.accent-red .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#FF3A49!important;
}
.accent-gray .h-bgc-accent.active,
.accent-gray .h-bgc-accent .active,
.accent-gray .h-bgc-accent.active:hover,
.accent-gray .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#555555!important;
}
.accent-l-yellow .h-bgc-accent.active,
.accent-l-yellow .h-bgc-accent .active,
.accent-l-yellow .h-bgc-accent.active:hover,
.accent-l-yellow .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#ffcc00!important;
}

.accent-emerald-green .h-bgc-accent.active,
.accent-emerald-green .h-bgc-accent .active,
.accent-emerald-green .h-bgc-accent.active:hover,
.accent-emerald-green .h-bgc-accent .active:hover{
color:#fff!important;
background-color:#4DBB80!important;
}


/*使用不能時のスタイル*/
.disable,.disable i{
color: #f2f2f2!important;
pointer-events: none;
}


.accent-hanten .c-accent,
.accent-green .accent-hanten .c-accent,
.accent-blue .accent-hanten .c-accent,
.accent-yellow .accent-hanten .c-accent,
.accent-red .accent-hanten .c-accent,
.accent-gray .accent-hanten .c-accent,
.accent-l-yellow .accent-hanten .c-accent,
.accent-emerald-green .accent-hanten .c-accent{
  color:#fff!important;
}

.accent-hanten .h-bgc-accent,
.accent-hanten .h-bgc-accent:hover{
  background-color:#778899!important;
}

.accent-green .accent-hanten .h-bgc-accent,
.accent-green .accent-hanten .h-bgc-accent:hover{
background-color:#38ba00!important;
}
.accent-blue .accent-hanten .h-bgc-accent,
.accent-blue .accent-hanten .h-bgc-accent:hover{
background-color:#00a9ce!important;
}
.accent-yellow .accent-hanten .h-bgc-accent,
.accent-yellow .accent-hanten .h-bgc-accent:hover{
background-color:#ffa400!important;
}
.accent-red .accent-hanten .h-bgc-accent,
.accent-red .accent-hanten .h-bgc-accent:hover{
background-color:#FF3A49!important;
}
.accent-gray .accent-hanten .h-bgc-accent,
.accent-gray .accent-hanten .h-bgc-accent:hover{
background-color:#555555!important;
}
.accent-l-yellow .accent-hanten .h-bgc-accent,
.accent-l-yellow .accent-hanten .h-bgc-accent:hover{
background-color:#ffcc00!important;
}
.accent-emerald-green .accent-hanten .h-bgc-accent,
.accent-emerald-green .accent-hanten .h-bgc-accent:hover{
background-color:#4DBB80!important;
}


.h-accent-hanten:hover .c-accent,
.accent-green .h-accent-hanten:hover .c-accent,
.accent-blue .h-accent-hanten:hover .c-accent,
.accent-yellow .h-accent-hanten:hover .c-accent,
.accent-red .h-accent-hanten:hover .c-accent,
.accent-gray .h-accent-hanten:hover .c-accent,
.accent-l-yellow .h-accent-hanten:hover .c-accent,
.accent-emerald-green .h-accent-hanten:hover .c-accent{
  color:#fff!important;
}
.h-accent-hanten:hover .h-bgc-accent{
  background-color:#778899!important;
}
.accent-green .h-accent-hanten:hover .h-bgc-accent{
background-color:#38ba00!important;
}
.accent-blue .h-accent-hanten:hover .h-bgc-accent{
background-color:#00a9ce!important;
}
.accent-yellow .h-accent-hanten:hover .h-bgc-accent{
background-color:#ffa400!important;
}
.accent-red .h-accent-hanten:hover .h-bgc-accent{
background-color:#FF3A49!important;
}
.accent-gray .h-accent-hanten:hover .h-bgc-accent{
background-color:#555555!important;
}
.accent-l-yellow .h-accent-hanten:hover .h-bgc-accent{
background-color:#ffcc00!important;
}
.accent-emerald-green .h-accent-hanten:hover .h-bgc-accent{
background-color:#4DBB80!important;
}


.accent-blue .edtr-h3:before {border-color: #00a9ce!important;}
.accent-green .edtr-h3:before {border-color: #38ba00!important;}
.accent-yellow .edtr-h3:before {border-color: #ffa400!important;}
.accent-red .edtr-h3:before {border-color: #FF3A49!important;}
.accent-gray .edtr-h3:before {border-color: #555555!important;}
.accent-l-yellow .edtr-h3:before {border-color: #ffcc00!important;}
.accent-emerald-green .edtr-h3:before {border-color: #4DBB80!important;}



/*グローバルヘッダー用固有パーツ*/
/*さいぽん用navbar指定*/
.navbar-saipon{
  /*margin-bottom:86px;*/
}
@media (min-width: 992px){
  .navbar-saipon{
    margin-bottom:64px;
  }
}
/*.navbar.navbar-saipon .navbar-brand{
  display: flex;
  justify-content: center;
  flex-direction: column;
  height: 50px;
  width: auto;
  left: 8px;
  position: relative;
  padding: 0;
}*/
@media (min-width: 992px){
  .navbar.navbar-saipon .navbar-brand{
    display: flex;
    height: 50px;
    width: auto;
    left: 8px;
    position: relative;
    padding: 0;
    align-items: center;
    flex-direction: row;
  }
}
.edtr-navbar-addinfo{
  position: absolute;
  width: 100%;
  max-width:320px;
  top: auto;
  right:0;
}
@media (min-width: 768px){
  .edtr-navbar-addinfo{
    max-width: none;
    width: auto;
    top: 0px;
  }
}
.edtr-navbar-addinfo-inner{
  display: flex;
  border-right: 1px solid #eee;
  border-left: 1px solid #eee;
  /* border: 1px solid #eee; */
  /* border-radius: 0 0 8px 8px; */
  overflow: hidden;
}

.edtr-navbar-btn-upgrade{
  flex:0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height:48px;
  padding:4px;
  color:#ffffff;
  position: relative;
  cursor: pointer;
  background: #ffcc00;
  background: -moz-linear-gradient(top, #ffcc00 0%, #ffa400 100%);
  background: -webkit-linear-gradient(top, #ffcc00 0%,#ffa400 100%);
  background: linear-gradient(to bottom, #ffcc00 0%,#ffa400 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcc00', endColorstr='#ffa400',GradientType=0 );
  width:146px;
  border-right: 1px solid #EEE;
  cursor: pointer;
}
.edtr-navbar-btn-upgrade:hover:after{
  content: "";
  display: block;
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-color:rgba(255,255,255,.7);
  pointer-events: inherit;
}

.edtr-navbar-btn-afranking{
  flex:0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height:40px;
  padding: 4px;
  color: #555555;
  position: relative;
  background: #ffffff;
  border-right: 1px solid #EEE;
}

.edtr-navbar-publish-status{
  flex:1 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height:38px;
  padding:4px;
  color:#555555;
  position: relative;
  background-color:#FFFFFF;
}
@media (min-width: 768px){
  .edtr-navbar-btn-upgrade{
    width:auto;
    padding:8px;
  }
  .edtr-navbar-publish-status{
    padding:0px;
  }
  .edtr-navbar-btn-afranking{
    padding:8px;
  }
}


/*ページ一覧画面用固有クラス*/
/*ページ一覧画面用の指定*/
.edtr-pageindex-item{
  background-color:#FFF;
  border:solid 1px #CCC;
  border-radius:16px;
  padding:16px;
}
.edtr-pageindex-item-title{
  margin-bottom:8px;
  height: 61px;
}
.edtr-pageindex-item-data{
  display: flex;
  margin-bottom:8px;
  height: 162px;
}
.edtr-pageindex-item-edit{
  height: 54px;
}

.edtr-pageindex-groupindex{
  display: block;
  flex-wrap: wrap; 
  background-color:#FFF; 
  border:solid 1px #CCC; 
  border-radius:16px;
  padding:16px 16px 8px 16px;
}
.edtr-pageindex-groupindex > div{
  flex:0 0 auto;
}

/*select要素の装飾を取り去る指定*/
.select-plain{
  -webkit-appearance: none; /* Webkit */
  -moz-appearance: none; /* FF */
  -ms-appearance: none; /* Edge */
  appearance: none; /* Future */
}
.select-plain::-ms-expand {
  display: none;
}
              
/*汎用的に振る舞うツールチップ*/
.edtr-tooltip{
  display: inline-block;
  position: relative;
} 
.edtr-tooltip .edtr-tooltip-content{
  display: none;
}
.edtr-tooltip:hover .edtr-tooltip-content{
  display: inline-block;
  position: absolute;
  top: -35px;
  left: -100%;
  width: 5em;
  text-align: center;
  background-color: #555;
  color: #FFF;
  padding: 4px;
  font-size: 12px;
  z-index: 1;
  border-radius: 4px;
}
.edtr-tooltip:hover .edtr-tooltip-content:after{
  position: absolute;
  bottom: -6px;
  right: calc(50% - 4px);
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #555;
}



/*ページ一覧画面のフッター用指定*/
footer.saipon-footer {
    background:transparent;
    padding: 16px 0;
    text-align: center;
    margin: 0;
}

footer.saipon-footer .footer-credit {
    font-size: 12px;
    font-weight: bold;
    margin: 0 auto;
    color: #CCCCCC;
    line-height: auto;
  display: flex;
  align-content: center;
  justify-content: center;
}

/*フラットボタン　白*/
.edtr-btn-flat-white{
  display: inline-block;
  border-style: solid;
  border-width: 1px;
  border-color:#FFF;
  border-radius: 8px;
  background-color:#FFF;
  color:#555;
  padding:8px;
  cursor:pointer;
  position: relative;
  margin-right:8px;
  margin-bottom:8px;
  vertical-align: middle;
}
.edtr-btn-flat-white:hover:after,
.edtr-btn-flat-white.active:after{
  content: "";
  display: block;
  position: absolute;
  top:-1px;
  right:-1px;
  bottom:-1px;
  left:-1px;
  background-color:rgba(0,0,0,.1);
  pointer-events: inherit;
  border-radius: 8px;
}


/*login画面用指定群*/
/*ボタンの挙動をするものに適用する*/
/*ボタン内部のアイコン*/
.btn-login-icon{
  display: inline-block;
  float: left;
  height: 21px;
  width: 21px;
  margin-right: 4px;
}


/*丸い入力欄*/
.form-section-casual input{
  border: 1px solid #ccc;
  border-radius: 9999px;
  width: 100%;
  padding: 8px;
  height: 48px;
  box-shadow: none;
}


/*アイコン+フォームパーツ用指定*/
.icon-form-wrapper{
  position: relative;
}
.icon-form-wrapper input{
  padding-left: 48px;
}
.icon-form-wrapper i{
  position: absolute;
  left: 20px;
  top: 11px;
  font-size: 24px; 
}


/*c-customer*/
.c-customer{
  color:#38BA00!important;
}
.bgc-customer{
  background-color:#38BA00;
}
.bd-c-customer{
  border-color:#38BA00!important;
}

/*c-operator*/
.c-operator{
  color:#00a9ce!important;
}
.bgc-operator{
  background-color:#00a9ce;
}
.bd-c-operator{
  border-color:#00a9ce!important;
}

/*c-register*/
.c-register{
  color:#ffa400!important;
}
.bgc-register{
  background-color:#ffa400;
}
.bd-c-register{
  border-color:#ffa400!important;
}

/*c-management*/
.c-management{
  color:#44BB88!important;
}
.bgc-management{
  background-color:#44BB88;
}
.bd-c-management{
  border-color:#44BB88!important;
}


/*c-facebook*/
.c-facebook{
  color:#416BB5!important;
}
.bgc-facebook{
  background-color:#416BB5;
}
.bd-c-facebook{
  border-color:#416BB5!important;
}

.has-error .form-control{
  border-color:#FF3344;
}







/*さいぽん関係の指定群*/
/*プレミアムプラン関係*/
.bgg-saipon-premium-yellow{
  background: #ffcc00;
  background: -moz-linear-gradient(top, #ffcc00 0%, #ffa400 100%);
  background: -webkit-linear-gradient(top, #ffcc00 0%,#ffa400 100%);
  background: linear-gradient(to bottom, #ffcc00 0%,#ffa400 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcc00', endColorstr='#ffa400',GradientType=0 );
}
.bgg-saipon-premium-gold{
  background: #d9be53;
  background: -moz-linear-gradient(top, #d9be53 0%, #a4823f 100%);
  background: -webkit-linear-gradient(top, #d9be53 0%,#a4823f 100%);
  background: linear-gradient(to bottom, #d9be53 0%,#a4823f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9be53', endColorstr='#a4823f',GradientType=0 );
}
.bgg-saipon-premium-silver{
  background: #f5f5f5;
  background: -moz-linear-gradient(top, #f5f5f5 0%, #acacac 100%);
  background: -webkit-linear-gradient(top, #f5f5f5 0%,#acacac 100%);
  background: linear-gradient(to bottom, #f5f5f5 0%,#acacac 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#acacac',GradientType=0 );
}






/*読者検索結果：全読者一覧用の指定*/
.refinement-table-wrapper{margin:232px 0 106px 16px; height:calc(100% - 338px);overflow: auto;}
@media (min-width: 768px){
  .refinement-table-wrapper{margin:189px 0 63px 16px; height: calc(100% - 252px);}
}

/*ファインダーメニュー用の指定*/
.finder-menu .list-group-item.active,
.finder-menu .list-group-item.active:hover,
.finder-menu .list-group-item.active:focus{
  background-color: #44bb88!important;
  border-color: #44bb88!important;
}
.finder-menu .panel-heading,
.finder-menu .list-group-item{
  padding:8px;
}
.finder-menu .finder-menu-li-text{
  flex:1 0 auto;
  max-width:calc(100% - 10px);
  word-break: break-all;
}
.finder-menu .finder-menu-li-icon{
  flex:0 0 auto;
}
.finder-menu .list-group-item .finder-menu-li-icon i.fa{
  color:#44bb88;
}
.finder-menu .list-group-item.active .finder-menu-li-icon i.fa{
  color:#ffffff;
}


/*領収書画面用　印刷対応クラス*/
  .f-table_v2{
    display: flex;
    width:100%;
    flex-direction: column;
  }
  .f-table-row{
    display: flex;
    width:100%;
    flex-direction: row;
    align-items: stretch;
  }
  .f-table-cell{
    width:100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height:64px;
  }

  .f-table_v2 > div,
  .f-table-row > div{
    flex: 1 1 auto;
  }
  .f-table_v2 div.flex-item-static{
    flex: 0 0 auto;
  }

  /*ボーダー付き*/
  .f-table-bordered.f-table_v2{
    border-top: 1px solid #555;

  }
  .f-table-bordered .f-table-row{
    border-left:1px solid #555;

  }
  .f-table-bordered .f-table-cell{
    border-bottom: 1px solid #555;
    border-right:1px solid #555;
  }

  /*横縞ボーダー付き*/
  .f-table-bordered-v .f-table_v2{
    border-top: 1px solid #555;

  }
  .f-table-bordered-v .f-table-row{
    border-left:none;

  }
  .f-table-bordered-v .f-table-cell{
    border-bottom: 1px solid #555;
    border-right:none;
  }

  /*横縞ダッシュボーダー付き*/
  .f-table-bordered-dashed-v .f-table_v2{
    border-top: 1px dashed #555;

  }
  .f-table-bordered-dashed-v .f-table-row{
    border-left:none;

  }
  .f-table-bordered-dashed-v .f-table-cell{
    border-bottom: 1px dashed #555;
    border-right:none;
  }

  .w90{width:90px;}
  .w140{width:140px;}
  .w220{width:220px;}
  .w250{width:250px;}
  .w256{width:256px;}
  
  .nmb4{margin-bottom:-4px;}
  .nmb8{margin-bottom:-8px;}
  .nmb16{margin-bottom:-16px;}

/* ==========================================================================
   06 COMMON 汎用クラス
   ========================================================================== */


/* 06-01 FLOAT
   ========================================================================== */

.right {
  float: right;
}
.left {
  float: left;
}
.center {
  clear: both;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .xs-right {
    float: right;
  }
  .xs-left {
    float: left;
  }
  .xs-center {
    float: none;
    clear: both;
    margin: 0 auto;
  }
}

/* 06-02 PADDING
   ========================================================================== */
.mp0 {
  margin: 0!important;
  padding: 0!important;
}
.pd0 {
  padding: 0!important;
}
.pd2{
  padding: 2px!important;
}
.pd3 {
  padding: 3px!important;
}
.pd4{
  padding: 4px!important;
}
.pd5 {
  padding: 5px!important;
}
.pd6 {
  padding: 6px!important;
}
.pd8 {
  padding: 8px!important;
}
.pd10 {
  padding: 10px!important;
}
.pd15 {
  padding: 15px!important;
}
.pd16 {
  padding: 16px!important;
}
.pd20 {
  padding: 20px!important;
}
.pd24 {
  padding: 24px!important;
}
.pd25 {
  padding: 25px!important;
}
.pd30 {
  padding: 30px!important;
}
.pd32 {
  padding: 32px!important;
}
.pd40 {
  padding: 40px!important;
}
.pd48 {
  padding: 48px!important;
}
.pd64 {
  padding: 64px!important;
}
.pd1em {
  padding: 1em!important;
}
.pd2em {
  padding: 2em!important;
}
.pd3em {
  padding: 3em!important;
}
/* padding-top */

.pt0 {
  padding-top: 0px!important;
}
.pt1 {
  padding-top: 1px!important;
}
.pt2 {
  padding-top: 2px!important;
}
.pt4{
  padding-top: 4px!important;
}
.pt5 {
  padding-top: 5px!important;
}
.pt6 {
  padding-top: 6px!important;
}
.pt8{
  padding-top: 8px!important;
}
.pt10 {
  padding-top: 10px!important;
}
.pt12{
  padding-top: 12px!important;
}
.pt14 {
  padding-top: 14px!important;
}
.pt15 {
  padding-top: 15px!important;
}
.pt16{
  padding-top: 16px!important;
}
.pt20 {
  padding-top: 20px!important;
}
.pt24{
  padding-top: 24px!important;
}
.pt30 {
  padding-top: 30px!important;
}
.pt32 {
  padding-top: 32px!important;
}
.pt40 {
  padding-top: 40px!important;
}
.pt48 {
  padding-top: 48px!important;
}
.pt50 {
  padding-top: 50px!important;
}
.pt64 {
  padding-top: 64px!important;
}
.pt80 {
  padding-top: 80px!important;
}
.pt90 {
  padding-top: 90px!important;
}
.pt195 {
  padding-top: 195px!important;
}
.pt1em {
  padding-top: 1em!important;
}
.pt2em {
  padding-top: 2em!important;
}
.pt3em {
  padding-top: 3em!important;
}

/* padding-right */

.pr0 {
  padding-right: 0px!important;
}
.pr1 {
  padding-right: 1px!important;
}
.pr2 {
  padding-right: 2px!important;
}
.pr3 {
  padding-right: 3px!important;
}
.pr4{
  padding-right: 4px!important;
}
.pr5 {
  padding-right: 5px!important;
}
.pr8 {
  padding-right: 8px!important;
}
.pr10 {
  padding-right: 10px!important;
}
.pr15 {
  padding-right: 15px!important;
}
.pr16 {	
  padding-right: 16px!important;
}
.pr20 {
  padding-right: 20px!important;
}
.pr24 {
  padding-right: 24px!important;
}
.pr30 {
  padding-right: 30px!important;
}
.pr32{
  padding-right: 32px!important;
}
.pr40 {
  padding-right: 40px!important;
}
.pr45 {
  padding-right: 45px!important;
}
.pr48 {
  padding-right: 48px!important;
}
.pr64 {
  padding-right: 64px!important;
}
.pr1em {
  padding-right: 1em!important;
}
.pr2em {
  padding-right: 2em!important;
}
.pr3em {
  padding-right: 3em!important;
}
.pl0 {
  padding-left: 0px!important;
}
.pl1 {
  padding-left: 1px!important;
}
.pl2 {
  padding-left: 2px!important;
}
.pl3 {
  padding-left: 3px!important;
}
.pl4{
  padding-left: 4px!important;
}
.pl5 {
  padding-left: 5px!important;
}
.pl8 {
  padding-left: 8px!important;
}
.pl10 {
  padding-left: 10px!important;
}
.pl15 {
  padding-left: 15px!important;
}
.pl16 {	
  padding-left: 16px!important;
}
.pl20 {
  padding-left: 20px!important;
}
.pl24 {
  padding-left: 24px!important;
}
.pl30 {
  padding-left: 30px!important;
}
.pl32 {
  padding-left: 32px!important;
}
.pl35 {
  padding-left: 35px!important;
}
.pl40 {
  padding-left: 40px!important;
}
.pl48 {
  padding-left: 48px!important;
}
.pl64 {
  padding-left: 64px!important;
}
.pl1em {
  padding-left: 1em!important;
}
.pl2em {
  padding-left: 2em!important;
}
.pl3em {
  padding-left: 3em!important;
}
.pb0 {
  padding-bottom: 0px!important;
}
.pb1 {
  padding-bottom: 1px!important;
}
.pb2 {
  padding-bottom: 2px!important;
}
.pb4 {
  padding-bottom: 4px!important;
}
.pb5 {
  padding-bottom: 5px!important;
}
.pb6 {
  padding-bottom: 6px!important;
}
.pb8 {
  padding-bottom: 8px!important;
}
.pb10 {
  padding-bottom: 10px!important;
}
.pb14 {
  padding-bottom: 14px!important;
}
.pb15 {
  padding-bottom: 15px!important;
}
.pb16{
  padding-bottom: 16px!important;
}
.pb20 {
  padding-bottom: 20px!important;
}
.pb30 {
  padding-bottom: 30px!important;
}
.pb32 {
  padding-bottom: 32px!important;
}
.pb40 {
  padding-bottom: 40px!important;
}
.pb50 {
  padding-bottom: 50px!important;
}
.pb1em {
  padding-bottom: 1em!important;
}
.pb2em {
  padding-bottom: 2em!important;
}
.pb3em {
  padding-bottom: 3em!important;
}

@media (min-width: 768px) {
  .sm-mp0 {
    margin: 0!important;
    padding: 0!important;
  }
  .sm-pd0 {
    padding: 0!important;
  }
  .sm-pd2 {
    padding: 2px!important;
  }
  .sm-pd3 {
    padding: 3px!important;
  }
  .sm-pd4 {
    padding: 4px!important;
  }
  .sm-pd5 {
    padding: 5px!important;
  }
  .sm-pd6 {
    padding: 6px!important;
  }
  .sm-pd8 {
    padding: 8px!important;
  }
  .sm-pd10 {
    padding: 10px!important;
  }
  .sm-pd15 {
    padding: 15px!important;
  }
  .sm-pd16 {
    padding: 16px!important;
  }
  .sm-pd20 {
    padding: 20px!important;
  }
  .sm-pd24 {
    padding: 24px!important;
  }
  .sm-pd25 {
    padding: 25px!important;
  }
  .sm-pd30 {
    padding: 30px!important;
  }
  .sm-pd32 {
    padding: 32px!important;
  }
  .sm-pd48 {
    padding: 48px!important;
  }
  .sm-pd64 {
    padding: 64px!important;
  }

  .sm-pt0 {
    padding-top: 0px!important;
  }
  .sm-pt2 {
    padding-top: 2px!important;
  }
  .sm-pt4 {
    padding-top: 4px!important;
  }
  .sm-pt5 {
    padding-top: 5px!important;
  }
  .sm-pt6 {
    padding-top: 6px!important;
  }
  .sm-pt8 {
    padding-top: 8px!important;
  }
  .sm-pt10 {
    padding-top: 10px!important;
  }
  .sm-pt14 {
    padding-top: 14px!important;
  }
  .sm-pt15 {
    padding-top: 15px!important;
  }
  .sm-pt16 {
    padding-top: 16px!important;
  }
  .sm-pt20 {
    padding-top: 20px!important;
  }
  .sm-pt24 {
    padding-top: 24px!important;
  }
  .sm-pt30 {
    padding-top: 30px!important;
  }
  .sm-pt32 {
    padding-top: 32px!important;
  }
  .sm-pt40 {
    padding-top: 40px!important;
  }
  .sm-pt48 {
    padding-top: 48px!important;
  }
  .sm-pt50 {
    padding-top: 50px!important;
  }
  .sm-pt64 {
    padding-top: 64px!important;
  }
  .sm-pt80 {
    padding-top: 80px!important;
  }
  .sm-pt90 {
    padding-top: 90px!important;
  }
  .sm-pt195 {
    padding-top: 195px!important;
  }
  .sm-pr0 {
    padding-right: 0px!important;
  }
  .sm-pr2 {
    padding-right: 2px!important;
  }
  .sm-pr3 {
    padding-right: 3px!important;
  }
  .sm-pr4 {
    padding-right: 4px!important;
  }
  .sm-pr5 {
    padding-right: 5px!important;
  }
  .sm-pr8{
    padding-right: 8px!important;
  }
  .sm-pr10 {
    padding-right: 10px!important;
  }
  .sm-pr15 {
    padding-right: 15px!important;
  }
  .sm-pr16 {
    padding-right: 16px!important;
  }
  .sm-pr20 {
    padding-right: 20px!important;
  }
  .sm-pr24 {
    padding-right: 24px!important;
  }
  .sm-pr30 {
    padding-right: 30px!important;
  }
  .sm-pr32 {
    padding-right: 32px!important;
  }
  .sm-pr48 {
    padding-right: 48px!important;
  }
  .sm-pr64 {
    padding-right: 64px!important;
  }
  
  .sm-pl0 {
    padding-left: 0px!important;
  }
  .sm-pl2 {
    padding-left: 2px!important;
  }
  .sm-pl3 {
    padding-left: 3px!important;
  }
  .sm-pl4 {
    padding-left: 4px!important;
  }
  .sm-pl5 {
    padding-left: 5px!important;
  }
  .sm-pl8{
  padding-right: 8px!important;
  }
  .sm-pl10 {
    padding-left: 10px!important;
  }
  .sm-pl15 {
    padding-left: 15px!important;
  }
  .sm-pl16 {
    padding-left: 16px!important;
  }
  .sm-pl20 {
    padding-left: 20px!important;
  }
  .sm-pl24 {
    padding-left: 24px!important;
  }
  .sm-pl30 {
    padding-left: 30px!important;
  }
  .sm-pl32{
    padding-left: 32px!important;
  }
  .sm-pl35 {
    padding-left: 35px!important;
  }
  .sm-pl40 {
    padding-left: 40px!important;
  }
  .sm-pl48 {
    padding-left: 48px!important;
  }
  .sm-pl64 {
    padding-left: 64px!important;
  }
  .sm-pb0 {
    padding-bottom: 0px!important;
  }
  .sm-pb2 {
    padding-bottom: 2px!important;
  }
  .sm-pb4 {
    padding-bottom: 4px!important;
  }
  .sm-pb5 {
    padding-bottom: 5px!important;
  }
  .sm-pb6 {
    padding-bottom: 6px!important;
  }
  .sm-pb8 {
    padding-bottom: 8px!important;
  }
  .sm-pb10 {
    padding-bottom: 10px!important;
  }
  .sm-pb14 {
    padding-bottom: 14px!important;
  }
  .sm-pb16 {
    padding-bottom: 16px!important;
  }
  .sm-pb20 {
    padding-bottom: 20px!important;
  }
  .sm-pb24 {
    padding-bottom: 24px!important;
  }
  .sm-pb30 {
    padding-bottom: 30px!important;
  }
  .sm-pb32 {
    padding-bottom: 32px!important;
  }
  .sm-pb40 {
    padding-bottom: 40px!important;
  }
  .sm-pb48 {
    padding-bottom: 48px!important;
  }
  .sm-pb50 {
    padding-bottom: 50px!important;
  }
  .sm-pb64 {
    padding-bottom: 64px!important;
  }
}

@media (max-width: 767px) {
  .xs-mp0 {
    margin: 0!important;
    padding: 0!important;
  }
  .xs-pd0 {
    padding: 0!important;
  }
  .xs-pd2 {
    padding: 2px!important;
  }
  .xs-pd3 {
    padding: 3px!important;
  }
  .xs-pd4 {
    padding: 4px!important;
  }
  .xs-pd5 {
    padding: 5px!important;
  }
  .xs-pd6 {
    padding: 6px!important;
  }
  .xs-pd8 {
    padding: 8px!important;
  }
  .xs-pd10 {
    padding: 10px!important;
  }
  .xs-pd15 {
    padding: 15px!important;
  }
  .xs-pd16 {
    padding: 16px!important;
  }
  .xs-pd20 {
    padding: 20px!important;
  }
  .xs-pd24 {
    padding: 24px!important;
  }
  .xs-pd25 {
    padding: 25px!important;
  }
  .xs-pd30 {
    padding: 30px!important;
  }
  .xs-pd32 {
    padding: 32px!important;
  }
  .xs-pd48 {
    padding: 48px!important;
  }
  .xs-pd64 {
    padding: 64px!important;
  }

  .xs-pt0 {
    padding-top: 0px!important;
  }
  .xs-pt2 {
    padding-top: 2px!important;
  }
  .xs-pt4 {
    padding-top: 4px!important;
  }
  .xs-pt5 {
    padding-top: 5px!important;
  }
  .xs-pt6 {
    padding-top: 6px!important;
  }
  .xs-pt8{
    padding-top: 8px!important;
  }
  .xs-pt10 {
    padding-top: 10px!important;
  }
  .xs-pt12{
    padding-top: 12px!important;
  }
  .xs-pt14 {
    padding-top: 14px!important;
  }
  .xs-pt15 {
    padding-top: 15px!important;
  }
  .xs-pt16{
    padding-top: 16px!important;
  }
  .xs-pt20 {
    padding-top: 20px!important;
  }
  .xs-pt24 {
    padding-top: 24px!important;
  }
  .xs-pt30 {
    padding-top: 30px!important;
  }
  .xs-pt32 {
    padding-top: 32px!important;
  }
  .xs-pt40 {
    padding-top: 40px!important;
  }
  .xs-pt48 {
    padding-top: 48px!important;
  }
  .xs-pt50 {
    padding-top: 50px!important;
  }
  .xs-pt64 {
    padding-top: 64px!important;
  }
  .xs-pt80 {
    padding-top: 80px!important;
  }
  .xs-pt90 {
    padding-top: 90px!important;
  }
  .xs-pt195 {
    padding-top: 195px!important;
  }

  .xs-pr0 {
    padding-right: 0px!important;
  }
  .xs-pr2 {
    padding-right: 2px!important;
  }
  .xs-pr3 {
    padding-right: 3px!important;
  }
  .xs-pr4{
    padding-right: 4px!important;
  }
  .xs-pr5 {
    padding-right: 5px!important;
  }
  .xs-pr8 {
    padding-right: 8px!important;
  }
  .xs-pr10 {
    padding-right: 10px!important;
  }
  .xs-pr15 {
    padding-right: 15px!important;
  }
  .xs-pr16{
    padding-right: 16px!important;
  }
  .xs-pr20 {
    padding-right: 20px!important;
  }
  .xs-pr24 {
    padding-right: 24px!important;
  }
  .xs-pr30 {
    padding-right: 30px!important;
  }
  .xs-pr32 {
    padding-right: 32px!important;
  }
  .xs-pr48 {
    padding-right: 48px!important;
  }
  .xs-pr64 {
    padding-right: 64px!important;
  }

  .xs-pl0 {
    padding-left: 0px!important;
  }
  .xs-pl2 {
    padding-left: 2px!important;
  }
  .xs-pl3 {
    padding-left: 3px!important;
  }
  .xs-pl4{
    padding-left: 4px!important;
  }
  .xs-pl5 {
    padding-left: 5px!important;
  }
  .xs-pl8 {
    padding-left: 8px!important;
  }
  .xs-pl10 {
    padding-left: 10px!important;
  }
  .xs-pl15 {
    padding-left: 15px!important;
  }
  .xs-pl16{
    padding-left: 16px!important;
  }
  .xs-pl20 {
    padding-left: 20px!important;
  }
  .xs-pl24 {
    padding-left: 24px!important;
  }
  .xs-pl30 {
    padding-left: 30px!important;
  }
  .xs-pl32 {
    padding-left: 32px!important;
  }
  .xs-pl35 {
    padding-left: 35px!important;
  }
  .xs-pl40 {
    padding-left: 40px!important;
  }
  .xs-pl48 {
    padding-left: 48px!important;
  }
  .xs-pl64 {
    padding-left: 64px!important;
  }

  .xs-pb0 {
    padding-bottom: 0px!important;
  }
  .xs-pb2 {
    padding-bottom: 2px!important;
  }
  .xs-pb4 {
    padding-bottom: 4px!important;
  }
  .xs-pb5 {
    padding-bottom: 5px!important;
  }
  .xs-pb6 {
    padding-bottom: 6px!important;
  }
  .xs-pb8{
    padding-bottom: 8px!important;
  }
  .xs-pb10 {
    padding-bottom: 10px!important;
  }
  .xs-pb14 {
    padding-bottom: 14px!important;
  }
  .xs-pb16{
    padding-bottom: 16px!important;
  }
  .xs-pb20 {
    padding-bottom: 20px!important;
  }
  .xs-pb24 {
    padding-bottom: 24px!important;
  }
  .xs-pb30 {
    padding-bottom: 30px!important;
  }
  .xs-pb32 {
    padding-bottom: 32px!important;
  }
  .xs-pb40 {
    padding-bottom: 40px!important;
  }
  .xs-pb48 {
    padding-bottom: 48px!important;
  }
  .xs-pb50 {
    padding-bottom: 50px!important;
  }
  .xs-pb64 {
    padding-bottom: 64px!important;
  }
}

/* 06-03 MARGIN
   ========================================================================== */
.ma0 {
  margin: 0px!important;
}
.ma1 {
  margin: 1px!important;
}
.ma4 {
  margin: 4px!important;
}
.ma8 {
  margin: 8px!important;
}
.ma16 {
  margin: 16px!important;
}
.ma24 {
  margin: 24px!important;
}
.ma32 {
  margin: 32px!important;
}
.ma48 {
  margin: 48px!important;
}
.ma64 {
  margin: 64px!important;
}


.mt0 {
  margin-top: 0px!important;
}
.mt2{
  margin-top: 2px!important;
}
.mt4{
  margin-top: 4px!important;
}
.mt5 {
  margin-top: 5px!important;
}
.mt8{
  margin-top: 8px!important;
}
.mt10 {
  margin-top: 10px!important;
}
.mt15 {
  margin-top: 15px!important;
}
.mt16 {
  margin-top: 16px!important;
}
.mt16{
  margin-top: 16px!important;
}
.mt20 {
  margin-top: 20px!important;
}
.mt24 {
  margin-top: 24px!important;
}
.mt25 {
  margin-top: 25px!important;
}
.mt30 {
  margin-top: 30px!important;
}
.mt32 {
  margin-top: 32px!important;
}
.mt35 {
  margin-top: 35px!important;
}
.mt40 {
  margin-top: 40px!important;
}
.mt48 {
  margin-top: 48px!important;
}
.mt50 {
  margin-top: 50px!important;
}
.mt60 {
  margin-top: 60px!important;
}
.mt64 {
  margin-top: 64px!important;
}
.mt70 {
  margin-top: 70px!important;
}
.mt80 {
  margin-top: 80px!important;
}
.mt100 {
  margin-top: 100px!important;
}

.mr0 {
  margin-right: 0px!important;
}
.mr1 {
  margin-right: 1px!important;
}
.mr2 {
  margin-right: 2px!important;
}
.mr4 {
  margin-right: 4px!important;
}
.mr5 {
  margin-right: 5px!important;
}
.mr6 {
  margin-right: 6px!important;
}
.mr8 {
  margin-right: 8px!important;
}
.mr10 {
  margin-right: 10px!important;
}
.mr15 {
  margin-right: 15px!important;
}
.mr16 {
  margin-right: 16px!important;
}
.mr20 {
  margin-right: 20px!important;
}
.mr24 {
  margin-right: 24px!important;
}
.mr25 {
  margin-right: 25px!important;
}
.mr30 {
  margin-right: 30px!important;
}
.mr32 {
  margin-right: 32px!important;
}
.mr40 {
  margin-right: 40px!important;
}
.mr45 {
  margin-right: 45px!important;
}
.mr48 {
  margin-right: 48px!important;
}
.mr50 {
  margin-right: 50px!important;
}
.mr64 {
  margin-right: 64px!important;
}
.mr100 {
  margin-right: 100px!important;
}

.mb0 {
  margin-bottom: 0!important;
}
.mb1 {
  margin-bottom: 1px!important;
}
.mb2{
  margin-bottom: 2px !important;
}
.mb3 {
  margin-bottom: 3px!important;
}
.mb4 {
  margin-bottom: 4px!important;
}
.mb5 {
  margin-bottom: 5px!important;
}
.mb7 {
  margin-bottom: 7px!important;
}
.mb8{
  margin-bottom: 8px!important;
}
.mb10 {
  margin-bottom: 10px!important;
}
.mb15 {
  margin-bottom: 15px!important;
}
.mb16 {
  margin-bottom: 16px!important;
}
.mb20 {
  margin-bottom: 20px!important;
}
.mb24 {
  margin-bottom: 24px!important;
}
.mb30 {
  margin-bottom: 30px!important;
}
.mb32 {
  margin-bottom: 32px!important;
}
.mb40 {
  margin-bottom: 40px!important;
}
.mb48 {
  margin-bottom: 48px!important;
}
.mb50 {
  margin-bottom: 50px!important;
}
.mb64 {
  margin-bottom: 64px!important;
}
.mb100 {
  margin-bottom: 100px!important;
}

.ml0 {
  margin-left: 0px!important;
}
.ml2{
  margin-left: 2px!important;
}
.ml4{
  margin-left: 4px!important;
}
.ml5 {
  margin-left: 5px!important;
}
.ml8{
  margin-left: 8px!important;
}
.ml10 {
  margin-left: 10px!important;
}
.ml15 {
  margin-left: 15px!important;
}
.ml16 {
  margin-left: 16px!important;
}
.ml20 {
  margin-left: 20px!important;
}
.ml24 {
  margin-left: 24px!important;
}
.ml25 {
  margin-left: 25px!important;
}
.ml30 {
  margin-left: 30px!important;
}
.ml32 {
  margin-left: 32px!important;
}
.ml35 {
  margin-left: 35px!important;
}
.ml40 {
  margin-left: 40px!important;
}
.ml48 {
  margin-left: 48px!important;
}
.ml64 {
  margin-left: 64px!important;
}
.ml50 {
  margin-left: 50px!important;
}
.ml100 {
  margin-left: 100px!important;
}


@media (min-width: 768px) {
  .sm-ma0 {
    margin: 0px!important;
  }
  .sm-mt0 {
    margin-top: 0px!important;
  }
  .sm-mt5 {
    margin-top: 5px!important;
  }
  .sm-mt8{
    margin-top: 8px!important;
  }
  .sm-mt10 {
    margin-top: 10px!important;
  }
  .sm-mt16{
    margin-top:16px!important;
  }
  .sm-mt20 {
    margin-top: 20px!important;
  }
  .sm-mt25 {
    margin-top: 25px!important;
  }
  .sm-mt30 {
    margin-top: 30px!important;
  }
  .sm-mt35 {
    margin-top: 35px!important;
  }
  .sm-mt40 {
    margin-top: 40px!important;
  }
  .sm-mt50 {
    margin-top: 50px!important;
  }
  .sm-mt60 {
    margin-top: 60px!important;
  }
  .sm-mt70 {
    margin-top: 70px!important;
  }
  .sm-mt80 {
    margin-top: 80px!important;
  }
  .sm-mt100 {
    margin-top: 100px!important;
  }
  
  .sm-mr0 {
    margin-right: 0px!important;
  }
  .sm-mr5 {
    margin-right: 5px!important;
  }
  .sm-mr8 {
    margin-right: 8px!important;
  }

  .sm-mr10 {
    margin-right: 10px!important;
  }
  .sm-mr15 {
    margin-right: 15px!important;
  }
  .sm-mr20 {
    margin-right: 20px!important;
  }
  .sm-mr25 {
    margin-right: 25px!important;
  }
  .sm-mr30 {
    margin-right: 30px!important;
  }
  .sm-mr40 {
    margin-right: 40px!important;
  }
  .sm-mr50 {
    margin-right: 50px!important;
  }
  .sm-mb0 {
    margin-bottom: 0!important;
  }
  .sm-mb5 {
    margin-bottom: 5px!important;
  }
  .sm-mb7 {
    margin-bottom: 7px!important;
  }
  .sm-mb8{
    margin-bottom: 8px!important;
  }
  .sm-mb10 {
    margin-bottom: 10px!important;
  }
  .sm-mb15 {
    margin-bottom: 15px!important;
  }
  .sm-mb16{
    margin-bottom: 16px!important;
  }
  .sm-mb20 {
    margin-bottom: 20px!important;
  }
  .sm-mb30 {
    margin-bottom: 30px!important;
  }
  .sm-mb40 {
    margin-bottom: 40px!important;
  }
  .sm-mb50 {
    margin-bottom: 50px!important;
  }
  .sm-mb100 {
    margin-bottom: 100px!important;
  }
  .sm-ml0 {
    margin-left: 0px!important;
  }
  .sm-ml5 {
    margin-left: 5px!important;
  }
  .sm-ml8{
    margin-left:8px!important;
  }
  .sm-ml10 {
    margin-left: 10px!important;
  }
  .sm-ml15 {
    margin-left: 15px!important;
  }
  .sm-ml20 {
    margin-left: 20px!important;
  }
  .sm-ml25 {
    margin-left: 25px!important;
  }
  .sm-ml30 {
    margin-left: 30px!important;
  }
  .sm-ml35 {
    margin-left: 35px!important;
  }
  .sm-ml40 {
    margin-left: 40px!important;
  }
  .sm-ml50 {
    margin-left: 50px!important;
  }
}
@media (max-width: 767px) {
  .xs-ma0 {
    margin: 0px!important;
  }
  .xs-ma16{
    margin: 16px!important;
  }
  .xs-mt0 {
    margin-top: 0px!important;
  }
  .xs-mt5 {
    margin-top: 5px!important;
  }
  .xs-mt10 {
    margin-top: 10px!important;
  }
  .xs-mt16 {
    margin-top: 16px!important;
  }
  .xs-mt20 {
    margin-top: 20px!important;
  }
  .xs-mt25 {
    margin-top: 25px!important;
  }
  .xs-mt30 {
    margin-top: 30px!important;
  }
  .xs-mt35 {
    margin-top: 35px!important;
  }
  .xs-mt40 {
    margin-top: 40px!important;
  }
  .xs-mt50 {
    margin-top: 50px!important;
  }
  .xs-mt60 {
    margin-top: 60px!important;
  }
  .xs-mt70 {
    margin-top: 70px!important;
  }
  .xs-mt80 {
    margin-top: 80px!important;
  }
  .xs-mt100 {
    margin-top: 100px!important;
  }
  .xs-mr0 {
    margin-right: 0px!important;
  }
  .xs-mr5 {
    margin-right: 5px!important;
  }
  .xs-mr8 {
    margin-right: 8px!important;
  }
  .xs-mr10 {
    margin-right: 10px!important;
  }
  .xs-mr15 {
    margin-right: 15px!important;
  }
  .xs-mr20 {
    margin-right: 20px!important;
  }
  .xs-mr25 {
    margin-right: 25px!important;
  }
  .xs-mr30 {
    margin-right: 30px!important;
  }
  .xs-mr40 {
    margin-right: 40px!important;
  }
  .xs-mr50 {
    margin-right: 50px!important;
  }
  .xs-mb0 {
    margin-bottom: 0!important;
  }
  .xs-mb4 {
    margin-bottom: 4px!important;
  }
  .xs-mb5 {
    margin-bottom: 5px!important;
  }
  .xs-mb7 {
    margin-bottom: 7px!important;
  }
  .xs-mb10 {
    margin-bottom: 10px!important;
  }
  .xs-mb15 {
    margin-bottom: 15px!important;
  }
  .xs-mb16 {
    margin-bottom: 16px!important;
  }
  .xs-mb20 {
    margin-bottom: 20px!important;
  }
  .xs-mb30 {
    margin-bottom: 30px!important;
  }
  .xs-mb40 {
    margin-bottom: 40px!important;
  }
  .xs-mb50 {
    margin-bottom: 50px!important;
  }
  .xs-mb100 {
    margin-bottom: 100px!important;
  }
  .xs-ml0 {
    margin-left: 0px!important;
  }
  .xs-ml5 {
    margin-left: 5px!important;
  }
  .xs-ml10 {
    margin-left: 10px!important;
  }
  .xs-ml15 {
    margin-left: 15px!important;
  }
  .xs-ml20 {
    margin-left: 20px!important;
  }
  .xs-ml25 {
    margin-left: 25px!important;
  }
  .xs-ml30 {
    margin-left: 30px!important;
  }
  .xs-ml35 {
    margin-left: 35px!important;
  }
  .xs-ml40 {
    margin-left: 40px!important;
  }
  .xs-ml50 {
    margin-left: 50px!important;
  }
  .xs-ml140 {
    margin-left: 140px!important;
  }
}

/*ネガティブマージン*/
/*全方向のネガティブマージン*/
.ma_1{
  margin: -1px!important;
}
.ma_2{
  margin: -2px!important;
}
.ma_4{
  margin: -4px!important;
}
.ma_5{
  margin: -5px!important;
}
.ma_8{
  margin: -8px!important;
}
.ma_10{
  margin: -10px!important;
}
.ma_16{
  margin: -16px!important;
}
.ma_20{
  margin: -20px!important;
}
.ma_24{
  margin: -24px!important;
}
.ma_30{
  margin: -30px!important;
}
.ma_32{
  margin: -32px!important;
}
.ma_40{
  margin: -40px!important;
}
.ma_48{
  margin: -48px!important;
}
.ma_50{
  margin: -50px!important;
}

/*上方向のネガティブマージン*/
.mt_1{
  margin-top: -1px!important;
}
.mt_2{
  margin-top: -2px!important;
}
.mt_4{
  margin-top: -4px!important;
}
.mt_5{
  margin-top: -5px!important;
}
.mt_8{
  margin-top: -8px!important;
}
.mt_10 {
  margin-top: -10px!important;
}
.mt_16{
  margin-top: -16px!important;
}
.mt_20 {
  margin-top: -20px!important;
}
.mt_24{
  margin-top: -24px!important;
}
.mt_30 {
  margin-top: -30px!important;
}
.mt_32{
  margin-top: -32px!important;
}
.mt_40 {
  margin-top: -40px!important;
}
.mt_48{
  margin-top: -48px!important;
}
.mt_50 {
  margin-top: -50px!important;
}
/*右方向のネガティブマージン*/
.mr_1{
  margin-right: -1px!important;
}
.mr_2{
  margin-right: -2px!important;
}
.mr_4{
  margin-right: -4px!important;
}
.mr_5{
  margin-right: -5px!important;
}
.mr_8{
  margin-right: -8px!important;
}
.mr_10 {
  margin-right: -10px!important;
}
.mr_16{
  margin-right: -16px!important;
}
.mr_20 {
  margin-right: -20px!important;
}
.mr_24{
  margin-right: -24px!important;
}
.mr_30 {
  margin-right: -30px!important;
}
.mr_32{
  margin-right: -32px!important;
}
.mr_40 {
  margin-right: -40px!important;
}
.mr_48{
  margin-right: -48px!important;
}
.mr_50 {
  margin-right: -50px!important;
}
/*下方向のネガティブマージン*/
.mb_1{
  margin-bottom: -1px!important;
}
.mb_2{
  margin-bottom: -2px!important;
}
.mb_4{
  margin-bottom: -4px!important;
}
.mb_5{
  margin-bottom: -5px!important;
}
.mb_8{
  margin-bottom: -8px!important;
}
.mb_10 {
  margin-bottom: -10px!important;
}
.mb_16{
  margin-bottom: -16px!important;
}
.mb_20 {
  margin-bottom: -20px!important;
}
.mb_24{
  margin-bottom: -24px!important;
}
.mb_30 {
  margin-bottom: -30px!important;
}
.mb_32{
  margin-bottom: -32px!important;
}
.mb_40 {
  margin-bottom: -40px!important;
}
.mb_48{
  margin-bottom: -48px!important;
}
.mb_50 {
  margin-bottom: -50px!important;
}
/*左方向のネガティブマージン*/
.ml_1 {
  margin-left: -1px!important;
}
.ml_2 {
  margin-left: -2px!important;
}
.ml_4 {
  margin-left: -4px!important;
}
.ml_5 {
  margin-left: -5px!important;
}
.ml_8 {
  margin-left: -8px!important;
}
.ml_10 {
  margin-left: -10px!important;
}
.ml_15 {
  margin-left: -15px!important;
}
.ml_16 {
  margin-left: -16px!important;
}
.ml_20 {
  margin-left: -20px!important;
}
.ml_24 {
  margin-left: -24px!important;
}
.ml_30 {
  margin-left: -30px!important;
}
.ml_32 {
  margin-left: -32px!important;
}
.ml_35 {
  margin-left: -35px!important;
}
.ml_40 {
  margin-left: -40px!important;
}
.ml_48 {
  margin-left: -48px!important;
}
.ml_50 {
  margin-left: -50px!important;
}

@media (min-width: 768px) {
  /*全方向のネガティブマージン*/
  .sm-ma_2{
    margin: -2px!important;
  }
  .sm-ma_4{
    margin: -4px!important;
  }
  .sm-ma_5{
    margin: -5px!important;
  }
  .sm-ma_8{
    margin: -8px!important;
  }
  .sm-ma_10{
    margin: -10px!important;
  }
  .sm-ma_16{
    margin: -16px!important;
  }
  .sm-ma_20{
    margin: -20px!important;
  }
  .sm-ma_24{
    margin: -24px!important;
  }
  .sm-ma_30{
    margin: -30px!important;
  }
  .sm-ma_32{
    margin: -32px!important;
  }
  .sm-ma_40{
    margin: -40px!important;
  }
  .sm-ma_48{
    margin: -48px!important;
  }
  .sm-ma_50{
    margin: -50px!important;
  }
  
  /*上方向のネガティブマージン*/
  .sm-mt_2{
    margin-top: -2px!important;
  }
  .sm-mt_4{
    margin-top: -4px!important;
  }
  .sm-mt_5{
    margin-top: -5px!important;
  }
  .sm-mt_8{
    margin-top: -8px!important;
  }
  .sm-mt_10 {
    margin-top: -10px!important;
  }
  .sm-mt_16{
    margin-top: -16px!important;
  }
  .sm-mt_20 {
    margin-top: -20px!important;
  }
  .sm-mt_24{
    margin-top: -24px!important;
  }
  .sm-mt_30 {
    margin-top: -30px!important;
  }
  .sm-mt_32{
    margin-top: -32px!important;
  }
  .sm-mt_40 {
    margin-top: -40px!important;
  }
  .sm-mt_48{
    margin-top: -48px!important;
  }
  .sm-mt_50 {
    margin-top: -50px!important;
  }
  /*右方向のネガティブマージン*/
  .sm-mr_2{
    margin-right: -2px!important;
  }
  .sm-mr_4{
    margin-right: -4px!important;
  }
  .sm-mr_5{
    margin-right: -5px!important;
  }
  .sm-mr_8{
    margin-right: -8px!important;
  }
  .sm-mr_10 {
    margin-right: -10px!important;
  }
  .sm-mr_16{
    margin-right: -16px!important;
  }
  .sm-mr_20 {
    margin-right: -20px!important;
  }
  .sm-mr_24{
    margin-right: -24px!important;
  }
  .sm-mr_30 {
    margin-right: -30px!important;
  }
  .sm-mr_32{
    margin-right: -32px!important;
  }
  .sm-mr_40 {
    margin-right: -40px!important;
  }
  .sm-mr_48{
    margin-right: -48px!important;
  }
  .sm-mr_50 {
    margin-right: -50px!important;
  }
  /*下方向のネガティブマージン*/
  .sm-mb_2{
    margin-bottom: -2px!important;
  }
  .sm-mb_4{
    margin-bottom: -4px!important;
  }
  .sm-mb_5{
    margin-bottom: -5px!important;
  }
  .sm-mb_8{
    margin-bottom: -8px!important;
  }
  .sm-mb_10 {
    margin-bottom: -10px!important;
  }
  .sm-mb_16{
    margin-bottom: -16px!important;
  }
  .sm-mb_20 {
    margin-bottom: -20px!important;
  }
  .sm-mb_24{
    margin-bottom: -24px!important;
  }
  .sm-mb_30 {
    margin-bottom: -30px!important;
  }
  .sm-mb_32{
    margin-bottom: -32px!important;
  }
  .sm-mb_40 {
    margin-bottom: -40px!important;
  }
  .sm-mb_48{
    margin-bottom: -48px!important;
  }
  .sm-mb_50 {
    margin-bottom: -50px!important;
  }
  /*左方向のネガティブマージン*/
  .sm-ml_2 {
    margin-left: -2px!important;
  }
  .sm-ml_4 {
    margin-left: -4px!important;
  }
  .sm-ml_5 {
    margin-left: -5px!important;
  }
  .sm-ml_8 {
    margin-left: -8px!important;
  }
  .sm-ml_10 {
    margin-left: -10px!important;
  }
  .sm-ml_15 {
    margin-left: -15px!important;
  }
  .sm-ml_16 {
    margin-left: -16px!important;
  }
  .sm-ml_20 {
    margin-left: -20px!important;
  }
  .sm-ml_24 {
    margin-left: -24px!important;
  }
  .sm-ml_30 {
    margin-left: -30px!important;
  }
  .sm-ml_32 {
    margin-left: -32px!important;
  }
  .sm-ml_35 {
    margin-left: -35px!important;
  }
  .sm-ml_40 {
    margin-left: -40px!important;
  }
  .sm-ml_48 {
    margin-left: -48px!important;
  }
  .sm-ml_50 {
    margin-left: -50px!important;
  }
}

@media (max-width: 767px) {
  /*全方向のネガティブマージン*/
  .xs-ma_2{
    margin: -2px!important;
  }
  .xs-ma_4{
    margin: -4px!important;
  }
  .xs-ma_5{
    margin: -5px!important;
  }
  .xs-ma_8{
    margin: -8px!important;
  }
  .xs-ma_10{
    margin: -10px!important;
  }
  .xs-ma_16{
    margin: -16px!important;
  }
  .xs-ma_20{
    margin: -20px!important;
  }
  .xs-ma_24{
    margin: -24px!important;
  }
  .xs-ma_30{
    margin: -30px!important;
  }
  .xs-ma_32{
    margin: -32px!important;
  }
  .xs-ma_40{
    margin: -40px!important;
  }
  .xs-ma_48{
    margin: -48px!important;
  }
  .xs-ma_50{
    margin: -50px!important;
  }
  
  /*上方向のネガティブマージン*/
  .xs-mt_2{
    margin-top: -2px!important;
  }
  .xs-mt_4{
    margin-top: -4px!important;
  }
  .xs-mt_5{
    margin-top: -5px!important;
  }
  .xs-mt_8{
    margin-top: -8px!important;
  }
  .xs-mt_10 {
    margin-top: -10px!important;
  }
  .xs-mt_16{
    margin-top: -16px!important;
  }
  .xs-mt_20 {
    margin-top: -20px!important;
  }
  .xs-mt_24{
    margin-top: -24px!important;
  }
  .xs-mt_30 {
    margin-top: -30px!important;
  }
  .xs-mt_32{
    margin-top: -32px!important;
  }
  .xs-mt_40 {
    margin-top: -40px!important;
  }
  .xs-mt_48{
    margin-top: -48px!important;
  }
  .xs-mt_50 {
    margin-top: -50px!important;
  }
  /*右方向のネガティブマージン*/
  .xs-mr_2{
    margin-right: -2px!important;
  }
  .xs-mr_4{
    margin-right: -4px!important;
  }
  .xs-mr_5{
    margin-right: -5px!important;
  }
  .xs-mr_8{
    margin-right: -8px!important;
  }
  .xs-mr_10 {
    margin-right: -10px!important;
  }
  .xs-mr_16{
    margin-right: -16px!important;
  }
  .xs-mr_20 {
    margin-right: -20px!important;
  }
  .xs-mr_24{
    margin-right: -24px!important;
  }
  .xs-mr_30 {
    margin-right: -30px!important;
  }
  .xs-mr_32{
    margin-right: -32px!important;
  }
  .xs-mr_40 {
    margin-right: -40px!important;
  }
  .xs-mr_48{
    margin-right: -48px!important;
  }
  .xs-mr_50 {
    margin-right: -50px!important;
  }
  /*下方向のネガティブマージン*/
  .xs-mb_2{
    margin-bottom: -2px!important;
  }
  .xs-mb_4{
    margin-bottom: -4px!important;
  }
  .xs-mb_5{
    margin-bottom: -5px!important;
  }
  .xs-mb_8{
    margin-bottom: -8px!important;
  }
  .xs-mb_10 {
    margin-bottom: -10px!important;
  }
  .xs-mb_16{
    margin-bottom: -16px!important;
  }
  .xs-mb_20 {
    margin-bottom: -20px!important;
  }
  .xs-mb_24{
    margin-bottom: -24px!important;
  }
  .xs-mb_30 {
    margin-bottom: -30px!important;
  }
  .xs-mb_32{
    margin-bottom: -32px!important;
  }
  .xs-mb_40 {
    margin-bottom: -40px!important;
  }
  .xs-mb_48{
    margin-bottom: -48px!important;
  }
  .xs-mb_50 {
    margin-bottom: -50px!important;
  }
  /*左方向のネガティブマージン*/
  .xs-ml_2 {
    margin-left: -2px!important;
  }
  .xs-ml_4 {
    margin-left: -4px!important;
  }
  .xs-ml_5 {
    margin-left: -5px!important;
  }
  .xs-ml_8 {
    margin-left: -8px!important;
  }
  .xs-ml_10 {
    margin-left: -10px!important;
  }
  .xs-ml_15 {
    margin-left: -15px!important;
  }
  .xs-ml_16 {
    margin-left: -16px!important;
  }
  .xs-ml_20 {
    margin-left: -20px!important;
  }
  .xs-ml_24 {
    margin-left: -24px!important;
  }
  .xs-ml_30 {
    margin-left: -30px!important;
  }
  .xs-ml_32 {
    margin-left: -32px!important;
  }
  .xs-ml_35 {
    margin-left: -35px!important;
  }
  .xs-ml_40 {
    margin-left: -40px!important;
  }
  .xs-ml_48 {
    margin-left: -48px!important;
  }
  .xs-ml_50 {
    margin-left: -50px!important;
  }
}








/* white-space */	
.ws-normal {	
white-space: normal;	
}	
.ellipsis {	
text-overflow: ellipsis;	
overflow: hidden;	
white-space: nowrap;	
}

/* width */

.w-auto {
  width: auto !important;
}
.w25 {
  width: 25px !important;
}
.w40 {
  width: 40px !important;
}
.w44 {
  width: 44px !important;
}
.w50 {
  width: 50px !important;
}
.w60 {
  width: 60px !important;
}
.w62 {
  width: 62px !important;
}
.w100 {
  width: 100px !important;
}
.w108 {
  width: 108px !important;
}
.w110 {
  width: 110px !important;
}
.w150 {
  width: 150px !important;
}
.w200 {
  width: 200px !important;
}
.w255 {
  width: 255px !important;
}
.w350 {
  width: 350px !important;
}
.w369{
  width:369px;
}
.w400 {
  width: 400px !important;
}
.w500 {
  width: 500px !important;
}
.w600 {
  width: 600px !important;
}
.w16per {
  width: 16.6%!important;
}
.w20per {
  width: 20% !important;
}
.w25per {
  width: 25% !important;
}
.w30per {
  width: 30% !important;
}
.w33per {
  width: 33.3% !important;
}
.w40per {
  width: 40% !important;
}
.w50per {
  width: 50% !important;
}
.w60per {
  width: 60% !important;
}
.w66per {
  width: 66% !important;
}
.w75per {
  width: 75% !important;
}
.w80per {
  width: 80%!important;
}
.w100per {
  width: 100% !important;
}
.max-w100 {
  max-width: 100px;
}
.max-w210 {
  max-width: 210px!important;
}
.max-w720 {
  max-width: 720px;
}

.width20per{
  width: 20% !important;
}
.width25per{
  width: 25% !important;
}
.width100per{
  width: 100% !important;
}

@media (max-width: 767px) {
  .xs-w-auto {
    width: auto!important;
  }
  .xs-w110 {
  width: 110px !important;
}
  .xs-w140 {
    width: 140px !important;
  }
  .xs-w50per {
    width: 50% !important;
  }
  .xs-w100per {
    width: 100% !important;
  }
  .xs-min-w95 {
    min-width: 95px !important;
  }
}
@media (min-width: 768px) {
  .sm-w100per {
    width: 100% !important;
  }
  .sm-w1000 {
    width: 1000px !important;
  }
}

/* height */

.h16{
  height:16px!important;
}
.h24{
  height:24px!important;
}
.h30{
  height:30px!important;
}
.h32{
  height:32px!important;
}
.h34 {
  height: 34px !important;
}
.h36 {
  height: 36px !important;
}

.h40 {
  height: 40px !important;
}
.h44{
  height:44px!important;
}
.h47 {
  height: 47px !important;
}
.h48{
  height:48px !important;
}
.h52 {
  height: 52px !important;
}
.h54 {
  height: 54px !important;
}
.h58 {
  height: 58px !important;
}
.h64{
  height:64px!important;
}
.h68{
  height:68px!important;
}
.h76 {
  height: 76px !important;
}
.h96 {
  height: 96px !important;
}
.h100 {
  height: 100px !important;
}
.h160 {
  height: 160px !important;
}
.h200 {
  height: 200px !important;
}

.h100per {
  height: 100% !important;
}
@media (max-width: 767px) {
  .xs-h14 {
    height: 14px !important;
  }
  .xs-h18 {
    height: 18px !important;
  }
  .xs-h36 {
    height: 36px !important;
  }
  .xs-h128 {
    height: 128px !important;
  }
  
  .xs-h-auto {
    height: auto!important;
  }
  .xs-h200 {
    height: 200px !important;
  }
}

/* etc */

.img-size-27 {
  width: 27px!important;
  height: 27px!important;
}
.h-opacity:hover {
  opacity: 0.3;
}

/* 点滅 */

.blinking {
  -webkit-animation: 0.5s linear 0s alternate none infinite running blink;
  -moz-animation: 0.5s linear 0s alternate none infinite running blink;
  animation: 0.5s linear 0s alternate none infinite running blink;
}
@-webkit-keyframes blink {
  0% {
    opacity: 0;
  }
  19.9% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes blink {
  0% {
    opacity: 0;
  }
  19.9% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blink {
  0% {
    opacity: 0;
  }
  19.9% {
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* 06-04 TEXT
   ========================================================================== */


/* font-size */

.f8 {
  font-size: 8px !important;
}
.f9 {
  font-size: 9px !important;
}
.f10 {
  font-size: 10px !important;
}
.f11 {
  font-size: 11px !important;
}
.f12 {
  font-size: 12px !important;
}
.f13 {
  font-size: 13px !important;
}
.f14 {
  font-size: 14px !important;
}
.f15 {
  font-size: 15px !important;
}
.f16 {
  font-size: 16px !important;
}
.f17 {
  font-size: 17px !important;
}
.f18 {
  font-size: 18px !important;
}
.f19 {
  font-size: 19px !important;
}
.f20 {
  font-size: 20px !important;
}
.f22 {
  font-size: 22px !important;
}
.f24 {
  font-size: 24px !important;
}
.f25 {
  font-size: 25px !important;
}
.f26 {
  font-size: 26px !important;
}
.f28 {
  font-size: 28px !important;
}
.f30 {
  font-size: 30px !important;
}
.f32 {
  font-size: 32px !important;
}
.f36 {
  font-size: 36px !important;
}
.f38 {
  font-size: 38px !important;
}
.f40 {
  font-size: 40px !important;
}
.f48 {
  font-size: 48px !important;
}
.f50 {
  font-size: 50px !important;
}
.f75 {
  font-size: 75px !important;
}


@media (max-width: 767px) {
  /* font-size */
  .xs-f8 {
    font-size: 8px !important;
  }
  .xs-f9 {
    font-size: 9px !important;
  }
  .xs-f10 {
    font-size: 10px !important;
  }
  .xs-f11 {
    font-size: 11px !important;
  }
  .xs-f12 {
    font-size: 12px !important;
  }
  .xs-f13 {
    font-size: 13px !important;
  }
  .xs-f14 {
    font-size: 14px !important;
  }
  .xs-f15 {
    font-size: 15px !important;
  }
  .xs-f16 {
    font-size: 16px !important;
  }
  .xs-f17 {
    font-size: 17px !important;
  }
  .xs-f18 {
    font-size: 18px !important;
  }
  .xs-f19 {
    font-size: 19px !important;
  }
  .xs-f20 {
    font-size: 20px !important;
  }
  .xs-f22 {
    font-size: 22px !important;
  }
  .xs-f24 {
    font-size: 24px !important;
  }
  .xs-f26 {
    font-size: 26px !important;
  }
  .xs-f28 {
    font-size: 28px !important;
  }
  .xs-f30 {
    font-size: 30px !important;
  }
  .xs-f40 {
    font-size: 40px !important;
  }
  .xs-f50 {
    font-size: 50px !important;
  }
  .xs-f56 {
    font-size: 56px !important;
  }
}
@media (min-width: 992px) {
  .md-f32 {
    font-size: 32px !important;
  }
}

/* text-align */

.text-left {
  text-align: left!important;
}
.text-center {
  text-align: center!important;
}
.text-right {
  text-align: right!important;
}
@media (max-width: 767px) {
  /* text-align */
  .xs-text-left {
    text-align: left!important;
  }
  .xs-text-center {
    text-align: center!important;
  }
  .xs-text-right {
    text-align: right!important;
  }
}
@media (max-width: 991px) {
  .sm-text-left {
    text-align: left!important;
  }
  .sm-text-center {
    text-align: center!important;
  }
  .sm-text-right {
    text-align: right!important;
  }
}
@media (min-width: 992px) {
  .md-text-left {
    text-align: left!important;
  }
  .md-text-center {
    text-align: center!important;
  }
  .md-text-right {
    text-align: right!important;
  }
}
@media (min-width: 1200px) {
  .lg-text-left {
    text-align: left!important;
  }
  .lg-text-center {
    text-align: center!important;
  }
  .lg-text-right {
    text-align: right!important;
  }
}

/* vertical-align */

.va-t {
  vertical-align: top !important;
}
.va-m {
  vertical-align: middle !important;
}
.va-b {
  vertical-align: bottom !important;
}
.va-tt {
  vertical-align: text-top!important;
}

/* font-weight */

.fw-b {
  font-weight: bold;
}
.fw-n {
  font-weight: normal;
}

/* line-height */

.lh-normal {
  line-height: 1.42857143;
}
.lh-1 {
  line-height: 1em;
}
.lh-0 {
  line-height: 0;
}
.lh8 {
  line-height: 8px !important;
}
.lh9 {
  line-height: 9px !important;
}
.lh10 {
  line-height: 10px !important;
}
.lh11 {
  line-height: 11px !important;
}
.lh12 {
  line-height: 12px !important;
}
.lh13 {
  line-height: 13px !important;
}
.lh14 {
  line-height: 14px !important;
}
.lh15 {
  line-height: 15px !important;
}
.lh16 {
  line-height: 16px !important;
}
.lh17 {
  line-height: 17px !important;
}
.lh18 {
  line-height: 18px !important;
}
.lh19 {
  line-height: 19px !important;
}
.lh20 {
  line-height: 20px !important;
}
.lh21 {
  line-height: 21px !important;
}
.lh22 {
  line-height: 22px !important;
}
.lh24 {
  line-height: 24px !important;
}
.lh30 {
  line-height: 30px !important;
}
.lh32 {
  line-height: 32px !important;
}
.lh34 {
  line-height: 34px !important;
}
.lh38 {
  line-height: 38px !important;
}
.lh40 {
  line-height: 40px !important;
}
.lh44 {
  line-height: 44px !important;
}
.lh47 {
  line-height: 47px !important;
}
.lh48 {
  line-height: 48px !important;
}
.lh50 {
  line-height: 50px !important;
}
.lh54 {
  line-height: 54px !important;
}
.lh62 {
  line-height: 62px !important;
}
.lh-15{line-height:1.5;}
.lh-18{line-height:1.8;}
.lh-20{line-height:2;}

@media (max-width: 767px) {
  .xs-lh14{
    line-height: 14px !important;
  }
}
@media (min-width: 768px) {
  .sm-lh47 {
    line-height: 47px !important;
  }
}

/* text-decoration */

.td-underline {
  text-decoration: underline;
}

/* link-codes */

.link-decoration-sky {
  color: #09F;
  font-weight: bold;
  text-decoration: underline;
}
.link-decoration-sky:hover {
  color: #900;
}
.link-img-hover a:hover img {
  opacity: 0.7
}

/* white-space */

.ws-normal {
  white-space: normal;
}
.ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}


/*hover-layer*/
.hover-layer:hover .hl-w255{
  width:255px;
}
/* 06-05 COLOR
   ========================================================================== */
/*プライマリカラー指定*/
.c-white {
  color: #fff !important;
}
.c-vp-gray {
  color: #f8f8f8 !important;
}
.c-p-gray {
  color: #f2f2f2 !important;
}
.c-l-gray {
  color: #dddddd !important;
}
.c-gray {
  color: #bbbbbb !important;
}
.c-d-gray {
  color: #888888 !important;
}
.c-black {
  color: #555555 !important;
}

.c-p-green {
  color: #ecf8f3 !important;
}.c-l-green {
  color: #8fd6b8 !important;
}
.c-green {
  color: #44bb88 !important;
}

.c-p-red {
  color: #ffe5e8 !important;
}
.c-l-red {
  color: #ff99a1 !important;
}
.c-red {
  color: #ff3344 !important;
}

.c-p-yellow {
  color: #fff7e5 !important;
}
.c-l-yellow {
  color: #ffcc00 !important;
}
.c-v-yellow {
  color: #ffff00 !important;
}
.c-yellow {
  color: #ffaa00 !important;
}

.c-p-blue {
  color: #f0fafd !important;
}
.c-l-blue {
  color: #6dcee7 !important;
}
.c-blue {
  color: #22aacc !important;
}




/*セカンダリカラー指定*/
.c-orange {
  color: #ee7622 !important;
}
.c-sky {
  color: #32bfbb !important;
}
.c-purple {
  color: #baa1ca !important;
}
.c-magenta {
  color: #e4007f !important;
}
.c-grass {
  color: #9ecb3d !important;
}
.c-water {
  color: #33b3ed !important;
}
.c-lemon {
  color: #ffff16 !important;
}
.c-beige {
  color: #f4a76d !important;
}
.c-d-green {
  color: #3c763d !important;
}
.c-mosgreen {
  color: #70ad47 !important;
}
.c-brown {
  color: #a16358 !important;
}


/* 06-06 BG-COLOR
   ========================================================================== */
/*プライマリカラー指定*/
.bgc-white {
  background-color: #fff !important;
}
.bgc-vp-gray {
  background-color: #f8f8f8 !important;
}
.bgc-p-gray {
  background-color: #f2f2f2 !important;
}
.bgc-l-gray {
  background-color: #dddddd !important;
}
.bgc-gray {
  background-color: #bbbbbb !important;
}
.bgc-d-gray {
  background-color: #888888 !important;
}
.bgc-black {
  background-color: #555555 !important;
}
.bgc-p-green {
  background-color: #ecf8f3 !important;
}
.bgc-l-green {
  background-color: #8fd6b8 !important;
}
.bgc-green {
  background-color: #44bb88 !important;
}
.bgc-p-red {
  background-color: #ffe5e8 !important;
}
.bgc-l-red {
  background-color: #ff99a1 !important;
}
.bgc-red {
  background-color: #ff3344 !important;
}
.bgc-p-yellow {
  background-color: #fff7e5 !important;
}
.bgc-l-yellow {
  background-color: #ffcc00 !important;
}
.bgc-v-yellow {
  background-color: #ffff00 !important;
}
.bgc-yellow {
  background-color: #ffaa00 !important;
}

.bgc-p-blue {
  background-color: #f0fafd !important;
}
.bgc-l-blue {
  background-color: #6dcee7 !important;
}
.bgc-blue {
  background-color: #22aacc !important;
}






/*セカンダリカラー指定*/
.bgc-l-orange {
  background: #ff9600 !important;
}
.bgc-applered {
  background: #b22130 !important;
}

.bgc-orange {
  background: #ee7622 !important;
}
.bgc-d-orange {
  background: #ec6941 !important;
}
.bgc-d-brown{
  background: #7b4101!important;
}

.bgc-pink {
  background: #ffd3d6 !important;
}
.bgc-sky {
  background: #32bfbb !important;
}
.bgc-purple {
  background: #baa1ca !important;
}
.bgc-grass {
  background: #9ecb3d !important;
}
.bgc-water {
  background: #33b3ed !important;
}
.bgc-l-water {
  background: #c3ebff!important;
}

.bgc-lemon {
  background: #ffff16 !important;
}
.bgc-beige {
  background: #f4a76d !important;
}

.bgc-v-green {
  background: #38ba00 !important;
}

.bgc-emelaldgreen {
  background: #1abc9c !important;
}

.bgc-freegreen {
  background: #cce198 !important;
}
.bgc-commonyellow {
  background: #fff799 !important;
}
.bgc-specialorange {
  background: #ecc673 !important;
}
.bgc-p-orange {
  background: #fefffa;
}
.bgc-p-sky {
  background: #fafdff;
}
.bgc-l-freegreen {
  background: #fbfff1 !important;
}
.bgc-l-commonyellow {
  background: #fffeee !important;
}
.bgc-l-specialorange {
  background: #fff7e7 !important;
}
.bgc-linegreen {
  background: #1dcd00;
}




/* 06-07 BORDER
   ========================================================================== */
/*プライマリカラー指定*/
.bdc-white {
  border-color: #fff !important;
}
.bdc-vp-gray {
  border-color: #f8f8f8 !important;
}
.bdc-p-gray {
  border-color: #f2f2f2 !important;
}
.bdc-l-gray {
  border-color: #dddddd !important;
}
.bdc-gray {
  border-color: #bbbbbb !important;
}
.bdc-d-gray {
  border-color: #888888 !important;
}
.bdc-black {
  border-color: #555555 !important;
}

.bdc-p-green {
  border-color: #ecf8f3 !important;
}.bdc-l-green {
  border-color: #8fd6b8 !important;
}
.bdc-green {
  border-color: #44bb88 !important;
}

.bdc-p-red {
  border-color: #ffe5e8 !important;
}
.bdc-l-red {
  border-color: #ff99a1 !important;
}
.bdc-red {
  border-color: #ff3344 !important;
}

.bdc-p-yellow {
  border-color: #fff7e5 !important;
}
.bdc-l-yellow {
  border-color: #ffcc00 !important;
}
.bdc-v-yellow {
  border-color: #ffff00 !important;
}
.bdc-yellow {
  border-color: #ffaa00 !important;
}

.bdc-p-blue {
  border-color: #f0fafd !important;
}
.bdc-l-blue {
  border-color: #6dcee7 !important;
}
.bdc-blue {
  border-color: #22aacc !important;
}



/*radius*/

.radius-4 {
  border-radius: 4px!important;
}











.radius-0 {
  border-radius: 0 !important;
}
.radius-2 {
  border-radius: 2px!important;
}
.radius-4 {
  border-radius: 4px !important;
}
.radius-6 {
  border-radius: 6px !important;
}
.radius-8 {
  border-radius: 8px!important;
}
.radius-10 {
  border-radius: 10px !important;
}
.radius-16 {
  border-radius: 16px!important;
}

.radius-left-4 {
  border-radius: 4px 0 0 4px !important;
}
.radius-left-6 {
  border-radius: 6px 0 0 6px !important;
}
.radius-left-8{
  border-top-left-radius:8px;
  border-bottom-left-radius:8px;
}
.radius-left-10 {
  border-radius: 10px 0 0 10px !important;
}
.radius-right-4 {
  border-radius: 0 4px 4px 0 !important;
}
.radius-right-6 {
  border-radius: 0 6px 6px 0 !important;
}
.radius-right-8{
  border-top-right-radius:8px!important;
  border-bottom-right-radius:8px!important;
}
.radius-right-10 {
  border-radius: 0 10px 10px 0 !important;
}
.radius-top-6 {
  border-radius: 6px 6px 0 0  !important;
}
.radius-top-8 {
  border-radius: 8px 8px 0 0!important;
}
.radius-top-10 {
  border-radius: 10px 10px 0 0  !important;
}
.radius-top-16 {
  border-radius: 16px 16px 0 0!important;
}

.radius-bottom-6 {
  border-radius: 0 0  6px 6px !important;
}
.radius-bot-8 {
  border-radius: 0 0 8px 8px!important;
}
.radius-bottom-10 {
  border-radius: 0 0  10px 10px !important;
}
.radius-bot-16 {
  border-radius: 0 0 16px 16px!important;
}
.radius-arc {
  border-radius: 9999px!important;
}

.bd-0 {
  border: none !important;
}
.bd-t-0 {
  border-top: none !important;
}
.bd-r-0 {
  border-right: none !important;
}
.bd-l-0 {
  border-left: none !important;
}
.bd-b-0 {
  border-bottom: none !important;
}
.bd-b-1 {
  border-bottom-width: 1px !important;
}
.bd-s-1-gray {
  border: 1px solid #ddd !important;
}
.bt-s-1-gray {
  border-top: 1px solid #ddd !important;
}
.br-s-1-gray {
  border-right: 1px solid #ddd !important;
}
.bb-s-1-gray {
  border-bottom: 1px solid #ddd !important;
}
.bl-s-1-gray {
  border-left: 1px solid #ddd !important;
}
.bd-s-1-linegreen {
  border: 1px solid #1dcd00 !important;
}
.bd-s-1-brown {
  border: 1px solid #a89b95 !important;
}
.bd-s-1-l-gray {
  border: 1px solid #EEE!important;
}
.bt-s-1-l-gray {
  border-top: 1px solid #EEE!important;
}
.br-s-1-l-gray {
  border-right: 1px solid #EEE!important;
}
.bb-s-1-l-gray {
  border-bottom: 1px solid #EEE!important;
}
.bl-s-1-l-gray {
  border-left: 1px solid #EEE!important;
}
.bd-s-6-gray {
  border: 6px solid #bfbfbf;
}
.bdc-white {
  border-color: #FFFFFF!important;
}
.bdc-green {
  border-color: #4dbb80!important;
}
.bt-d-1-gray {
  border-top: 1px dashed #ddd!important;
}
@media (max-width: 767px) {
  .xs-bd-0 {
    border: none !important;
  }
}

/* 06-08 DISPLAY-STYLE
   ========================================================================== */

.disp-block {
  display: block;
}
.disp-i {
  display: inline;
}
.disp-i-block {
  display: inline-block;
}
.disp-f {
  display: flex;
}
.disp-li {
  display: list-item;
  list-style: none;
}
.disp-t {
  display: table;
  border-collapse: collapse;
}
.disp-tr {
  display: table-row;
}
.disp-tc {
  display: table-cell;
  vertical-align: middle;
}
@media (max-width: 767px) {
  .xs-disp-block {
    display: block;
  }
  .xs-disp-i {
    display: inline;
  }
  .xs-disp-i-block {
    display: inline-block;
  }
  .xs-disp-f {
    display: flex;
  }
  .xs-disp-li {
    display: list-item;
    list-style: none;
  }
}
@media (min-width: 768px) {
  .sm-disp-t {
    display: table;
    table-layout: fixed;
  }
  .sm-disp-tc {
    display: table-cell;
  }
}
.tb-layout-f {
  table-layout: fixed;
}

/* flex-options */

.f-center {
  justify-content: center!important;
  align-items: center!important;
}
.f-align-center{
  align-items:center!important;
}
.f-justify-center{
  justify-content:center!important;
}
.f-justify-start{
  justify-content:flex-start!important;
}
.f-justify-end{
  justify-content:flex-end!important;
}

.f-justify-between{
  justify-content: space-between!important;
}

.f-direc_r {
  flex-direction: row!important;
}
.f-direc_rr {
  flex-direction: row-reverse!important;
}
.f-direc_c {
  flex-direction: column!important;
}
.f-direc_cr {
  flex-direction: column-reverse!important;
}
.flex-none {
  flex: 0 0 auto;
}
@media (max-width: 767px) {
  .xs-f-direc_r {
    flex-direction: row!important;
  }
  .xs-f-direc_rr {
    flex-direction: row-reverse!important;
  }
  .xs-f-direc_c {
    flex-direction: column!important;
  }
  .xs-f-direc_cr {
    flex-direction: column-reverse!important;
  }
  .xs-flex-none {
    flex: 0 0 auto;
  }
}

.flex-item-variable {
  flex-shrink: 1;
  flex-grow: 1;
}


/* 06-09 OPACITY   
========================================================================== */

.opacity-10 {
  opacity: 1;
}
.opacity-07 {
  opacity: 0.7;
}
.opacity-05 {
  opacity: 0.5;
}
.opacity-02 {
  opacity: 0.2;
}
.opacity-00 {
  opacity: 0;
}

.h-opacity:hover {	
opacity: 0.3;	
}

/* 06-10 HEIGHT   
========================================================================== */

.height-xsmall {
  height: 70px;
  overflow: scroll;
}
.height-xsmall-y {
  height: 70px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.height-small {
  height: 100px;
  overflow: scroll;
}
.height-small-y {
  height: 100px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.height-middle {
  height: 200px;
  overflow: scroll;
}
.height-middle-y {
  height: 200px;
  overflow-x: hidden;
  overflow-y: scroll;
}
.height-large {
  height: 450px;
  overflow: scroll;
}
.height-large-y {
  height: 450px;
  overflow-x: hidden;
  overflow-y: scroll;
}

/* 06-07 etc
   ========================================================================== */

.relative {
  position: relative;
}
.static {
  position: static!important;
}
.absolute-a0{
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
}

.pointer-ev-off, .pointer-ev-off:before, .pointer-ev-off:after {
  pointer-events: none;
}

.user-select-none {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.z-index1{
  z-index:1;
}

.disnon {
  display: none;
}
.i-frame-wrapper {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  display: inline-block;
  padding: 0px;
  border: 1px solid #CCC;
}
.i-frame-wrapper iframe {
  width: 100%;
  height: 100%;
  border: none;
  display: block;
}

/*スタックアイコン*/

.stuck-icon-h70 {
  font-size: 66px;
  line-height: 1em;
}
.stuck-icon-h70 .fa-stack {
  font-size: 35px;
}
.stuck-icon-h70 .fa-stack-1x {
  line-height: 60px;
  font-size: 46px;
  padding: 7px 0 0 0;
}
a:hover .stuck-icon-h70 .fa-stack-1x {
  line-height: 60px;
  font-size: 46px;
  padding: 7px 0 0 0;
  opacity: .3;
}
.stuck-icon-h20 {
  line-height: 1em;
}
.stuck-icon-h20 .fa-stack {
  font-size: 8px;
}
.stuck-icon-h20 .fa-stack-1x {
  line-height: 18px;
  font-size: 6px;
  padding: 0 0 0 0;
}

.fa-stack-outer {
  position: relative;
  display: inline-block;
  width: 1em;
  height: 1em;
  line-height: 1em;
  vertical-align: middle;
}



/*吹き出し用スタイル*/
.arrow-down-caution {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0px 25px;
    border-color: #ffa400 transparent transparent transparent;
}
.arrow-down-danger {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0px 25px;
    border-color: #e92232 transparent transparent transparent;
}

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

@media (max-width: 767px) {
.xs-events-auto{
  pointer-events: auto;
}
}

/*汎用disable*/
.a-disabled{
  opacity: .3!important;
  pointer-events: none!important;
}
[v-cloak] {
  display: none;
}
.pointer-ev-off,
.pointer-ev-off:before,
.pointer-ev-off:after {
  pointer-events: none;
}
#load-screen {
  width: 100vw;
  height: 100vh;
  z-index: 999999999;
  position: fixed;
  background: #FFF;
  display: flex;
  justify-content: center;
  align-items: center;
}

.user-select-none{
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/*overflow*/
.overflow-hidden{
  overflow:hidden!important;
}
.overflow-y-hidden{
  overflow-y:hidden!important;
}

/*fade-in*/
.fade-in {
  opacity: 0;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
}
.fade-in[lazy=loaded] {
  opacity: 1;
}

/*サイポンプレミアム対応*/
.edtr-navbar-btn-plancheck{
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 4px;
  color: #ffffff;
  position: relative;
  cursor: pointer;
  background: #ff3344;
  width: 146px;
  border-right: 1px solid #EEE;
  cursor: pointer;
}
.edtr-navbar-btn-plancheck:hover:after{
  content: "";
  display: block;
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-color:rgba(255,255,255,.7);
  pointer-events: inherit;
}

@media (min-width: 768px){
  .edtr-navbar-btn-upgrade{
    width:auto;
    padding:8px;
  }
  .edtr-navbar-btn-plancheck{
    width:auto;
    padding:8px;
  }
  .edtr-navbar-publish-status{
    padding:8px;
  }
}

@media print {
  body {
    width: 1000px;
  }
  #wrapper{
    overflow-y: hidden!important;
  }
  .print-none{
    display: none!important;
  }
}


/*さいぽんストア用指定群*/
/*いずれ最適な汎用クラス置き場に移動*/
@media (min-width: 768px){
.md-w128{width: 128px !important;;}
.md-h96{height:96px!important;}
}
.photoframe-4to3{
  position: relative;
  width: 100%;
}
.photoframe-4to3:before {
  content:"";
  display: block;
  padding-top: 75%;
}
.photoframe-4to3-inner{
  position: absolute;
  top:0;
  right:0;
  bottom:0;
  left: 0;
  overflow: hidden;
}