:root {
  --main-blue: #006CAB; /* rgba(0, 108, 171, 1) */
  --sub-blue: #0095C1; /* rgba(0, 149, 193, 1) */
  --sub-green: #1AD9A3; /* rgba(26, 217, 163, 1) */
  --sub-yellow: #F2C641; /* rgba(242, 198, 65, 1) */
  --sub-pink: #FFB4BC; /* rgba(255, 180, 188, 1) */
  --bg-color: #FAFBFC; /* rgba(248, 249, 250, 1) */
  --black: #2e3d49;
}

@media (min-width: 1400px) {
  .container {
    max-width: 1140px;
  }
}

body {
  background: var(--bg-gradation);
}

body, #wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background: var(--bg-color);
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

h1,
h2,
h3 {
  color: var(--black);
  font-weight: 600;
}
h4,
h5,
h6 {
  color: var(--black);
  font-weight: 300;
}

@media screen and (max-width: 576px) {
  html{font-size: 62.5%;} /*10px相当*/
  body{font-size: 1.4rem;}
  h1{font-size: 2.4rem;}
  h2{font-size: 2.2rem;}
  h3{font-size: 2.0rem;}
  h4{font-size: 1.8rem;}
  h5{font-size: 1.6rem;}
  h6{font-size: 1.4rem;}
  p{font-size: 1.4rem;}
  th{font-size: 1.4rem;}
  td{font-size: 1.4rem;}
}

p {
  color: var(--black);
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover {
  text-decoration: none;
  color: inherit;
}

p a {
  text-decoration: none;
  color: #007bff;
}

p a:hover {
  text-decoration: underline;
  color: #0056b3;
}

ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0px;
}

mark {
  padding: 0;
  background-color: #FFCF9E;
}

.sub {
  vertical-align: sub;
  font-size: smaller; 
}

.sup {
  vertical-align: super;
  font-size: smaller; 
}

.table-responsive th, .table-responsive-xs th, .table-responsive-sm th, .table-responsive-md th, .table-responsive-lg th, .table-responsive-xl th {
  white-space: nowrap;
}

.tooltip-inner {
  background-color: lightblue;
  color:black;
}
.tooltip[data-popper-placement=right] .tooltip-arrow:before {
  border-right-color: lightblue !important;
}
.tooltip[data-popper-placement=left] .tooltip-arrow:before {
    border-left-color: lightblue !important;
}
.tooltip[data-popper-placement=bottom] .tooltip-arrow:before {
    border-bottom-color: lightblue !important;
}
.tooltip[data-popper-placement=top] .tooltip-arrow:before {
    border-top-color: lightblue !important;
}

.tooltip-lg {
  background-color: lightblue;
  color:black;
  padding: 0.5em;
  margin: 0.5em;
}

.text-gray {
  --bs-text-opacity: 1;
  color: rgba(200, 200, 200, var(--bs-text-opacity)) !important;
}

.text-coral {
  --bs-text-opacity: 1;
  color: rgba(240, 128, 128, var(--bs-text-opacity)) !important;
}

.text-green {
  --bs-text-opacity: 1;
  color: rgba(26, 217, 163, var(--bs-text-opacity)) !important;
}

.btn-xl {
  text-transform: uppercase;
  padding: 1.5rem 3rem;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.1rem;
}

.bg-black {
  background-color: #000 !important;
}

.rounded-pill {
  border-radius: 5rem;
}

.breadcrumb {
  background-color: #e9ecef !important;
}

.navbar-custom {
  padding-top: 1rem;
  padding-bottom: 1rem;
  background: linear-gradient(135deg, rgba(0, 108, 171, 0.9) 0%, rgba(0, 149, 193, 0.9) 100%) fixed;
}

.navbar-custom .navbar-brand {
  text-transform: uppercase;
  font-size: 1rem;
  letter-spacing: 0.1rem;
  font-weight: 700;
}

.navbar-custom .navbar-nav .nav-item .nav-link {
  text-transform: uppercase;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.1rem;
}

.nav-notification {
  position: relative;
}

.nav-notification span {
  font-size: 100%;
  position: absolute;
  color: orange;
  top: -5px;
  left: calc(100% - 10px);
  width:  20px;
  height: 20px;
  letter-spacing: 0;
  border-radius: 50%;
}

.navbar-nav > li > .dropdown-menu > .dropdown-item {
  font-size: 0.9rem;
}

.nav-pills .nav-item .nav-link, .nav-tabs .nav-item .nav-link {
  color: inherit;
}

.nav-pills .nav-item .nav-link.active {
  color: white;
}

@media screen and (max-width: 576px) {
  .navbar-custom .navbar-brand{font-size: 1.5rem;}
  .navbar-custom .navbar-nav .nav-item .nav-link{font-size: 1.2rem;}
  .navbar-nav > li > .dropdown-menu > .dropdown-item{font-size: 1.2rem;}
  .dropdown-menu{font-size:  1.2rem;}
  .form-control{font-size:  1.3rem;}
  .btn{font-size: 1.3rem;}
  .toast{font-size:  1.3rem;}
}

legend.form-label {
  font-size: initial;
}

