html {
  font-family: -apple-system, "Original Yu Gothic", "Yu Gothic", YuGothic, Meiryo, "M+ 1p", sans-serif;
}
@media all and (-ms-high-contrast: none)  {
  html {
    font-family:  Meiryo, sans-serif;
  }
}
@media all and (-ms-high-contrast: active) {
  html {
    font-family:  Meiryo, sans-serif;
  }
}

body {
	text-align: center;
  word-wrap: break-word;
  font-family: "Helvetica Neue", Helvetica, Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif !important;
  font-size: 12px;
  line-height: 1.42857143;
  color: #333;
  background-color: #fff;
}

.txt-center {
	text-align: center;
}
.txt-left {
	text-align: left;
}
.txt-right {
	text-align: right;
}
.txt-bold {
	font-weight: 700;
}
.txt-red {
	color: #ff0000;
}
.txt-small {
	/* font-size: smaller; */
	font-size: 11px;
}
.txt-large {
	/* font-size: large; */
	font-size: 14px;
}

.yellow_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffffbc 0%) repeat scroll 0 0;}
.pink_line {background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #FFDFEF 0%) repeat scroll 0 0;}
.blue_line{background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #cce5ff 0%) repeat scroll 0 0;}
.green_line{background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ccff99 0%) repeat scroll 0 0;}

.float-left {
  float: left;
}
.float-right {
  float: right;
}
.clr{
  clear: both;
}
body a{
	color: #0044cc;
	text-decoration: underline;
  word-break: break-all;
}
body a:hover {
	color: red;
}
body ul {
	list-style-type: none;
}
hr.hr-style1 {
	height: 10px;
	border: 0;
	box-shadow: 0 10px 10px -10px #8c8b8b inset;
	margin: 0.3em 0 0 0;
}

/* --------------------------------- */
/* TABLE border color */
/* --------------------------------- */
.tbYellow { border: #daa520 1px solid; padding:3px; }
.tbGreen { border: #00cc33 1px solid; padding:3px; }
.tbBlue { border: #0000ff 1px solid; padding:3px; }
.tbLtBlue { border: #0099ff 1px solid; padding:3px; }
.tbOrange { border: #ff9933 1px solid; padding:3px; }
.tbPink { border: #ff00ff 1px solid; padding:3px; }
.tbStPink { border: #cc3399 1px solid; padding:3px; }
.tbSmBlue { border: #009999 1px solid; padding:3px; }
.tbGray { border: #bebebe 1px solid; padding:3px; }
.tbPurple { border: #990099 1px solid; padding:3px; }
.tbRed { border: #ff0000 1px solid; padding:3px; }
.tbYGreen { border: #33ff66 1px solid; padding:3px; }

.divTable { display: table; }
.divTableRow { display: table-row; }
.divTableCell{ display: table-cell; }



/*---------------------------------------------------*/
/* Bootstrap label */
/*---------------------------------------------------*/


.label {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #ffffff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}
a.label:hover,
a.label:focus {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}
.label:empty {
  display: none;
}
.btn .label {
  position: relative;
  top: -1px;
}
.label-default {
  background-color: #777777;
}
.label-default[href]:hover,
.label-default[href]:focus {
  background-color: #5e5e5e;
}
.label-primary {
  background-color: #337ab7;
}
.label-primary[href]:hover,
.label-primary[href]:focus {
  background-color: #286090;
}
.label-success {
  background-color: #5cb85c;
}
.label-success[href]:hover,
.label-success[href]:focus {
  background-color: #449d44;
}
.label-info {
  background-color: #5bc0de;
}
.label-info[href]:hover,
.label-info[href]:focus {
  background-color: #31b0d5;
}
.label-warning {
  background-color: #f0ad4e;
}
.label-warning[href]:hover,
.label-warning[href]:focus {
  background-color: #ec971f;
}
.label-danger {
  background-color: #d9534f;
}
.label-danger[href]:hover,
.label-danger[href]:focus {
  background-color: #c9302c;
}

.box-radius {
  border-radius: 4px;
  border: solid 1px rgba(144, 144, 144, 0.25);
  margin: 2em 0;
  padding: 1em;
}

.topic-content .expired-button a {
  -webkit-border-radius: 3;
  -moz-border-radius: 3;
  border-radius: 3px;
  color: #ffffff;
  font-size: 14px;
  background: #777777;
  padding: 10px 20px 10px 20px;
  margin: 1em;
  text-decoration: none;
  display: inline-block;
}

::backdrop {
  /*
  background-image: linear-gradient(
    45deg,
    magenta,
    rebeccapurple,
    dodgerblue,
    green
  );
  */
  background-image: linear-gradient(180deg, rgba(233, 233, 233, 1), rgba(172, 172, 172, 1));
  opacity: 0.75;
}


/* スマホの時だけ改行させるクラス */
.br-sp {
    display: none;
}

.box-attention {
  background-color: #eee;
  padding: 1em;
  border: 1px solid #DADCE0;
}

@media (max-width: 600px) {
    .br-sp {
        display: block;
    }
}