@charset "utf-8";
/**
 *
 *  ページ用CSS
 *　glossary
 */
/*--------------------------------------------------------------------------
   Overwright
---------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/
/* sec-business
-----------------------------------------------------------------*/
.sec-glossary {
  padding: 95px 0 150px;
}
.sec-glossary .menu ul {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  justify-content: flex-start;
}
.sec-glossary .menu li {
  font-weight: bold;
  width: 29%;
  margin: 0 2.5% 4%;
  border-bottom: 1px solid #36a8c7;
}

.sec-glossary .menu li:first-child,.sec-glossary .menu li:nth-child(4) {
	margin-left: 0;
}


.sec-glossary .menu li a{
	display: block;
	line-height: 1.65;
}

.sec-glossary .menu li .en {
  display: block;
  font-size: 1.6rem;
  letter-spacing: .06em;
  color: #36a8c7;
	
}
.sec-glossary .menu li .ja {
  display: block;
  margin-bottom: 20px;
  font-size: 2.8rem;
  letter-spacing: .06em;
}

.sec-glossary .has-gradient-arw::before {
  position: absolute;
  right: 45px;
  top: 63%;
}
.has-gradient-arw::after {
  position: absolute;
  right: 45px;
  top: 63%;	
}
.has-gradient-arw:hover::after {
  padding-left: 3px;
}
.accordion__title {
  display: none;
}
.anchor-nav ul {
  display: -webkit-box;
  display: flex;
  flex-wrap: wrap;
}
.anchor-nav ul li {
  padding: 0 2.5% 0 4.3%;
  border-right: 1px solid #333;
  border-left: 1px solid #333;
  font-weight: bold;
  margin-bottom: 1%;
  margin-left: -1px;
}

.anchor-nav ul li a {
  position: relative;
　background: rgba(224,176,176,1.00);
　display: block;
}
.anchor-nav ul li a:before {
  content: "";
  background: url("../img/glosssary/arrow.png");
  width: 20px;
  height: 20px;
  display: block;
  position: absolute;
  left: -25px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.glossary-contents-box {
  padding: 50px 4% 55px;
  background: #fff;
  margin: 50px auto;
}
.glossary-contents-item {
  margin-bottom: 40px;
}

.glossary-contents-item ol{
	margin-left: 2rem;
}

.glossary-contents-item ol li{
  list-style-type: decimal;
　list-style-position: inside;
}

.glossary-contents-item h3 {
  margin-bottom: 10px;
  color: #0093c4;
  font-size: 2.4rem;
}
.glossary-contents-item h3 {
  margin-bottom: 10px;
  color: #0093c4;
  font-size: 2.4rem;
}
.glossary-contents-item h3::after {
  content: "";
  width: 30px;
  height: 1px;
  display: block;
  background: #000;
  margin: 10px 0;
}
.caption {
  padding: 100px 20px 50px;
}
.sec-glossary .sec-hd {
  margin-bottom: 65px;
}
.sec-glossary .sec-hd h2 {
  margin-bottom: 15px;
}
@media screen and (max-width: 1000px) {
  .sec-glossary .menu li {
    width: 44%;
    margin: 2% 3%;
  }
  .sec-glossary .menu li .en {
    display: block;
    font-size: 1.2rem;
    letter-spacing: .06em;
    color: #36a8c7;
  }
  .sec-glossary .menu li .ja {
    display: block;
    margin-bottom: 10px;
    font-size: 2.5rem;
    letter-spacing: .06em;
  }
  .anchor-nav ul li {
    padding: 0 5% 0 7%;
    border-right: 1px solid #333;
    border-left: 1px solid #333;
    font-weight: bold;
    margin-left: -1px;
    font-size: 1.4rem;
  }
  .anchor-nav ul li a:before {
    content: "";
    background: url("../img/glosssary/arrow.png");
    background-size: contain;
    width: 15px;
    height: 15px;
    display: block;
    position: absolute;
    left: -20px;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  .caption {
    padding: 50px 20px;
    font-size: 1.4rem;
  }
}
/*--------------------------------------------------------------------------
   mobile
---------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  /* sec-business
-----------------------------------------------------------------*/
  .sec-glossary {
    padding: 60px 0;
  }
	
.glossary-contents-box {
  padding: 50px 20px 55px;
  background: #fff;
  margin: 50px auto;
}	
	
  .sec-glossary .menu li {
    width: 98%;
    margin: 2% 2%;
  }
  .anchor-nav {
    background: #fff;
  }
  .accordion__title {
    font-size: 2.0rem;
    display: block;
  }
  .anchor-nav ul li {
    margin-bottom: 3%;
    padding: 0 5% 0 10%;
  }
  .glossary-contents-item {
    margin-bottom: 25px;
  }
  .glossary-contents-item h3 {
    margin-bottom: 10px;
    font-size: 1.8rem;
  }
  .sec-glossary .sec-hd {
    margin-bottom: 30px;
  }
  /* アコーディオン全体 */
  .accordion {
    max-width: 100%;
    margin: 0 auto;
  }
  /* アコーディオン */
  .accordion__item {
    border: 1px solid #ccc;
    margin-top: 10px;
    cursor: pointer;
    position: relative;
  }
  /* アコーディオンのタイトル */
  .accordion__title {
    position: relative;
    padding: 15px 60px 15px 70px;
    font-weight: bold;
    cursor: pointer;
  }
  /* (+)アイコン */
  .accordion__title span::before, .accordion__title span::after {
    content: "";
    position: absolute;
    left: 10px;
    top: 0;
    bottom: 0;
    margin: auto 0;
    background: #fff;
    width: 20px;
    height: 2px;
    transition: all 0.3s;
    display: block;
  }
  .accordion__title span::after {
    transform: rotate(90deg);
    display: block;
  }
  .accordion__title span {
    background: rgb(61, 184, 166);
    background: linear-gradient(61deg, rgba(61, 184, 166, 1) 0%, rgba(0, 147, 196, 1) 100%);
    width: 40px;
    height: 40px;
    border-radius: 40px;
    display: block;
    content: "";
    position: absolute;
    top: 20%;
    left: 3%;
  }
  /* アコーディオンのコンテンツ */
  .accordion__content {
    padding: 0 20px 15px 20px;
    display: none;
    cursor: pointer;
  }
  .accordion__content.is-open {
    display: block;
  }
  /* アコーディオン展開時の(-)アイコン */
  .accordion__item.is-active .accordion__title span::before {
    transform: rotate(180deg);
  }
  .accordion__item.is-active .accordion__title span::after {
    transform: rotate(180deg);
    opacity: 0;
  }
}


/* グラデーション丸矢印 */
.float-button__wrap a{
  position: relative;
}
.float-button__wrap a::before{
  position:absolute;
  right: 0;
  top: 50%;
  transform: translate(100%,-50%);
  display: block;
  content: "";
  width: 47px;
  height: 47px;
  border-radius: 30px;
  background: linear-gradient(60deg, rgba(61,184,166,1) 0%, rgba(0,147,196,1) 100%);   
}
.float-button__wrap a::after{
  position:absolute;
  right: 0;
  top: 50%;
  transform: translate(100%,-50%);
  display: block;
  content: "↑";
  width: 47px;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 300;
  color: #fff;
  font-family: 'Open Sans', sans-serif;
  transition: .3s;
    
}

.float-button__wrap:hover a::after{
 margin-top: -3px;
}