body {
  font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
  padding-top: 55px;
	background-color: #e2e1e1;
}

.container-background {
	background-color: rgb(255, 255, 255);
}

.navbar {
  z-index: 5;
}

.accordion-button {
  font-size: 0.9rem;
}

.nav-link:hover,
.nav-link:focus {
  color: rgba(0, 0, 0, .85);
  background-color: #ebebeb;
}

.nav-link {
  font-size: .9rem;
}

.nav-link:hover,
.nav-link:focus {
  color: rgba(0, 0, 0, .85);
  background-color: #e8f1ff;
}

.active {
  background-color: #dae9ff;
}

.navbar-preview{
	border-bottom: 3px solid #C00017;
}

.navbar-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(192,0,23,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
  border-color: rgb(192,0,23);
}


.fw-500 {
	font-weight: 500;
}

.fw-700 {
	font-weight: 700;
}

.herobox {
    padding-left: 0px;
    padding-right: 0px;
}

h3 {
	font-size: 22px;
	font-weight:500;
}

h4 {
  padding: 0.25em 0.25em;/*上下 左右の余白*/
  color: #C00017;/*文字色*/
  font-size: 18px;
  font-weight:700;
  background: transparent;/*背景透明に*/
  border-left: solid 10px #C00017;/*左線*/
}

h4.okaeri {
  border-left: solid 10px #ed8478;
  color: #ed8478;
}

h4.chat {
  border-left: solid 10px #C00017;
  color: #C00017;
}

.text-okaeri {
  color: #ed8478;
}

.text-chat {
  color: #C00017;
}

h4.tadaima {
  border-left: solid 10px #7db2c2;
  color: #7db2c2;
}

.text-tadaima {
  color: #7db2c2;
}

h5 {
	font-size: 16px;
	font-weight:500;
}

.footer {
  background-color: #231815;
}

footer {
	font-weight: 300;
	font-size: 14px;
}

.margin-top10 {
    margin-top: 10px;
}

.margin-top20 {
    margin-top: 20px;
}

.margin-top30 {
    margin-top: 30px;
}

.margin-top40 {
    margin-top: 40px;
}

.margin-top50 {
    margin-top: 50px;
}

.margin-bottom50 {
    margin-bottom: 50px;
}

.margin-bottom20 {
    margin-bottom: 20px;
}

.padding10 {
    padding-left: 10%;
    padding-right: 10%;
}

.padding5 {
    padding-left: 5%;
    padding-right: 5%;
}

.text-black {
  color: #000000;
}

.text-red {
    color: #C00017;
}

.text-green {
    color: #13ae67;
}

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

.balloon1 {
    position: relative;
    display: inline-block;
    margin: 1.5em 0;
    padding: 7px 10px;
    min-width: 100%;
    max-width: 100%;
    color: white;
    font-size: 16px;
    font-weight: 500;
    background-color: #AAAAAA;
    border-radius: 4px;
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #AAAAAA;
}

.balloon1 p {
  margin: 0;
  padding: 0;
}

.balloon2 {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  background: #FFF;
  border: solid 3px #C00017;
  box-sizing: border-box;
  border-radius: 10px;
}

.balloon2:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.balloon2:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #C00017;
  z-index: 1;
}

.balloon2 p {
  margin: 0;
  padding: 0;
}.col-background {
    background-color: #e7e7e7;
}
.margin-side {
    margin-left: 10%;
    margin-right: 10%;
}
.padding0 {
    padding-left: 0%;
    padding-right: 0%;
}
.padding-logo {
    padding-bottom: 6px;
}


/*■■■■■ トップへ戻る ■■■■■*/
#page_top{
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    bottom: 20px;
    background: #C00017;
    opacity: 0.6;
    border-radius: 50%;
  }
  #page_top a{
    position: relative;
    display: block;
    width: 50px;
    height: 50px;
    text-decoration: none;
    text-align: center;
  }
  #page_top a::before{
    font-family: "Font Awesome 5 Free";
    content: '\f106';
    font-weight: 900;
    font-size: 25px;
    color: #fff;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0px;
    bottom: 15px;
    right: 0;
    left: 0;
    margin: auto;
  }
  