header.masthead {
  position: relative;
  overflow: hidden;
  padding-top: calc(7rem + 72px);
  padding-bottom: 7rem;
  background-image: url("../img/top-masthead_md.b11cc6a2afa5.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: scroll;
  background-size: cover;
}

header.masthead .masthead-content {
  z-index: 1;
  position: relative;
}

header.masthead .masthead-content .masthead-heading {
  font-size: 4rem;
  color: white;
  text-shadow:#000 0px 0px 6px;
}

header.masthead .masthead-content .masthead-subheading {
  font-size: 2rem;
  color: white;
  text-shadow:#000 0px 0px 6px;
}

@media (min-width: 992px) {
  header.masthead {
    padding-top: calc(10rem + 55px);
    padding-bottom: 10rem;
  }
  header.masthead .masthead-content .masthead-heading {
    font-size: 5rem;
  }
  header.masthead .masthead-content .masthead-subheading {
    font-size: 3rem;
  }
}

/* subscription plans */
header.masthead-plans {
  position: relative;
  overflow: hidden;
  padding-top: calc(7rem + 72px);
  padding-bottom: 7rem;
  background-image: url("../img/subscriptions-top.c38876fd62a1.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-attachment: scroll;
  background-size: cover;
}

header.masthead-plans .masthead-content {
  z-index: 1;
  position: relative;
}

header.masthead-plans .masthead-content .masthead-heading {
  font-size: 4rem;
  color: white;
  text-shadow:#000 0px 0px 6px;
}

header.masthead-plans .masthead-content .masthead-subheading {
  font-size: 2rem;
  color: white;
  text-shadow:#000 0px 0px 6px;
}

header.masthead-plans .masthead-trialdue {
  text-shadow:#000 0px 0px 6px;
  color: white;
  letter-spacing: 0.3px;
  font-weight: bold;
}

@media (min-width: 992px) {
  header.masthead-plans {
    padding-top: calc(10rem + 55px);
    padding-bottom: 10rem;
  }
  header.masthead-plans .masthead-content .masthead-heading {
    font-size: 5rem;
  }
  header.masthead-plans .masthead-content .masthead-subheading {
    font-size: 3rem;
  }
}

.plans-top-img {
  max-height: 350px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;
}

.plans-top-img img {
  object-fit: cover;
  width: 100%;
}

.plans-table-container {
  width: 100%;
  overflow-x: scroll; 
}

table.plans-contents-table th {
  min-width: 105px;
}

table.plans-contents-table thead th, table.plans-contents-table thead td{
  padding: 0.25rem 0.25rem;
}

table.plans-contents-table tbody th{
  padding: 0.75rem 0.25rem;
}



/*
.messages-area {
  position:fixed;
  bottom: 0;
  width:100%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
}
*/

.messages {
  top: 80;
  right: 10;
  z-index: 1000;
}

@media screen and (max-width: 576px) {
  .messages {
    top: 55;
  }
}

.top-img {
  max-height: 350px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pgbar {
  border-radius: 20px;
  border: lightgray 0.5px solid;
  background-color: white;
  margin: 5px;
  height: 10px;
  overflow: hidden;
}

.pgbar-base {
   position: relative;
}

.pgbar-over {
  background: none;
  margin: 0px;
  position: absolute;
  top: -0.5px;
  left: -0.5px;
  right: -0.5px;
  bottom: -0.5px;
}

.pgbar svg {
  height: 100%;
  width: 100%;
  border-radius: 10px;
}

.tile {
  border-radius: 10px;
  box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
  background: white;
  padding: 10px;
  overflow: hidden;
}

.notebook {
  box-shadow: 0 0 10px rgba(0,0,0,0.3);
  background: white;
  padding: 10px;
  overflow: hidden;
}

/* Static pages - 静的ページ */
.legal-table th{
  width: 30%;
  padding: 1.3rem 0.75rem;
}

.legal-table td{
  width: 70%;
  padding: 1.3rem 0.75rem;
}

/* コース一覧 */
.course_all-title {
  text-align:center;
  color: var(--black);
}

.course_all-title:hover {
  text-align:center;
  color: black;
}

.course_all-add {
}

.course_all-image {
  border-radius: 20px;
  max-width: 80%;
  max-height: 40%;
  margin: auto;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.course_all-imagetag {
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
}

.course_all-subtitle {
  margin: 10px auto;
}

.course_all-metas {
  display: flex;
  align-items: center;
  flex-direction: column;
}

.course_all-meta {
  font-size: 90%;
  font-weight: bold;
  line-height: 22px;
}

/* コースリスト */
.course_list-link {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 1;
}

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

.course_list-meta {
  font-size: 90%;
}

.course_list-meta a {
  z-index: 5;
}

.course_list-meta span {
  vertical-align: middle;
  line-height: 20px;
}

@media screen and (min-width: 577px) {
  .course_list-title {
    width: 80%;
    text-align: right;
    position: absolute;
    top: 13px;
    right: 10px;
    color: white;
    text-shadow: 1px 1px 3px #444;
    font-weight: 400;
  }

  .course_list-image {
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }

  .course_list-imagetag {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
  }
}

@media screen and (max-width: 576px) {
  .course_list-title {
    display: inline-block;
    font-weight: 400;
  }

  .course_list-image {
    margin: 10px 10px 0 10px;
  }

  .course_list-imagetag {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    margin: 0.5rem;
    object-fit: cover;
  }
}

.course_list-remove {
  position: absolute;
  top: 10px;
  right: 15px;
  width: inherit;
  z-index: 5;
  cursor: pointer;
}

#overlay_wrapper {
  position: relative;
  min-height: 10rem;
}

#overlay{ 
  position: absolute;
  top: 0;
  z-index: 100;
  width: 100%;
  height:100%;
  display: none;
  background: rgba(0,0,0,0.4);
}

.cv-spinner {
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;  
}

/* コース概説 */
.course_sidebar-imagetag {
  max-height: 100px;
}

.course_sidebar-sectitle span {
  vertical-align: middle;
}

.course_sidebar-steps {
  white-space: nowrap;
}

.course_sidebar-steps div {
  vertical-align: middle;
}

.course_sidebar-steps .steps-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: calc(100% - 5rem);
}

.course_sidebar-steps .step_unfinished{
  color: var(--black);
}

.course_sidebar-steps .step_finished{
  color: #AAA;
}

.course_sidebar-steps .step_unavailable{
  color: #AAA;
}

.course_sidebar-steps .step_current{
  font-weight: bold;
  color: var(--black); 
}

.icon_locked{
  color: orange;
}

.icon_unlocked{
  color: orange;
}

.steps-mark {
  width: 20px;
  vertical-align: middle;
}

.steps-num {
  width: 20px;
}

.course_overview-image {
  margin: -10px;
  min-height: 150px;
  max-height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.course_overview-image img {
  max-width: 80%;
  max-height: 120px;
  filter: invert(50%) sepia(0%) saturate(11%) hue-rotate(143deg) brightness(101%) contrast(93%);
}

.course_overview-step_unavail .course_overview-image img {
  filter: invert(80%) sepia(0%) saturate(11%) hue-rotate(143deg) brightness(101%) contrast(93%);
}

.course_overview-image .pgbar {
  position: absolute;
  bottom: 50px;
  left: 50%;
}

.course_overview-step_unavail h4,
.course_overview-step_unavail h5,
.course_overview-step_unavail p,
.course_overview-step_unavail div {
  color: #AAA !important;
}

/* Lecture */
.icon_play {
  color: var(--sub-pink);
}

.lecture_listcard {
  border-radius: 10px;
  box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
  background: white;
}

.lecture_thumbnail {
  border-radius: 20px;
  max-width: 80%;
  object-fit: cover;
}

.lecture_list {
  position: absolute;
  left: 0px;
  top: 0px;
  color: var(--main-blue);
}

.lecture_step_button {
  position: absolute;
  right: 0px;
  top: 0px;
}

.lecture_title {
  width: 92%;
}

.lecture_prev {
  color: var(--main-blue);
  position: absolute;
  left:  0px;
  top: 10%;
}

.lecture_next {
  color: var(--main-blue);
  position: absolute;
  right:  0px;
  top: 10%;
}

.feedback_button {
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.bookmark_button {
  position: absolute;
  top: 15px;
  left: 30px;
  color: var(--main-blue);
}

.mark_lec_button {
  position: absolute;
  top: 1rem;
  left: 2rem;
  color: lightgray;
  cursor: pointer;
}

.unmark_lec_button {
  position: absolute;
  top: 1rem;
  left: 2rem;
  color: var(--sub-yellow);
  cursor: pointer;
}

.done_lec_button {
  color: lightgray;
  cursor: pointer;
}

.undone_lec_button {
  color: var(--main-blue);
  cursor: pointer;
}

.done_lec_mark{
  color: var(--main-blue);
}

.mark_button {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  color: lightgray;
  cursor: pointer;
}

.unmark_button {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  color: var(--sub-yellow);
  cursor: pointer;
}

.lecture_forum_comment {
  width: 100%;  
/*  white-space: nowrap;  
  overflow: hidden;  
  text-overflow: ellipsis;  
  -webkit-text-overflow: ellipsis;  
  -o-text-overflow: ellipsis;*/
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@media screen and (max-width: 576px) {
  .feedback_button {
    top: 5px;
    right: 10px;
  }

  .bookmark_button {
    top: 10px;
    left: 20px;
  }
}

.bookmark_button:hover {
  color: var(--sub-blue);
}

.donebutton, .undonebutton, .nextbutton{
  min-width: 100px;
}

.undonebutton:not(:disabled):not(.disabled){
  cursor: default;
}
.undonebutton:hover{
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

@media screen and (max-width: 576px) {
  .donebutton, .undonebutton, .nextbutton{
    min-width: 70px;
  }
}

/* deprecated */
.lecture_movie{
  margin: 30px auto;
  width: 100%;
  max-height: 720px;
  max-width: 960px;
}

/* Audio list */
.audio-image {
  color: lightgray;
  min-height: 200px;
  min-width: 300px;
  font-size: 18rem;
  border-radius: 1rem;
  padding: 2rem;
  border: 3px solid lightgray;
}

table.audio-list-table th, table.audio-list-table td {
  vertical-align: middle;
}

/* QeustionList */
table#course_quesiton_list th {
  vertical-align: middle;
}

/* Question */
@counter-style decimal-circle {
  system: fixed;
  symbols: '①' '②' '③' '④' '⑤' '⑥' '⑦' '⑧' '⑨' '⑩';
  suffix: " ";
  fallback: numeric;
}

ol.question_order_list {
  padding-left: 0;
}

ol.question_order_list li {
  list-style-position: inside;
}

ol.question_order_list_bold li::marker {
  font-weight:bold;
}

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

.checkbox_custom {
  margin-top: 10px;
  margin-bottom: 40px;
}

.checkbox_custom label {
  width: 100%;
  line-height: 2.3rem;
  border-radius: 20px;
  border: lightgray 1px solid;
  padding-left: 1.25rem;
}

.checkbox_custom input:checked + label {
  /*background: lightblue;*/
  color: var(--sub-blue);
  border: var(--sub-blue) 2px solid;
}

.checkbox_custom.ctest_question_correct input:checked + label {
  color: var(--sub-blue);
  border: var(--sub-blue) 2px solid;
}

.checkbox_custom.ctest_question_incorrect input:checked + label {
  color: crimson;
  border: crimson 2px solid;
}

i.ctest-result.fa-check{
  position: absolute;
  top: 0.3rem;
  left: -2rem;
  color: var(--main-blue);
}

i.ctest-result.fa-times{
  position: absolute;
  top: 0.3rem;
  left: -2rem;
  color: crimson;
}

.checkbox_custom input[type=checkbox] {   
    display: none;    
}

.form-group {
    margin-bottom: 0.8rem !important;
}

/* Result */
.result_pass {
  color: var(--main-blue);
}

.result_failure {
  color: crimson;
}

.result_choice {
  width: 100%;
  line-height: 2.3rem;
  border-radius: 20px;
  border: lightgray 1px solid;
  padding-left: 1.25rem;
  margin-bottom: 0.8rem;
}

.answer_true{
  color: var(--sub-blue);
  border: var(--sub-blue) 2px solid;
}

.answer_false{
  color: crimson;
  border: crimson 2px solid;
}

.result_correct{
  position: absolute;
  right: 30px;
}

.result_incorrect{
  position: absolute;
  right: 33px;
}

.result_correct .fa-check{
  color: var(--sub-blue);
  line-height: 2.3rem;
}

.result_incorrect .fa-times{
  color: crimson;
  line-height: 2.3rem;
}

.icon_correct {
  color: var(--sub-blue);
  -webkit-text-stroke: 1px;
}

.icon_incorrect {
  color: crimson;
}

.result_explanation {
  border-radius: 20px;
  border: lightgray 1px solid;
  padding: 20px;
  margin: 10px 0;
}

.result_subtitle {
  border-bottom: lightgray 1px solid;
}

.result_record {
  float: right;
}

.result_archive {
  border: lightgray 1px solid;
  padding: 10px;
  margin: 10px;
}

/* Questions list */
table.questions_list_table td, table.questions_list_table th {
  padding: 0.75rem 0.25rem;
}

.qlist-marks i.fa-bookmark{
  margin-top: 0.1rem;
  color: var(--sub-yellow);
  text-align: center;
}

/* Fill-in-the-blank questions */
.fillin-question_answer {
  position: relative;
  display: inline-block;
  background-color: #e9ecef;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  padding: 0.375rem 0.75rem;
  width: 100%;
}

.fillin-question_answer i.icon_correct, .fillin-question_answer i.icon_incorrect {
  position: absolute;
  right: 1rem;
  top: 30%;
}

/* Writing questions */
.writing_scoring {
  white-space: nowrap;
  display: inline-block;
  float: right;
}

/* textbook list */
.textbook_listcard {
  box-shadow: 0 0 10px rgb(0 0 0 / 30%);
}

.textbook_listcard li{
  padding-left: 30px;
  position: relative;
}

.textbook_listcard li:before{
  content: "";
  position: absolute;
  top: .2rem;
  left: .5rem;
  -webkit-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  transform: rotate(50deg);
  width: 5px;
  height: 10px;
  border-right: 2px solid var(--sub-blue);
  border-bottom: 2px solid var(--sub-blue);
}

/* textbook */
.textbook_options {
  position: absolute;
  left: 0px;
  top: 0px;
  color: var(--main-blue);
}

.tblank_area {
  position: absolute;
  right: 0;
  top: 5px;
  margin: auto;
  width: 60px;
}

.tblank_area input[type="checkbox"] {
  display: none;
}

.tblank_area label {
  display: block;
  box-sizing: border-box;
  text-align: left;
  border: 2px solid var(--sub-blue);
  border-radius: 3px;
  line-height: 1;
  height: 1.5rem;
}

.tblank_area #tblank_box {
  displa: inline-block;
  height: 1.26rem;
  width: 50%;
  background: #ddd;
  transition: .3s;
}

.tblank_area #tblank_check:checked + label #tblank_box {
  transform: translateX(100%);
  background: var(--sub-blue);
}

.download_buttons {
  position: absolute;
  top: 1rem;
  left: 1rem;
  color: var(--main-blue);
}

.textbook_next {
  position: absolute;
  top: -2rem;
  right: 0rem;
  width: 45%;
}

.textbook_prev {
  position: absolute;
  top:-2rem;
  left: 0rem;
  width: 45%;
}

.textbook_page {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: calc(100% - 2rem);
  vertical-align: middle
}

.textbook_page_icon {
  vertical-align: middle
}

#textbook {
  font-family: 'Noto Sans JP', 'IPAexGothic', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
  line-height: 1.6rem;
  letter-spacing: 0.3px;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-touch-callout:none;
}

#textbook a {
  text-decoration: none;
  color: #007bff;
}

