@import url("https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c:400,700");

body {
  color: #4D5052;
  line-height: 1.8;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: 0.7px
}

hr {
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  -webkit-margin-start: 0;
  margin-inline-start: 0;
  -webkit-margin-end: 0;
  margin-inline-end: 0;
}

ul {
  -webkit-margin-after: 0;
  margin-block-end: 0;
  -webkit-margin-before: 0;
  margin-block-start: 0;
  -webkit-padding-start: 0;
  padding-inline-start: 0;
}

p {
  margin-bottom: 0
}

.card-body {
  padding: 0;
}

.no-decoration a {
  text-decoration: none !important;
}

a:hover p,a:hover div {
  color: #21ADDC;
}

a:hover {
  color: #21ADDC;
}

a:hover .yellow-link {
  color: #f6ab00;
}

pre {
  color: #4D5052;
}

.container {
  width: 100%;
}

.btn {
  font-family: "Helvetica Now Display", sans-serif;
  width: 12.5rem;
  height: 3rem;
}

.btn-square {
  display: inline-block;
  padding: 0.5em 1em;
  border-radius: 5px;
  border-bottom: solid 4px;
}

.btn-keyvisual:hover {
  background-color: #f6ab00 !important;
  border-color: #FFF;
}

.btn-yellow-squre {
  background-color: #F6AB00;
  color: #FFF;
  border-bottom-color: #C28800;
}

.btn-yellow-squre:hover {
  background-color: #DB9A00;
}

.btn-yellow-squre:active {
  background-color: #C28800;
}

.btn-yellow {
  background-color: #F6AB00;
}

.btn-yellow:hover {
  background-color: #C28800;
}

.btn-light-blue {
  background-color: #21ADDC;
}

.btn-light-blue:hover {
  background-color: #1985A8;
}

.border-color-orange {
  border-bottom-color: #F58300 !important;
}

.border-color-light-blue {
  border-bottom-color: #21ADDC !important;
}

.bg-glay {
  background-color: #ACB4B7 !important;
}

.bg-light-glay {
  background-color: #F8F8F7 !important;
}

.bg-dark-black {
  background-color: #4D5052 !important;
}

.bg-soft-yellow {
  background-color: #FFF7E6 !important;
}

.bg-light-soft-yellow {
  background-color: #FFFBF2 !important;
}

.bg-hard-soft-yellow {
  background-color: #FEF3D9 !important;
}

.bg-yellow {
  background-color: #f6ab00 !important;
}

.bg-light-blue {
  background-color: #21ADDC !important;
}

.text-glay {
  color: #ACB4B7 !important;
}

.text-dark-glay {
  color: #4D5052 !important;
}

.text-light-blue {
  color: #21ADDC !important;
}

.text-yellow {
  color: #f6ab00 !important;
}

.w-200px {
  width: 14.64128vw !important;
}

.w-90 {
  width: 90% !important;
}

a {
  color: #4D4D4D;
}

.top-10 {
  top: 10% !important;
}

.top-30 {
  top: 30% !important;
}

@media (min-width: 768px) {
  .top-30-pc {
    top: 30% !important;
  }
}

.font-size-12 {
  font-size: 12px !important;
}

.font-size-13 {
  font-size: 13px !important;
}

.font-size-14 {
  font-size: 14px !important;
}

.font-size-16 {
  font-size: 16px !important;
}

.font-size-19 {
  font-size: 19px !important;
}

.font-size-20 {
  font-size: 20px !important;
}

.font-size-24 {
  font-size: 24px !important;
}

.font-size-26 {
  font-size: 26px !important;
}

.font-size-32 {
  font-size: 32px !important;
}

.card-text {
  font-size: .875rem;
}

.padding-left-0 {
  padding-left: 0 !important;
}

.list-group-item {
  border: 0;
}

.link {
  color: #21ADDC !important;
}

.link:hover {
  color: #21ADDC !important;
}

.border-clear {
  border: 0 !important;
  background-color: rgba(0,0,0,0) !important;
}

.clear-line-height {
  line-height: 1.4 !important;
}

.line-height-16 {
  line-height: 16px !important;
}

.line-height-30 {
  line-height: 30px !important;
}

@media (min-width: 768px) {
  .w-sm-50 {
    width: 50% !important;
  }
}

@media (max-width: 768px) {
  .text-mb-center {
    text-align: center !important;
  }
}

@media (min-width: 768px) {
  .md-margin-left-9vw {
    margin-left: 9vw;
  }
}

@media (min-width: 768px) {
  .position-md-absolute {
    position: absolute;
  }
}

@media (min-width: 768px) {
  .text-md-nowrap {
    white-space: nowrap !important;
  }
}

@media (max-width: 768px) {
  .w-sp-100 {
    width: 100% !important;
  }
}

@media (max-width: 768px) {
  .flex-sp-fill {
    flex: 1 1 auto !important;
  }
}

@media (min-width: 768px) {
  .icon {
    margin-right: 8px;
  }
}

@media (max-width: 768px) {
  .icon {
    margin-right: 10px;
  }
}

@media (max-width: 768px) {
  .text-sp-center {
    text-align: center !important;
  }
}

.mt-16px {
  margin-top: 16px !important;
}

.mt-24px {
  margin-top: 24px !important;
}

@media (max-width: 768px) {
  .mt-sp-24px {
    margin-top: 24px !important;
  }
}

.clear-padding {
  padding: 0 !important;
}

@media (max-width: 768px) {
  .mx-sp-auto {
    margin-left: auto !important;
    margin-right:auto !important;
  }
}

div.modal-content img {
  max-width: 100%;
  margin-right: 5px;
}

div.modal-content img:last-of-type {
  margin-right: 0;
}