/*
 * セレクトボックス
 */
.select-container {
  position: relative;
  margin: 20px 10px;
}
.select-container:after {
  content: "\0020";
  background-image: url(/resource/sp/img/common/sprites.png);
  width: 32px;
  height: 32px;
  display: block;
  overflow: hidden;
  background-position: -96px -64px;
  position: absolute;
  right: 7px;
  top: 50%;
  margin-top: -16px;
}
.select-container select.style-B {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#1c8fdd), color-stop(0.3, #4fb5f6), to(#2083c8)), -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#cfcfcf));
}
.select-container select {
	width: 100%;
	vertical-align: middle;
  min-height: 42px;
  font-size: 16px;
  -webkit-border-radius: 10px;
  background: #fefefe;
  color: #000;
  -webkit-background-size: 42px 100%, 100% 100%;
  -webkit-box-sizing: border-box;
  border: 1px solid #d5d5d5;
  -webkit-appearance: none;
  margin: 0;
  padding: 8px 80px 8px 16px;
  background-repeat: no-repeat, no-repeat;
  background-position: right top, left top;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#a2a2a2), to(#686868)), -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#cfcfcf));
}
/*
 * ボタン
 */
.component-gdo-main-content .basic-button {
  cursor: pointer;
  margin: 20px 10px;
  text-decoration: none;
  -webkit-border-radius: 8px;
  text-align: center;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.25);
  display: inline-block;
  padding: 4px 8px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(0.5, #fff), color-stop(0.5, #dadada), to(#dadada));
  color: #010101;
  border: 1px solid #232222;
  line-height: 1.6;
}
.component-gdo-main-content .basic-button.full-width {
  display: block;
  padding-left: 0;
  padding-right: 0;
}
.component-gdo-main-content a.basic-button.em {
  border: #1e90de 1px solid;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#92d6fd), color-stop(0.5, #5eb4f1), color-stop(0.5, #1a94e1), to(#318ed7));
  color: #fff;
  text-shadow: 0 -1px 1px #145887;
}

/*------------------------------------------------
  基本的なテーブル
------------------------------------------------*/

table.basic-table {
  width:100%;
  color:#333;
}
table.basic-table>*>tr>td {
  text-align:center;
  padding:8px;
  border:4px groove #666;
  background:#505050
}
table.basic-table>*>tr>th {
  text-align:center;
  background-image:-webkit-gradient(linear, left top, left bottom, from(#515151), color-stop(0.5, #515151), color-stop(0.5, #2d2d2d), to(#2d2d2d));
  padding:8px;
  border:4px groove #666
}
table.basic-table>*>tr:first-child>* {
  border-top:0
}
table.basic-table>*>tr:last-child>* {
  border-bottom:0
}
table.basic-table>*>tr>*:first-child {
  border-left:none
}
table.basic-table>*>tr>*:last-child {
  border-right:0
}
table.basic-table {
  color:#333
}
table.basic-table>tbody>tr>td {
  text-align:center;
  padding:8px;
  border:1px solid #ccc;
  background:#f6f6f6
}
table.basic-table>tbody>tr>th {
  text-align:center;
  background-image:-webkit-gradient(linear, left top, left bottom, from(#a5a5a5), color-stop(0.5, #a5a5a5), color-stop(0.5, #787878), to(#787878));
  padding:8px;
  border:1px solid #ccc;
  color:#fff;
  text-shadow:0 -1px 1px #333
}
/*
 * 基本的なテーブル B
 */
table.basic-table-B {
  width: 100%;
}
table.basic-table-B>*>tr {
  border-bottom:1px solid #161616
}
table.basic-table-B>*>tr:last-child {
  border-bottom:0
}
table.basic-table-B>*>tr>th {
  white-space:nowrap;
  background:#666;
  color:#fff;
  font-weight:normal;
  padding:10px;
  text-align:left
}
table.basic-table-B>*>tr>td {
  background:#ebebeb;
  color:#000;
  text-align:left;
  padding:10px
}
table.basic-table-B.separate {
  border-collapse:separate;
  border-spacing:1px;
}
table.scrollable tbody {
  width:600px;
  overflow-x:auto;
}
table.basic-table-B>tbody>tr {
  vertical-align:top;
  text-align:left;
  border-bottom:1px solid #fff
}
table.basic-table-B>tbody>tr:last-child {
  border-bottom:0;
}
table.basic-table-B>tbody>tr>th {
  white-space:nowrap;
  background-color:#666;
  color:#fff;
  font-weight:normal;
  padding:10px;
}
table.basic-table-B>tbody>tr>td {
  background-color:#ebebeb;
  color:#000;
  text-align:left;
  padding:10px;
}
table.basic-table-B.separate {
  border-collapse:separate;
  border-spacing:1px;
}

.layout-table-wrapper {
  padding: 0rem 1rem;
  margin: 2rem 0rem;
}
table.layout-table {
  width: 100%;
}
table.layout-table.spacing>tbody>tr>th, table.layout-table.spacing>tbody>tr>td {
  padding-left:10px;
  padding-right:10px;
}
table.layout-table.spacing>tbody>tr>th:first-child, .layout-table.spacing>tbody>tr>td:first-child {
  padding-left:0;
}
table.layout-table.spacing>tbody>tr>th:last-child, .layout-table.spacing>tbody>tr>td:last-child {
  padding-right:0;
}
table.layout-table>tbody>tr>th {
  font-weight:normal;
  vertical-align: middle;
}
/*
 * 評価点（星付き）
 */
.column-stars {
  margin: 2rem 1rem;
  background-color:#f2f2f2;
  color:#333;
  -webkit-border-radius:16px;
  border-width: 0;
  overflow: hidden;
  clear: both;
  padding: 16px;
  position: relative;
  max-height: 999999px;
}
.column-stars em {
  color:#06c
}
.blue-stars {
  background-image:url(/resource/sp/img/lesson/blue_stars.png);
  width:150px;
  height:27px;
  background-size:300px auto;
  display:inline-block
}
.blue-stars.stars-00 {
  background-position:-150px 0
}
.blue-stars.stars-05 {
  background-position:-150px -27px
}
.blue-stars.stars-10 {
  background-position:-120px 0
}
.blue-stars.stars-15 {
  background-position:-120px -27px
}
.blue-stars.stars-20 {
  background-position:-90px 0
}
.blue-stars.stars-25 {
  background-position:-90px -27px
}
.blue-stars.stars-30 {
  background-position:-60px 0
}
.blue-stars.stars-35 {
  background-position:-60px -27px
}
.blue-stars.stars-40 {
  background-position:-30px 0
}
.blue-stars.stars-45 {
  background-position:-30px -27px
}
.blue-stars.stars-50 {
  background-position:-0 0
}