#textbook a:hover {
  text-decoration: underline;
  color: #0056b3;
}

#textbook ul,
.markdown_area ul {
  list-style: disc;
  padding-left: 1.3rem;
}

#textbook ol,
.markdown_area ol {
  list-style: decimal;
  padding-left: 1.3rem;
}

#textbook ul ul, #textbook ol ul,
.markdown_area ul ul, .markdown_area ol ul {
  list-style: circle;
}

#textbook ul ul ul, #textbook ul ol ul, #textbook ol ul ul, #textbook ol ol ul,
.markdown_area ul ul ul, .markdown_area ul ol ul, .markdown_area ol ul ul, .markdown_area ol ol ul {
  list-style: square;
}

#textbook ol ol, #textbook ul ol,
.markdown_area ol ol, .markdown_area ul ol {
  list-style-type: lower-roman;
}

#textbook ul ul ol, #textbook ul ol ol, #textbook ol ul ol, #textbook ol ol ol,
.markdown_area ul ul ol, .markdown_area ul ol ol, .markdown_area ol ul ol, .markdown_area ol ol ol {
  list-style-type: lower-alpha;
}

#textbook li,
.markdown_area li {
  margin: 0.2rem 0;
}

#textbook h1, #textbook h2, #textbook h3, #textbook h4, #textbook h5, #textbook h6,
.markdown_area h1, .markdown_area h2, .markdown_area h3, .markdown_area h4, .markdown_area h5, .markdown_area h6 {
  font-weight: 600;
  color: #3E3E3E;
  margin: 1.3rem 0 1.1rem 0;
}

