/* Scss Document */
:root {
  --pc: 1000px;
  --sp: 999px;
  --fs48: 4.8rem;
  --fs40: 4rem;
  --fs36: 3.6rem;
  --fs28: 2.8rem;
  --fs22: 2.2rem;
  --fs20: 2.0rem;
  --fs18: 1.8rem;
  --fs16: 1.6rem;
  --fs14:1.4rem;
  --fs12:1.2rem; }

@media (max-width: 999px) {
  :root {
    --fs48: 2.6rem;
    --fs40: 2.2rem;
    --fs36: 2.4rem;
    --fs28: 2.2rem;
    --fs22: 2.0rem;
    --fs20: 1.8rem;
    --fs18: 1.4rem;
    --fs16: 1.4rem;
    --fs14: 1.2rem;
    --fs12: 1.0rem; } }
/* 
---------------------------------------
about01
---------------------------------------
*/
#about01 .bgBox {
  height: auto;
  background-image: url("../img/about/01_bg.jpg");
  background-size: cover;
  height: 73vw;
  max-height: 100rem;
  text-align: center; }
  @media (max-width: 999px) {
    #about01 .bgBox {
      height: auto;
      max-height: max-content;
      text-align: left; } }
  #about01 .bgBox .ttlBox {
    padding-top: 12rem; }
    @media (max-width: 999px) {
      #about01 .bgBox .ttlBox {
        padding-top: 4rem;
        width: 90%;
        margin: 0 auto;
        padding-bottom: 16rem; } }
  #about01 .bgBox .ico {
    width: 40rem;
    height: auto;
    margin: 0 auto; }
    @media (max-width: 999px) {
      #about01 .bgBox .ico {
        width: 80%; } }
  #about01 .bgBox .ico2 {
    width: 90rem;
    height: auto;
    margin: 0 auto; }
    @media (max-width: 999px) {
      #about01 .bgBox .ico2 {
        width: 90%; } }
#about01 .content {
  padding: 16rem 0;
  background: linear-gradient(to bottom, #01D1FB, #0650E8);
  position: relative;
  z-index: 1; }
  @media (max-width: 999px) {
    #about01 .content {
      padding: 16rem 0 2rem; } }
  #about01 .content .ttlDeco {
    font-size: 2.6rem;
    line-height: 1.5; }
    @media (max-width: 999px) {
      #about01 .content .ttlDeco {
        font-size: 2rem; } }
  #about01 .content .ttl {
    font-size: 3.6rem;
    color: #0097EA;
    line-height: 1.5; }
    @media (max-width: 999px) {
      #about01 .content .ttl {
        font-size: 2.4rem;
        margin-bottom: 1rem; } }
  #about01 .content .txt {
    width: calc(740/1400*100%); }
    @media (max-width: 999px) {
      #about01 .content .txt {
        width: 100%; } }
#about01 .boxs {
  margin-top: -30rem; }
#about01 .box {
  background: #fff;
  padding: 8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem; }
  @media (max-width: 999px) {
    #about01 .box {
      padding: 2rem;
      flex-direction: column;
      align-items: flex-start; } }

#about02 .ttlBox,
#about04 .ttlBox {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column; }
  #about02 .ttlBox .ico,
  #about04 .ttlBox .ico {
    margin-bottom: 1rem; }
  #about02 .ttlBox .ttl,
  #about04 .ttlBox .ttl {
    font-size: 3.8rem;
    color: #0097EA; }
    @media (max-width: 999px) {
      #about02 .ttlBox .ttl,
      #about04 .ttlBox .ttl {
        font-size: 2.4rem; } }

#about02 .box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12rem; }
  @media (max-width: 999px) {
    #about02 .box {
      flex-direction: column;
      margin-bottom: 5rem; } }
#about02 .sttlBox {
  width: calc(710/1400*100%); }
  @media (max-width: 999px) {
    #about02 .sttlBox {
      width: 100%; } }
