/* 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; } }
[id^="technology"] .ttlBox {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #0097EA; }
  [id^="technology"] .ttlBox .ico {
    margin-bottom: 1rem; }
  [id^="technology"] .ttlBox .ttl {
    font-size: 3.8rem; }
    @media (max-width: 999px) {
      [id^="technology"] .ttlBox .ttl {
        font-size: 2.4rem; } }

/* 
---------------------------------------
technology01
---------------------------------------
*/
#technology01 .txt {
  text-align: center;
  width: 90%;
  margin: 0 auto; }
  @media (max-width: 999px) {
    #technology01 .txt {
      text-align: left; } }

/* 
---------------------------------------
technology02
---------------------------------------
*/
@media (max-width: 999px) {
  #technology03,
  #technology02 {
    width: 100%; } }
#technology03 .boxs,
#technology02 .boxs {
  margin-top: -10rem;
  background: #fff;
  position: relative;
  z-index: 1;
  padding: 10rem 0 0; }
  @media (max-width: 999px) {
    #technology03 .boxs,
    #technology02 .boxs {
      margin-top: -4rem;
      padding: 4rem 0 0; } }
#technology03 .txt,
#technology02 .txt {
  text-align: center;
  width: 90%;
  margin: 0 auto 4rem; }
  @media (max-width: 999px) {
    #technology03 .txt,
    #technology02 .txt {
      margin: 0 auto 3rem;
      text-align: left; } }
#technology03 .listBox,
#technology02 .listBox {
  background: #F5F8FA;
  padding: 8rem 0; }
  @media (max-width: 999px) {
    #technology03 .listBox,
    #technology02 .listBox {
      padding: 3rem 0;
      width: 100%; } }
#technology03 .inner8,
#technology02 .inner8 {
  display: flex;
  align-items: flex-start;
  justify-content: center; }
  @media (max-width: 999px) {
    #technology03 .inner8,
    #technology02 .inner8 {
      flex-direction: column; } }
@media (max-width: 999px) {
  #technology03 .sttlBox,
  #technology02 .sttlBox {
    margin: 0 auto 2rem;
    text-align: center; } }
#technology03 .sttlDeco,
#technology02 .sttlDeco {
  font-size: 1.6rem;
  color: #0097EA;
  line-height: 1.5; }
  @media (max-width: 999px) {
    #technology03 .sttlDeco,
    #technology02 .sttlDeco {
      font-size: 16px;
      text-align: center; } }
#technology03 .sttl,
#technology02 .sttl {
  font-size: 3.2rem;
  color: #0097EA; }
  @media (max-width: 999px) {
    #technology03 .sttl,
    #technology02 .sttl {
      text-align: center;
      font-size: 2.2rem; } }
#technology03 ul,
#technology02 ul {
  margin-left: calc(120 / 772.82 * 100%);
  width: calc(565.82 / 772.82 * 100%); }
  @media (max-width: 999px) {
    #technology03 ul,
    #technology02 ul {
      margin-left: 0;
      width: 100%; } }
#technology03 li,
#technology02 li {
  font-size: 2rem;
  margin-bottom: 1.4rem;
  font-weight: 700;
  text-indent: -1.6rem;
  padding-left: 3.6rem;
  line-height: 1.7; }
  @media (max-width: 999px) {
    #technology03 li,
    #technology02 li {
      font-size: 1.4rem;
      text-align: justify; } }
  #technology03 li i,
  #technology02 li i {
    color: #0097EA;
    font-size: 1.6rem;
    margin-right: 1rem; }
@media (max-width: 999px) {
  #technology03 .ttlBox,
  #technology02 .ttlBox {
    margin-bottom: 2rem; } }

/* 
---------------------------------------
technology04
---------------------------------------
*/
#technology04 {
  padding: 16rem 0 6rem;
  background: linear-gradient(to bottom, #D4EBFB, transparent); }
  @media (max-width: 999px) {
    #technology04 {
      padding: 6rem 0 4rem; } }
  #technology04 .txt {
    margin-bottom: 6rem;
    text-align: center; }
    @media (max-width: 999px) {
      #technology04 .txt {
        margin: 0 auto 3rem;
        text-align: left; } }
  #technology04 .sttlBox {
    display: flex;
    padding: 4rem;
    background: #fff;
    justify-content: space-between; }
    @media (max-width: 999px) {
      #technology04 .sttlBox {
        flex-direction: column; } }
  #technology04 .sttl {
    color: #0097EA;
    width: calc(371.5/1320*100%);
    display: flex;
    align-items: center;
    border-right: 1px solid #0097EA; }
    @media (max-width: 999px) {
      #technology04 .sttl {
        width: 100%;
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        border-bottom: 1px solid;
        border-right: none; } }
  #technology04 .stxt {
    width: calc(830/1320*100%); }
    @media (max-width: 999px) {
      #technology04 .stxt {
        width: 100%; } }

/* 
---------------------------------------
technology05
---------------------------------------
*/
#technology05 .pics {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 10rem; }
  @media (max-width: 999px) {
    #technology05 .pics {
      gap: 3rem; } }
#technology05 .pic {
  width: 45%; }
  @media (max-width: 999px) {
    #technology05 .pic {
      width: 100%; } }
#technology05 .deco {
  font-size: 11rem;
  text-align: center;
  color: rgba(0, 151, 234, 0.1);
  position: absolute;
  top: -13rem;
  z-index: -1;
  right: 0;
  left: 0; }
  @media (max-width: 999px) {
    #technology05 .deco {
      font-size: 3.2rem;
      top: -4rem; } }

/* 
---------------------------------------
technology06
---------------------------------------
*/
#technology06 {
  background: #F7F7F7;
  padding: 16rem 0; }
  @media (max-width: 999px) {
    #technology06 {
      padding: 6rem 0; } }
  #technology06 .btn {
    margin: 3rem auto; }
  #technology06 .acdns {
    background: #fff;
    padding: 10rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1); }
    @media (max-width: 999px) {
      #technology06 .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; }