#textbook p, #textbook li, #textbook td,
.markdown_area p, .markdown_area li, .markdown_area td {
  color: #3E3E3E;
}

#textbook table,
.markdown_area table {
/*  display: block;
  width: 100%;*/
  overflow: auto;
  border-spacing: 0;
  border-collapse: collapse;
  break-inside: avoid;
}

#textbook table th,
.markdown_area table th {
  font-weight: 600;
}

#textbook table th, #textbook table td,
.markdown_area table th, .markdown_area table td {
  padding: 6px 13px;
  border: 1px solid #dfe2e5;
}

#textbook div.center-table + table,
.markdown_area div.center-table + table {
  margin: auto!important;
}

/* for test-mode */
#textbook table td em{
  color: #3E3E3E;
  font-style: normal;
}

#textbook table tr,
.markdown_area table tr  {
  background-color: #fff;
  border-top: 1px solid #c6cbd1;
}

#textbook table tr:nth-child(2n),
.markdown_area table tr:nth-child(2n) {
  background-color: #f6f8fa;
}

#textbook img,
.image_max_width img {
  max-width: 100%;
  box-sizing: content-box;
  background-color: #fff;
/*  margin: auto;
  display: block;*/
}

#textbook p:has(>img) {
  display: flex;
  justify-content: center;
}