#about02 .pic {
  width: calc(590/1400*100%); }
  @media (max-width: 999px) {
    #about02 .pic {
      width: 100%; } }
#about02 .sttl {
  font-size: 3.2rem;
  color: #0097EA;
  margin-bottom: 1rem; }
  @media (max-width: 999px) {
    #about02 .sttl {
      font-size: 2.2rem;
      margin-bottom: 0.5rem; } }
#about02 .stxt {
  margin-bottom: 1rem; }
  @media (max-width: 999px) {
    #about02 .stxt {
      margin-bottom: 0.5rem; } }
#about02 .sstxt {
  padding: 2rem;
  background: #F7F7F7; }
  @media (max-width: 999px) {
    #about02 .sstxt {
      padding: 1rem;
      margin-bottom: 2rem; } }

#about03 {
  position: relative; }
  #about03 .ttlBox {
    position: absolute;
    top: 50%;
    left: 5%;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    z-index: 1; }
    @media (max-width: 999px) {
      #about03 .ttlBox {
        position: absolute;
        top: 50%;
        left: 5%;
        width: 90%; } }
  #about03 .ttlDeco {
    font-size: 8.6rem;
    color: #fff;
    line-height: 1.25;
    margin-bottom: 2rem; }
    @media (max-width: 999px) {
      #about03 .ttlDeco {
        font-size: 28px;
        margin-bottom: 0.5rem; } }
  #about03 .ttl {
    font-size: 2rem;
    margin-bottom: 6rem;
    color: #fff; }
    @media (max-width: 999px) {
      #about03 .ttl {
        font-size: 14px;
        margin-bottom: 0; } }
  #about03 .deco {
    position: absolute;
    top: -9rem;
    left: calc(100 / 1400 * -100%);
    z-index: -1;
    width: calc(496 / 1400 * 100%); }
    @media (max-width: 999px) {
      #about03 .deco {
        top: -3rem;
        left: -4rem; } }
  @media (max-width: 999px) {
    #about03 .btn {
      margin: 0 0 0 auto; } }
  #about03 .bg {
    position: relative;
    z-index: -1; }

/* 
---------------------------------------
about04
---------------------------------------
*/
#about04 {
  background: #F7F7F7;
  padding: 16rem 0; }
  @media (max-width: 999px) {
    #about04 {
      padding: 6rem 0; } }
  #about04 .btn {
    margin: 3rem auto; }
  #about04 .acdns {
    background: #fff;
    padding: 10rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); }
    @media (max-width: 999px) {
      #about04 .acdns {
        padding: 4rem; } }

.acdns .acdn {
  border-bottom: 2px solid #F0F0F0; }
.acdns .acdn-q {
  padding: 3rem 0;
  border-top: 2px solid #F0F0F0;
  color: #0C70B4;
  display: flex;
  align-items: center;
  transition: 0.3s all; }
  @media (max-width: 999px) {
    .acdns .acdn-q {
      padding: 2rem 0; } }
  .acdns .acdn-q:hover {
    cursor: pointer;
    color: #0097EA;
    transition: 0.3s all; }
  .acdns .acdn-q span {
    font-size: 3rem;
    margin-right: 1rem;
    line-height: 1.25; }
.acdns .acdn-a {
  display: flex; }
  .acdns .acdn-a .data {
    display: flex;
    align-items: center;
    margin-bottom: 3rem; }
  .acdns .acdn-a span {
    font-size: 3rem;
    margin-right: 1rem;
    line-height: 1.25; }
.acdns .qTxt {
  margin-right: 1rem; }
.acdns .icons {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 3.6rem;
  height: 3.6rem;
  background: #0097EA;
  border-radius: 999px;
  margin: 0 0 0 auto; }
  @media (max-width: 999px) {
    .acdns .icons {
      min-width: 3rem;
      height: 3rem; } }
  .acdns .icons i {
    position: absolute;
    color: #fff; }
.acdns .open .fa-plus {
  display: none; }