#textbook img[alt="w10"],
.image_max_width img[alt="w10"] {
  width: 10%;
}

#textbook img[alt="w20"],
.image_max_width img[alt="w20"] {
  width: 20%;
}

#textbook img[alt="w30"],
.image_max_width img[alt="w30"] {
  width: 30%;
}

#textbook img[alt="w40"],
.image_max_width img[alt="w40"] {
  width: 40%;
}

#textbook img[alt="w50"],
.image_max_width img[alt="w50"] {
  width: 50%;
}

#textbook img[alt="w60"],
.image_max_width img[alt="w60"] {
  width: 60%;
}

#textbook img[alt="w70"],
.image_max_width img[alt="w70"] {
  width: 70%;
}

#textbook img[alt="w80"],
.image_max_width img[alt="w80"] {
  width: 80%;
}

#textbook img[alt="w90"],
.image_max_width img[alt="w90"] {
  width: 90%;
}

#textbook img[alt="w100"],
.image_max_width img[alt="w100"] {
  width: 100%;
}

#textbook h1,
.markdown_area h1 {
 font-size: 1.4rem;
}
#textbook h2,
.markdown_area h2 {
 font-size: 1.3rem;
}
#textbook h3,
.markdown_area h3 {
 font-size: 1.25rem;
}
#textbook h4,
.markdown_area h4 {
 font-size: 1.2rem;
}
#textbook h5,
.markdown_area h5 {
 font-size: 1.1rem;
}
#textbook h6,
.markdown_area h6 {
 font-size: 1.05rem;
}

#textbook strong,
.markdown_area strong {
  color: #3E3E3E;
}

#textbook blockquote,
.markdown_area blockquote {
  padding: 0 1em;
  color: #6a737d;
  border-left: 0.25em solid #dfe2e5;
  margin: 0.5rem 0;
}

.textbook-binder{
  font-size: 1.7rem;
  font-weight: 600;
  margin: 1rem 0 0 0;
  text-align: center;
}

.textbook-header{
  border-top: 1px solid gray;
  border-bottom: 1px solid gray;
  margin: 3rem 0 1rem 0;
  position: relative;
}

.textbook-header:nth-of-type(n+2) {
  page-break-before: always;
}

.textbook-header .textbook-title{
  font-size: 1.5rem;
  font-weight: 600;
  margin: 1.2rem 0;
}

.textbook-header .textbook-info {
  color: #6c757d;
  font-size: 80%;
  font-weight: 400;
  position: absolute;
  right: 0.1rem;
  bottom: 0.1rem;
}

.textbook-footer {
  margin: 1.5rem 0 0 0;
}

@media screen and (max-width: 576px) {
  #textbook {
    line-height: 2.0rem;
    letter-spacing: 0.3px;
  }

  #textbook li{
    margin: 0.2rem 0;
  }

  #textbook h1, #textbook h2, #textbook h3, #textbook h4 {
    font-family: 'Noto Sans JP', 'IPAexGothic', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
    color: #3E3E3E;
    margin: 1.3rem 0 1.1rem 0;
  }
  #textbook p, #textbook li, #textbook td {
    font-family: 'Noto Sans JP', 'IPAexGothic', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
    color: #3E3E3E;
  }

  #textbook h1,
  .markdown_area h1 {
   font-size: 2.2rem;
  }
  #textbook h2,
  .markdown_area h2 {
   font-size: 2.0rem;
  }
  #textbook h3,
  .markdown_area h3 {
   font-size: 1.8rem;
  }
  #textbook h4,
  .markdown_area h4 {
   font-size: 1.7rem;
  }
  #textbook h5,
  .markdown_area h5 {
   font-size: 1.6rem;
  }
  #textbook h6,
  .markdown_area h6 {
   font-size: 1.5rem;
  }
  .textbook-binder{
    font-size: 1.8rem;
  }
  .textbook-header .textbook-title{
    font-size: 1.8rem;
    margin: 1.8rem 0;
  }
}

#textbook.textbook-blank :not(td):not(th) > strong:not(.notest) {
  color: transparent;
  border-bottom: 1px solid lightgray;
}

#textbook.textbook-blank :not(td):not(th) > strong.openwd:not(.notest) {
  color: var(--main-blue);
  border-bottom: 1px solid lightgray;
}

#textbook.textbook-blanktd div.testtd-all + table td,
#textbook.textbook-blanktd div.testtd-all + table td strong {
  color: transparent !important;
}

#textbook.textbook-blanktd div.testtd-all + table td.openwd,
#textbook.textbook-blanktd div.testtd-all + table td.openwd strong {
  color: var(--main-blue) !important;
}

#textbook.textbook-blanktd div.testtd-n2 + table td:nth-child(n+2),
#textbook.textbook-blanktd div.testtd-n2 + table td:nth-child(n+2) strong {
  color: transparent !important;
}

#textbook.textbook-blanktd div.testtd-n2 + table td:nth-child(n+2).openwd,
#textbook.textbook-blanktd div.testtd-n2 + table td:nth-child(n+2).openwd strong {
  color: var(--main-blue) !important;
}

/* course pjax */
.textbookFadeOut {
    -webkit-animation: fadeOut .5s cubic-bezier(.55,0,.1,1) both;
    animation: fadeOut .5s cubic-bezier(.55,0,.1,1) both;
}
.textbookFadeIn {
    -webkit-animation: fadeIn .5s cubic-bezier(.55,0,.1,1) both;
    animation: fadeIn .5s cubic-bezier(.55,0,.1,1) both;
}

@-webkit-keyframes fadeOut { to { opacity: 0; -webkit-transform: scale(1.2); }}
@keyframes fadeOut { to { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }}
@-webkit-keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(.8); }}
@keyframes fadeIn { from { opacity: 0; -webkit-transform: scale(.8); transform: scale(.8); }}


/* Search Textbook */
.form-inline-input  {
  width: auto;
}

#text_search_input {
  z-index: 1;
}

#text_search_submit {
  border: none;
  padding-right: 0;
  background-color: transparent;
}

.text_search-image {
  margin: auto -15%;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.text_search-imagetag {
  width: 100%;
  height: 100px;
  object-fit: cover;
}

.text_search-title {
  width: 80%;
  text-align: right;
  position: absolute;
  top: 5%;
  right: 10%;
  color: white;
  text-shadow: 1px 1px 3px #444;
  font-weight: 400;
}

/* flashcard */
#flashcard-courses thead th {
  background-repeat: no-repeat;
  background-position: right center;
}
#flashcard-courses thead th:hover {
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
}
#flashcard-courses thead th.up {
  /*  padding-right: 20px;*/
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
}
#flashcard-courses thead th.down {
  /*  padding-right: 20px;*/
  background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
}

/*  startup setting */
.startup-list li{
  font-size: 1.1rem;
}

.startup-list li i{
  color: lightgray;
  margin-right: 0.4rem;
}

/* dashboard */
.my-fluid-style {
  margin-top: 4rem;
  margin-bottom: 3rem;
  padding-top: 1rem;
  min-height: 6rem;
  box-shadow: 0px 10px 10px -5px rgb(0 0 0 / 20%);
  z-index: 300;
}

#dashboard-cards-scroll {
  display: block;
  overflow-x: auto;
  white-space: nowrap;
}

#d-navbar {
  background-color:  white;
}

.sticky {
  position: fixed;
  top: -160;
  width: 100%;
}

.sticky-aunt{
  padding-top: 310;
}

.dashboard-school-card {
  border-radius: 20px;
  overflow: hidden;
}

.dashbaord-school-background {
  background-color: rgba( 255, 255, 255, 0.45 );
}

.dashboard-school-detail{
  position: absolute;
  left: 3px;
  bottom: 3px;
}

.dashboard-school-link{
  position: absolute;
  right: 3px;
  bottom: 3px;
}

.dashboard-school-image {
  overflow: hidden;
  display: contents;
}

.dashboard-school-image img {
  max-height: 150px;
  object-fit: cover;
}

.delete_goal_button {
  position: absolute;
  right: 8px;
  top: 8px;
}

.dashboard-start-course {

}

.dashboard-start-course img{
  object-fit: cover;
  border-radius: 10px;
}

.dashboard-start-course label{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}

.dashboard-start-course_title label{
  color: gray;
}

.dashboard-start-course i{
  color: var(--main-blue);
  position: absolute;
  right: 15px;
  top: 0px;
}

.dashboard-start-course input[type="checkbox"]:checked + label{
  color: var(--main-blue);
  -webkit-filter: grayscale(0);
  -moz-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -o-filter: grayscale(0);
  filter: grayscale(0);
}


.dashboard-school-card label{
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}

.dashboard-school-card i.fa-star{
  color: white;
}

.dashboard-school-card_title label{
  color: gray;
}

.dashboard-school-card i.fa-check{
  display: none;
  position: absolute;
  right: 15px;
  bottom: 10px;
}

.dashboard-school-card input[type="checkbox"]:checked + label{
  -webkit-filter: grayscale(0);
  -moz-filter: grayscale(0);
  -ms-filter: grayscale(0);
  -o-filter: grayscale(0);
  filter: grayscale(0);
}

.dashboard-school-card input[type="checkbox"]:checked + label i.fa-star{
  color: #ffb448;
}

.dashboard-school-card input[type="checkbox"]:checked + label i.fa-check{
  display: block;
  color: var(--main-blue);
}

.schedule_button {
  position: absolute;
  right: 2rem;
}

.dashboard-scheduler .taskrow td:first-child a i.fa-chevron-circle-right{
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
/*  -webkit-transition: transform 0.5s ease;
  -o-transition: transform 0.5s ease;
  transition: transform 0.5s ease;*/
}

.dashboard-scheduler .taskrow td:first-child a.collapsed i.fa-chevron-circle-right {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
/*  -webkit-transition: transform 0.5s ease;
  -o-transition: transform 0.5s ease;
  transition: transform 0.5s ease;*/
}

.dashboard-scheduler .collapsing {
    -webkit-transition: none;
    transition: none;
    display: none;
}

.dashboard-scheduler tr td:nth-child(n + 2), .dashboard-scheduler tr th:nth-child(n + 2) {
  text-align: center;
}

.dashboard-scheduler .taskrow td:first-child {
  padding-left: 1.5rem;
}

.dashboard-scheduler .taskrow-learn td:first-child {
  padding-left: 3rem;
}

.dashboard-scheduler .taskrow-review td:first-child {
  padding-left: 3rem;
}

.taskrow-title {
  max-width: 21rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.taskrow a.taskrow-up {
  position: absolute;
  left: 50%;
  top: -5%;
}

.taskrow a.taskrow-down {
  position: absolute;
  left: 50%;
  bottom: -5%;
}

.goal-univs label {
  cursor: pointer;
}

.goal-univs input:checked + label {
  background: lightblue;
}

.dashboard-univtable-container {
  width: 100%;
  overflow-x: scroll; 
}

table.dashboard-univtable {
  min-width: 800px;
}

.dashboard-univtable th, .dashboard-univtable td{
  padding: 0.2rem;
}

.dashboard-univtable td p{
  margin-bottom: 0.2rem;
}

.dashboard-univtable .table-thead th{
  vertical-align: middle;
}

.dashboard-univtable tbody tr, .dashboard-univtable .table-thead tr {
  border-top: 0.5px solid lightgray;
}

.dashboard-univtable .table-thead th:not(:last-child), {
  border-right: 0.5px solid lightgray;
}

/* University */
.nav.nav-university .nav-link.active {
  color: var(--main-blue);
  border-bottom: solid 3px var(--main-blue);
  font-weight: 600;
}

.nav.nav-university .nav-link {
  color: inherit;
  border-bottom: solid 3px transparent;
}

.univ_record_table_parent table {
  border: 1px solid #dee2e6;
  width: 100%;
  margin-bottom: 1rem;
  color: #212529;
}

.univ_record_table_parent table th, 
.univ_record_table_parent table td {
  border: 1px solid #dee2e6;
  padding: 0.3rem;
}

button.univ_notice_year {
  box-shadow: none !important;
}

button.univ_notice_year[aria-expanded="false"]{
  background-color: white !important;
  color: #ee0979;
  border-color: #ee0979;
}


#progress_scatter_chart_area, #advance_scatter_chart_area, #weekly_scatter_chart_area{
  min-height: 140px;
  /*line-height: 2rem;*/
}

/* dashboard:recommend */
.dashboard-recommend-form .bootstrap-select .dropdown-toggle {
  border: solid 1px silver;
}

#dashboard-rec-table tr th:first-child {
  position: sticky;
  top: 0;
  left: 0;
  max-width: 9rem;
}

#dashboard-rec-table tr td {
  min-width: 10rem;
}

/* forum */
.nav.forum-nav-main .nav-link.active {
  color: var(--main-blue);
  border-bottom: solid 3px var(--main-blue);
  font-weight: 600;
}

.nav.forum-nav-main .nav-link {
  color: inherit;
  border-bottom: solid 3px transparent;
  padding: 3px;
}

.forum-nav-status.nav-tabs .nav-item.show .nav-link, .forum-nav-status.nav-tabs .nav-link.active  {
  background-color: inherit;
  color: var(--main-blue);
  border-bottom: solid 1px var(--main-blue);
  font-weight: 600;
}

.boards-image {
  position: absolute;
  top: 10px;
  right: 10px;
}

.forum-breadcrumb {
  margin-top: 20px;
  line-height: 2rem;
  padding: 0.25rem 0.75rem;
}

#forum_search_input {
  z-index: 1;
}

#forum_search_submit {
  border: none;
  padding-right: 0;
  background-color: transparent;
}

.forum-measurement {
  border-radius: 20px;
}

table.forum_ranking_table th, table.forum_ranking_table td{
  vertical-align: middle;
}

.topic_textarea ul, .editor-preview ul{
  list-style: disc;
  padding-left: 1.3rem;
}

.topic_textarea ol, .editor-preview ol{
  list-style: decimal;
  padding-left: 1.3rem;
}

.topic_textarea ul ul, .topic_textarea ol ul,
.editor-preview ul ul, .editor-preview ol ul{
  list-style: circle;
}

.topic_textarea ul ul ul, .topic_textarea ul ol ul, .topic_textarea ol ul ul, .topic_textarea ol ol ul,
.editor-preview ul ul ul, .editor-preview ul ol ul, .editor-preview ol ul ul, .editor-preview ol ol ul {
  list-style: square;
}

.topic_textarea ol ol, .topic_textarea ul ol,
.editor-preview ol ol, .editor-preview ul ol {
  list-style-type: lower-roman;
}

.topic_textarea ul ul ol, .topic_textarea ul ol ol, .topic_textarea ol ul ol, .topic_textarea ol ol ol,
.editor-preview ul ul ol, .editor-preview ul ol ol, .editor-preview ol ul ol, .editor-preview ol ol ol {
  list-style-type: lower-alpha;
}

.topic_textarea li, .editor-preview li{
  margin: 0.2rem 0;
}

.topic_textarea h1, .topic_textarea h2, .topic_textarea h3, .topic_textarea h4, .topic_textarea h5, .topic_textarea h6,
.editor-preview h1, .editor-preview h2, .editor-preview h3, .editor-preview h4, .editor-preview h5, .editor-preview h6 {
  font-weight: 600;
  color: #3E3E3E;
  margin: 1.3rem 0 1.1rem 0;
}

.topic_textarea p, .topic_textarea li, .topic_textarea td,
.editor-preview p, .editor-preview li, .editor-preview td {
  color: #3E3E3E;
}

.topic_textarea img, .editor-preview img {
  max-width: 100%;
}

.topic_textarea img[alt="w10"], .editor-preview img[alt="w10"] {
  width: 10%;
}

.topic_textarea img[alt="w20"], .editor-preview img[alt="w20"] {
  width: 20%;
}

.topic_textarea img[alt="w30"], .editor-preview img[alt="w30"] {
  width: 30%;
}

.topic_textarea img[alt="w40"], .editor-preview img[alt="w40"] {
  width: 40%;
}

.topic_textarea img[alt="w50"], .editor-preview img[alt="w50"] {
  width: 50%;
}

.topic_textarea img[alt="w60"], .editor-preview img[alt="w60"] {
  width: 60%;
}

.topic_textarea img[alt="w70"], .editor-preview img[alt="w70"] {
  width: 70%;
}

.topic_textarea img[alt="w80"], .editor-preview img[alt="w80"] {
  width: 80%;
}

.topic_textarea img[alt="w90"], .editor-preview img[alt="w90"] {
  width: 90%;
}

.topic_textarea img[alt="w100"], .editor-preview img[alt="w100"] {
  width: 100%;
}

.topic_textarea blockquote, .editor-preview blockquote {
  padding: 0 1em;
  color: #6a737d;
  border-left: 0.25em solid #dfe2e5;
  margin: 0.5rem 0;
}

.topic_textarea table {
  display: block;
  width: 100%;
  overflow: auto;
  border-spacing: 0;
  border-collapse: collapse;
}

.topic_textarea table th {
  font-weight: 600;
}

.topic_textarea table th,
.topic_textarea table td {
  padding: 6px 13px;
  border: 1px solid #dfe2e5;
}

.topic_textarea table tr {
  background-color: #fff;
  border-top: 1px solid #c6cbd1;
}

.topic_textarea table tr:nth-child(2n) {
  background-color: #f6f8fa;
}

.forum_post_image-preview {
  max-height: 5rem;
  max-width: 5rem;
}

.past_exam_tag {
  color: lightseagreen;
  line-height: 1.0rem;
  border: lightseagreen 0.5px solid;
  margin: 0.25rem;
}

.past_exam_tag:hover {
  color: lightseagreen;
}

.lecture_tag {
  color: var(--sub-pink);
  line-height: 1.0rem;
  border: var(--sub-pink) 0.5px solid;
  margin: 0.25rem;
}

.lecture_tag:hover {
  color: var(--sub-pink);
}

.question_tag {
  color: var(--sub-blue);
  line-height: 1.0rem;
  border: var(--sub-blue) 0.5px solid;
  margin: 0.25rem;
}

.question_tag:hover {
  color: var(--sub-blue);
}

.step_tag {
  color: gray;
  line-height: 1.0rem;
  border: gray 0.5px solid;
  margin: 0.25rem;
}

.step_tag:hover {
  color: gray;
}

#tags_select_form input[type=checkbox] {
    display: none;
}

#tags_select_form input:checked + label .question_tag {
  background: var(--sub-blue);
  color: white;
}

#tags_select_form input:checked + label .past_exam_tag {
  background: lightseagreen;
  color: white;
}

#tags_select_form input:checked + label .lecture_tag {
  background: var(--sub-pink);
  color: white;
}

#tags_select_form input:checked + label .step_tag {
  background: gray;
  color: white;
}

.forum-lineclamp2 {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.staff_badge {
  color: var(--main-blue);
}

.forum-card_footer {
  position: absolute;
  right: 20px;
  bottom: 5px;
}

/* Capability Test */
#sense_test_form .asteriskField, #think_test_form .asteriskField{
  display: none;
}

#sense_test_form .form-check {
  display: inline;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-touch-callout:none;
}

#sense_test_form label {
  padding: 0.5rem;
}

#sense_test_form input[type=radio] {   
  display: none;    
}

#sense_test_form input[type=radio] + label {
  text-align: center;
  min-width: 5rem;
  border-radius: 20px;
  border: lightgray 1px solid;
  cursor: pointer;
}

@media (max-width: 575.98px) {
  #sense_test_form input[type=radio] + label {
    width: calc(50% - 3rem);
  }
}

#sense_test_form input[type=radio]:checked + label {
  background: lightblue;
  border: var(--sub-blue) 1px solid;
}

#think_test_form .think_choices {
  margin-top: 10px;
  margin-bottom: 40px;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-touch-callout:none;
}

#think_test_form .think_choices .form-check {
  padding-left: 0;
}

#think_test_form .think_choices input[type=checkbox] {   
  display: none;    
}

#think_test_form .think_choices label {
  width: 100%;
  border-radius: 20px;
  border: lightgray 1px solid;
  padding: 0.5rem 0.5rem 0.5rem 1.25rem;
}

#think_test_form .think_choices input:checked + label {
  /*background: lightblue;*/
  color: var(--sub-blue);
  border: var(--sub-blue) 2px solid;
}

#think_test_form .think_question img {
  vertical-align: top;
}

/* General */
.bg-primary {
  background-color: #ee0979 !important;
}

.bg-silver {
  background-color: silver !important;
}

.btn-primary {
  background-color: #ee0979;
  border-color: #ee0979;
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
  background-color: #bd0760 !important;
  border-color: #bd0760 !important;
}

.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(238, 9, 121, 0.5);
}

.btn-primary[disabled] {
  background-color: #ee0979;
  border-color: #ee0979;
}

.btn-outline-primary {
  color: #ee0979;
  border-color: #ee0979;
}

.btn-outline-primary:active, .btn-outline-primary:focus, .btn-outline-primary:hover {
  background-color: #ee0979 !important;
  border-color: #ee0979 !important;
  color: white;
}

.btn-outline-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(238, 9, 121, 0.5);
}

.btn-silver {
  color: white;
  background-color: silver;
  border-color: silver;
}

.btn-silver:active, .btn-silver:focus, .btn-silver:hover {
  color: white !important;
  background-color: darkgray !important;
  border-color: darkgray !important;
}

.btn-outline-silver {
  border-color: silver;
}

.btn-outline-silver:active, .btn-outline-silver:focus, .btn-outline-silver:hover {
  background-color: silver !important;
  border-color: silver !important;
  color: white;
}

.btn-info {
  color: #fff;
  background-color: #17a2b8;
  border-color: #17a2b8;
}

.btn-info:hover {
  color: #fff;
  background-color: #138496;
  border-color: #117a8b;
}

.btn-info:not(:disabled):not(.disabled).active, .btn-info:not(:disabled):not(.disabled):active, .show>.btn-info.dropdown-toggle {
  color: #fff;
  background-color: #117a8b;
  border-color: #10707f;
}

.btn-outline-info {
  color: #17a2b8;
  border-color: #17a2b8;
}

#course_taking_form .bootstrap-select .dropdown-toggle, .forum-order-form .bootstrap-select .dropdown-toggle {
  border: solid 1px silver;
}

/*
.btn-secondary {
  background-color: #ff6a00;
  border-color: #ff6a00;
}

.btn-secondary:active, .btn-secondary:focus, .btn-secondary:hover {
  background-color: #cc5500 !important;
  border-color: #cc5500 !important;
}

.btn-secondary:focus {
  box-shadow: 0 0 0 0.2rem rgba(255, 106, 0, 0.5);
}
*/

.timer-sticky-top {
  position: -webkit-sticky;
  position: sticky;
  top: 6rem;
  z-index: 100;
}

@media (max-width: 992px) {
  .timer-sticky-top {
    position: fixed;
    min-width: 9rem;
    top: 6rem;
    right: 2rem;
  }
}

footer {
    margin-top: auto;
}

.my-div-style {
	margin-top:6rem;
}