@charset "UTF-8";


/*--------------------------------
# システム開発プロセス
--------------------------------*/
.p-about__process {
    background-color: #EFF6FF;
    position: relative;
    z-index: 1;
}
.p-about__process .l-title {
}
.p-about__process_lead {
    display: block;
}
.p-about__process_img {
  border-radius: calc(24 * var(--width-ratio-1280));
  border: solid 1px #BEDBFF;
  overflow: hidden;
}
.p-about__process_img_sp {
    display: none;
}

@media screen and (max-width: 768px) {
    .p-about__process {
    }
    .p-about__process_lead {
        width: 100%;
    }
    .p-about__process_img {
        display: none;
    }
    .p-about__process_img_sp {
        width: 100%;
        display: block;
        overflow-x: auto;
        position: relative;
        -webkit-overflow-scrolling: touch;
    }
    .p-about__process_img_sp::after {
        content: '';
        display: block;
        width: 208px;
        aspect-ratio: 216 / 226;
        background-image: url('../img/about/scroll_gude01.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
        pointer-events: none;
        opacity: 1;
        transition: opacity 0.35s ease;
    }
    .p-about__process_img_sp.is-scrolled::after {
        opacity: 0;
    }
    .p-about__process_img_sp img {
        width: calc(924 * var(--width-ratio-1280));
        height: auto;
        object-fit: contain;
    }
}

/*--------------------------------
# 業界・分野
--------------------------------*/
.p-about__field {
    background-color: #EFF6FF;
}
.p-about__field .l-title {
}
.p-about__field_lead {
    display: block;
}
/*支援業界・分野追加*/
.p-about__field_content {
    display: flex;
    justify-content: center;
    column-gap: calc(32 * var(--width-ratio-1280));
}
.p-about__field-container{
  width: calc((100% - (32 * var(--width-ratio-1280))) / 2);
  border-radius: calc(24 * var(--width-ratio-1280));
  border: solid 1px #BEDBFF;
  background-color:#fff;
  overflow: hidden;
  padding:calc(32 * var(--width-ratio-1280)) calc(24 * var(--width-ratio-1280));
}
.p-about__field-ttl{
  text-align: center;
  font-weight:bold;
  color: #1f5fd1;
  background: linear-gradient(90deg, #144AB3 0%, #278DFB 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.p-about__field-top-list{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: calc(7 * var(--width-ratio-1280));
}
.p-about__field-top-box{

}
.p-about__field-top-box-img{
  width:calc(72 * var(--width-ratio-1280));
  margin:0 auto;
  margin-bottom:calc(9 * var(--width-ratio-1280));
}
.p-about__field-top-box-text{
  padding:calc(3 * var(--width-ratio-1280)) calc(6 * var(--width-ratio-1280));
  border-radius:12px;
  background-color:#144AB3;
  color:#fff;
  text-align: center;
  font-weight:bold;
  font-size:calc(11 * var(--width-ratio-1280));
  line-height:1.6;
  letter-spacing: 0.01em;
	font-family: var(--font-ja);
}
.p-about__field-bottom-list{

}
.p-about__field-bottom-item{
  gap: calc(16 * var(--width-ratio-1280));
  align-items: center;
}
.p-about__field-bottom-item-img{
  width:calc(72 * var(--width-ratio-1280));
}
.p-about__field-bottom-item-content{
  flex:1;
}
.p-about__field-bottom-item-ttl{
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-size: calc(14 * var(--width-ratio-1280));
  font-family: var(--font-ja);
  color: var(--color-text);
}
.p-about__field-bottom-item-text{
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-size: calc(14 * var(--width-ratio-1280));
  font-family: var(--font-ja);
  color: var(--color-text);
}
    @media screen and (max-width: 768px) {
      .p-about__field-container{
        width:100%;
      }

      .p-about__field-top-list{
        display:grid;
        grid-template-columns: repeat(2, 1fr);
        gap: calc(16 * var(--width-ratio-1280));
      }
      .p-about__field-bottom-item{
        gap: 0;
        align-items: center;
        flex-direction: column;
      }
      .p-about__field-bottom-item-img{
        width:calc(72 * var(--width-ratio-1280));
        margin:0 auto;
      }
    }

.p-about__field_content .img {
    width: 46.8%;
    width: calc((100% - (32 * var(--width-ratio-1280))) / 2);
    border-radius: calc(24 * var(--width-ratio-1280));
    border: solid 1px #BEDBFF;
    overflow: hidden;
}
.p-about__field_content .img img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

@media screen and (max-width: 768px) {
    .p-about__field {
    }
    .p-about__field_lead {
        width: 100%;
    }
    .p-about__field_content {
        flex-direction: column;
        align-items: center;
        row-gap: calc(16 * var(--width-ratio-1280));
    }
    .p-about__field_content .img {
        max-width: 100%;
        width: 100%;
    }
}

/*--------------------------------
# 数字で見る実績
--------------------------------*/
.p-about__achieve {
    background-color: #fff;
}
.p-about__achieve .l-title {
}
.p-about__achieve_lead {
    display: block;
    letter-spacing: 0;
}
.p-about__achieve_content {
    text-align: center;
}
.p-about__achieve_content .graph {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    column-gap: calc(32 * var(--width-ratio-1280));
    row-gap: calc(24 * var(--width-ratio-1280));
    position: relative;
    z-index: 11;
    text-align: left;
}
.p-about__achieve_content .graph .img {
    width: fit-content;
    height: auto;
    position: relative;
    width: calc((100% - (32 * var(--width-ratio-1280))) / 2);
}
.p-about__achieve_content .graph .img.wide {
    padding: calc(35 * var(--width-ratio-1280)) calc(77 * var(--width-ratio-1280));

}
.p-about__achieve_content .graph .img:before {
    content: '';
    display: block;
    width: calc(641 * var(--width-ratio-1280));
    height: calc(328 * var(--width-ratio-1280));
    background: linear-gradient(35deg,#DBEAFE 0%, #fff 100%);
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
    filter: blur(128px);
}
.p-about__achieve_content .graph .img:after {
    width: calc(600 * var(--width-ratio-1280));
    height: calc(328 * var(--width-ratio-1280));
    top: 0;
    left: -10px;
    transform: none;
}
.p-about__achieve_content .graph .img img {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.p-about__achieve_content .graph .img.wide img {
    width: calc(684* var(--width-ratio-1280));
}
.p-about__achieve_content .partners {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    z-index: 1;
    margin-right:auto;
    margin-left:auto;
    padding: 0 calc(24 * var(--width-ratio-1280));
}
.p-about__achieve_content .partners picture,
.p-about__achieve_content .partners img {
    display: block;
}
.p-about__achieve_content .partners::before {
    content: '';
    display: block;
    width: calc(1280 * var(--width-ratio-1280));
    height: calc(100% + 50 * var(--width-ratio-1280));
    background: linear-gradient(35deg,#DBEAFE 0%, #fff 100%);
    position: absolute;
    top: 0;
    left: calc(-40 * var(--width-ratio-1280));
    z-index: -1;
    filter: blur(128px);
}
.p-about__achieve_content .partners .img {
    width: 100%;
    height: auto;
    padding: calc(48 * var(--width-ratio-1280));
    background-color: #fff;
    border-radius: calc(40 * var(--width-ratio-1280));
}
.p-about__achieve_content .partners img {
    width: 100%;
    height: auto;
    object-fit: contain;
    vertical-align: bottom;
}
.p-about__achieve_content .partners_sp {
    display: none;
}

@media screen and (max-width: 768px) {
    .p-about__achieve {
        padding: calc(60 * var(--width-ratio-1280)) 0 0;
    }
    .p-about__achieve .l-title {
    }
    .p-about__achieve_lead {
        width: 100%;
    }
    .p-about__achieve_content .graph {
        row-gap: calc(30 * var(--width-ratio-1280));
    }
    .p-about__achieve_content .graph .img {
        width: 100%;
        border-radius: calc(24 * var(--width-ratio-1280));
        padding: 0;
    }

    .p-about__achieve_content .graph .img img {
        width: 100%;
    }
    .p-about__achieve_content .partners {
        display: block;
        padding: 0 ;
    }
    .p-about__achieve_content .partners_sp_wrap {
        width: calc(100vw + 28px);
        position: relative;
        left: -28px;
        padding: 28px;
    }
    .p-about__achieve_content .partners_sp_wrap::before {
        content: '';
        display: block;
        width: 1341px;
        height: calc(100% + 50 * var(--width-ratio-1280));
        background: linear-gradient(135deg,#bad6fb 0%, #fff 100%);
        position: absolute;
        top: 42px;
        left: -57px;
        z-index: 0;
        filter: blur(128px);
    }
    .p-about__achieve_content .partners_sp {
        display: block;
        width: calc(100vw - 28px);
        overflow-x: auto;
        position: relative;
        -webkit-overflow-scrolling: touch;
        margin-top: calc(30 * var(--width-ratio-1280));
    }
    .p-about__achieve_content .partners_sp .img {
        width: 1000px;
        padding: calc(45 * var(--width-ratio-1280)) calc(62 * var(--width-ratio-1280));
        background-color: #fff;
        border-radius: calc(40 * var(--width-ratio-1280));
    }
    .p-about__achieve_content .partners_sp::after {
        content: '';
        display: block;
        width: 208px;
        aspect-ratio: 216 / 226;
        background-image: url('../img/about/scroll_gude02.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center center;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 2;
        pointer-events: none;
        opacity: 1;
        transition: opacity 0.35s ease;
    }
    .p-about__achieve_content .partners_sp.is-scrolled::after {
        opacity: 0;
    }

    .p-about__achieve_content .partners_sp img {
        display: block;
        width: 100%;
        max-width: none;
        height: auto;
        object-fit: contain;
        border-radius: 40px;
    }
}


/*--------------------------------
# 特徴
--------------------------------*/
/* 当社システム開発の特徴リンク用スムーズスクロール */
html {
    scroll-behavior: smooth;
}
.p-about__feature_article {
    scroll-margin-top: 1em;
}
.p-about__feature {
}
.p-about__feature .l-title {
    position: relative;
}
.p-about__feature_links {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: calc(32 * var(--width-ratio-1280));
}
.p-about__feature_links a {
    background-color: #F1F9FE;
    box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.05);
    width: calc(340 * var(--width-ratio-1280));
    height: calc(64 * var(--width-ratio-1280));
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: calc(8 * var(--width-ratio-1280));
    font-family: var(--font-en);
    font-size: calc(16 * var(--width-ratio-1280));
    font-weight: 700;
    line-height: 1.4;
    color: #0540F2;
    text-align: center;
    letter-spacing: -0.022em;
    border:solid 1px #BEDBFF;
    border-radius: calc(24 * var(--width-ratio-1280));
    padding: 0 calc(14 * var(--width-ratio-1280));
    position: relative;
}
.p-about__feature_links a::after {
    content: '';
    display: block;
    width: calc(16 * var(--width-ratio-1280));
    height: calc(16 * var(--width-ratio-1280));
    background-image: url('../img/arrow_b_blue-full.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.p-about__feature_article {
}
.p-about__feature_article h3 {

    color: #0F172B;

}
.p-about__feature_article p {

}
.p-about__feature_article .img img {
    width: 100%;
    height: auto;
    border-radius: calc(24 * var(--width-ratio-1280));
    border: solid 1px #BEDBFF;
    overflow: hidden;
}
.p-about__feature_article_child {
}
.p-about__feature_article_child h4 {

    color: #314158;
}
.p-about__feature_article_child p {

    color: #314158;
}
.p-about__feature_article_child .ai_list {
    width: calc(300 * var(--width-ratio-1280));
    display: block;
    margin: 0 auto;
    height: auto;
    object-fit: contain;
    vertical-align: bottom;
}

@media screen and (max-width: 768px) {
    .p-about__feature {
    }
    .p-about__feature_links {
        flex-wrap: wrap;
        row-gap: calc(16 * var(--width-ratio-1280));
    }
    .p-about__feature_links a {
      height: calc(56 * var(--width-ratio-1280));
      font-size: calc(14 * var(--width-ratio-1280));
    }
    .p-about__feature_links a::after {
    }
    .p-about__feature_article {
    }
    .p-about__feature_article h3 {
    }
    .p-about__feature_article p {
    }
    .p-about__feature_article_child .ai_list {
        width: 100%;
    }
}



/*追加*/
.c-under__fv{
  padding-top:calc(48 * var(--width-ratio-1280));
}
.p-about__fv .l-title{
  margin-bottom:0;
}
.c-about.u-container{
  padding-top:calc(48 * var(--width-ratio-1280));
}
.p-about__achieve_content .graph .img{
  padding:calc(21 * var(--width-ratio-1280)) calc(48 * var(--width-ratio-1280)) calc(8 * var(--width-ratio-1280));
  background-color:#fff;
  position: relative;
  border-radius: calc(24 * var(--width-ratio-1280));
  border: solid 1px #BEDBFF;
  overflow: hidden;
}
.p-about__achieve_content .graph .img img{
  width: calc(350 * var(--width-ratio-1280));
  margin:0 auto;
  display: block;
}
.p-about__achieve_graph_text{
  font-family: var(--font-ja);
  color:#333;
  line-height: 1.6;
  letter-spacing: 0.01em;
  font-size:calc(16 * var(--width-ratio-1280));
  border-bottom:solid 2px #333;
}
.p-about__fs-m{
  color:#0540F2;
  font-size:calc(24 * var(--width-ratio-1280));
  font-weight:bold;
}
.p-about__fs-l{
  color:#0540F2;
  font-size:calc(40 * var(--width-ratio-1280));
  margin-right:5px;
  font-weight:900;
}
.p-about__achieve_graph_note{
  font-family: var(--font-ja);
  color:#333;
  line-height: 1.6;
  letter-spacing: 0.01em;
  font-size:calc(11 * var(--width-ratio-1280));
  position: absolute;
  right:calc(48 * var(--width-ratio-1280));
  bottom:calc(4 * var(--width-ratio-1280));
}
    @media screen and (max-width: 768px) {
      /*追加*/
      .c-under__fv{
        padding-top:calc(48 * var(--width-ratio-1280));
      }
      .p-about__fv .l-title{
        margin-bottom:0;
      }
      .c-about.u-container{
        padding-top:calc(48 * var(--width-ratio-1280));
      }
      .p-about__achieve_content .graph .img{
        padding:calc(21 * var(--width-ratio-1280)) calc(48 * var(--width-ratio-1280)) calc(8 * var(--width-ratio-1280));
      }
      .p-about__achieve_content .graph .img:last-child{
        padding-bottom:calc(32 * var(--width-ratio-1280));
      }
      .p-about__achieve_content .graph .img img{
        width: 100%;
        margin:0 auto;
        display: block;
      }
      .p-about__achieve_graph_text{
        font-size:calc(14 * var(--width-ratio-1280));
        text-align: center;
        padding-bottom:calc(4 * var(--width-ratio-1280));
      }
      .p-about__fs-m{
        font-size:calc(18 * var(--width-ratio-1280));
      }
      .p-about__fs-l{
        font-size:calc(32 * var(--width-ratio-1280));
        margin-right:5px;
        line-height: 1;
      }
      .p-about__achieve_graph_note{
        padding: 0 calc(24 * var(--width-ratio-1280));
        font-size:calc(11 * var(--width-ratio-1280));
        position: absolute;
        right:calc(0 * var(--width-ratio-1280));
        bottom:calc(8 * var(--width-ratio-1280));
      }
    }
.p-about__feature_article_wrap{
  background-color:#F1F9FE;
  border:solid 1px #D7E7FF;
  padding:calc(48 * var(--width-ratio-1280));
  border-radius: calc(24 * var(--width-ratio-1280));
  border: solid 1px #BEDBFF;
  overflow: hidden;
  position: relative;
}
.p-about__feature_article_container{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(32 * var(--width-ratio-1280));
}
.p-about__feature_article_box{
  width:100%;
  background-color:#fff;
  border-radius: calc(24 * var(--width-ratio-1280));
  overflow: hidden;
  padding: calc(24 * var(--width-ratio-1280)) ;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
}
.p-about__feature_article_box .c-ttl__small{
  font-size:calc(16 * var(--width-ratio-1280));
  color:#0540F2;
  text-align: center;
  margin-bottom:calc(10 * var(--width-ratio-1280));
  min-height:calc(51.2 * var(--width-ratio-1280));
}
#technical-ability .p-about__feature_article_box .c-ttl__small{
  min-height:unset;
}
.p-about__feature_article_content{
  gap: calc(18 * var(--width-ratio-1280));
  align-items: center;
}
.p-about__feature_article_content_img{
  width:calc(155 * var(--width-ratio-1280));
}
.p-about__feature_article_box .c-text{
  flex:1;
  font-size:calc(14 * var(--width-ratio-1280));
}
p.p-about__feature_article_center{
  font-size:calc(14 * var(--width-ratio-1280));
  font-weight:bold;
  line-height:1.6;
  color:#0540F2;
  text-align: center;
  background-color:#F1F9FE;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width:calc(150 * var(--width-ratio-1280));
  height:calc(150 * var(--width-ratio-1280));
  border:solid 1px #D7E7FF;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
}
.p-about__feature_article_center_deco{
  font-size:calc(18 * var(--width-ratio-1280));
  font-weight:bold;
  line-height:1;
  display: inline-block;
}

.p-about__technology-stack{
  gap:calc(32 * var(--width-ratio-1280));
  align-items: center;
  width: 100%;
}
.p-about__technology-stack .c-text{
  flex:1;
}
.p-about__technology-stack picture{
  padding: calc(8 * var(--width-ratio-1280)) calc(24 * var(--width-ratio-1280)) 0;
  border-radius: calc(24 * var(--width-ratio-1280));
  border: solid 1px #BEDBFF;
  overflow: hidden;
  width: 40%;
  background-color:#fff;
}

.p-about__achieve_content .partners-list{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap:calc(8 * var(--width-ratio-1280));
  width: 100%;
  height: auto;
  overflow: hidden;
}
.p-about__achieve_content .partners-item{
  font-size:calc(12 * var(--width-ratio-1280));
  text-align: left;
}
.partners-list-note{
  font-size:calc(10 * var(--width-ratio-1280));
  text-align: right;
  margin-top:;
}
    @media screen and (max-width: 768px) {
      .p-about__feature_article_wrap{
        padding:calc(24 * var(--width-ratio-1280));
      }
      .p-about__feature_article_container{
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: calc(16 * var(--width-ratio-1280));
      }
      .p-about__feature_article_box{
        padding: calc(24 * var(--width-ratio-1280)) ;
      }
      .p-about__feature_article_box .c-ttl__small{
        font-size:calc(14 * var(--width-ratio-1280));

        margin-bottom:calc(10 * var(--width-ratio-1280));
        min-height:calc(51.2 * var(--width-ratio-1280));
      }
      #technical-ability .p-about__feature_article_box .c-ttl__small{
        min-height:unset;
      }
      .p-about__feature_article_content{
        gap: calc(16 * var(--width-ratio-1280));
        align-items: center;
      }
      .p-about__feature_article_content_img{
        width:100%;
      }
      .p-about__feature_article_content_img img{
        width:70%;
        margin:0 auto;
        display: block;
      }
      .p-about__feature_article_box .c-text{
        flex:1;
        font-size:calc(14 * var(--width-ratio-1280));
      }
      p.p-about__feature_article_center{
        font-size:calc(14 * var(--width-ratio-1280));
        width:100%;
        height:auto;
        padding: 0;
        border:unset;
        border-radius: unset;
        display: flex;
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform : unset;
        transform : unset;
        flex-direction: row;
        gap:4px;
      }
      .p-about__feature_article_center_deco{
        font-size:calc(16 * var(--width-ratio-1280));
        font-weight:bold;
        line-height:1;
      }

      .p-about__technology-stack{
        gap:calc(16 * var(--width-ratio-1280));
        align-items: center;
        width: 100%;
      }
      .p-about__technology-stack .c-text{
        flex:1;
      }
      .p-about__technology-stack picture{
        padding: calc(8 * var(--width-ratio-1280)) calc(24 * var(--width-ratio-1280)) 0;
        width: 100%;
      }

      .p-about__achieve_content .partners-list{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap:calc(8 * var(--width-ratio-1280)) calc(14 * var(--width-ratio-1280));
      }
      .p-about__achieve_content .partners-item{
        font-size:calc(10 * var(--width-ratio-1280));
      }
      .partners-list-note{
        font-size:calc(10 * var(--width-ratio-1280));
        text-align: right;
        margin-top:;
      }
    }


/*AI駆動システム開発追加*/
.p-about__feature_ai{
  gap:calc(32 * var(--width-ratio-1280));
  padding:calc(32 * var(--width-ratio-1280)) calc(48 * var(--width-ratio-1280)) calc(80 * var(--width-ratio-1280));
  border-radius: calc(24 * var(--width-ratio-1280));
  border:solid 1px #D7E7FF;
  overflow: hidden;
  background-color:#F1F9FE;
}
.p-about__feature_ai_img{
  width:32.8%;
  width:36.5%;
}
.p-about__feature_ai_content{
  position: relative;
  flex:1;
}
.p-about__feature_ai_ttl{
  color:#103AA2;
  text-align: center;
}
.p-about__feature_ai_list_wrap{
  position: relative;
}
.p-about__feature_ai_arrow{
  position: absolute;
  z-index: 0;
  width:calc(94 * var(--width-ratio-1280));
  top:calc(10 * var(--width-ratio-1280));
  left:calc(38.5 * var(--width-ratio-1280));
}
.p-about__feature_ai_list{
  position: relative;
  display: flex;
  flex-direction:column;
  gap:calc(24 * var(--width-ratio-1280));
}
.p-about__feature_ai_item{
  width:100%;
  box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.05);
}
.p-about__feature_ai_item_th{
  width:26%;
  background-color:#1755BF;
  padding:calc(14 * var(--width-ratio-1280)) calc(13 * var(--width-ratio-1280)) ;
  border-radius: calc(12 * var(--width-ratio-1280)) 0 0 calc(12 * var(--width-ratio-1280));
  color:#fff;
  text-align: center;
}
.p-about__feature_ai_item:nth-child(2) .p-about__feature_ai_item_th{
  background-color:#1B62CC;
}
.p-about__feature_ai_item:nth-child(3) .p-about__feature_ai_item_th{
  background-color:#1F70DC;
}
.p-about__feature_ai_item:nth-child(4) .p-about__feature_ai_item_th{
  background-color:#227CE9;
}
.p-about__feature_ai_item:nth-child(5) .p-about__feature_ai_item_th{
  background-color:#2689F7;
}
.p-about__feature_ai_item_text{
  flex:1;
  background-color:#fff;
  font-weight:500;
  padding:calc(7 * var(--width-ratio-1280)) calc(24 * var(--width-ratio-1280));
  border-radius: 0 calc(12 * var(--width-ratio-1280)) calc(12 * var(--width-ratio-1280)) 0;
  display: flex;
  align-items: center;
}
    @media screen and (max-width: 768px){
      .p-about__feature_ai{
        gap:calc(32 * var(--width-ratio-1280));
        padding:calc(56 * var(--width-ratio-1280)) calc(16 * var(--width-ratio-1280)) calc(100 * var(--width-ratio-1280));
        border-radius: calc(24 * var(--width-ratio-1280));
        border:solid 1px #D7E7FF;
        overflow: hidden;
        background-color:#F1F9FE;
      }
      .p-about__feature_ai_img{
        width:100%;
      }
      .p-about__feature_ai_content{
        position: relative;
        flex:1;
      }
      .p-about__feature_ai_ttl{
        color:#103AA2;
        text-align: center;
      }
      .p-about__feature_ai_list_wrap{
        position: relative;
      }
      .p-about__feature_ai_arrow{
        position: absolute;
        z-index: 0;
        width:calc(94 * var(--width-ratio-1280));
        top:calc(90 * var(--width-ratio-1280));
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
      }
      .p-about__feature_ai_list{
        position: relative;
        display: flex;
        flex-direction:column;
        gap:calc(24 * var(--width-ratio-1280));
      }
      .p-about__feature_ai_item{
        width:100%;
        box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.05);
      }
      .p-about__feature_ai_item_th{
        width:100%;
        background-color:#1755BF;
        padding:calc(20 * var(--width-ratio-1280)) calc(13 * var(--width-ratio-1280)) ;
        border-radius: calc(12 * var(--width-ratio-1280)) calc(12 * var(--width-ratio-1280)) 0 0;
        color:#fff;
        text-align: center;
      }
      .p-about__feature_ai_item:nth-child(2) .p-about__feature_ai_item_th{
        background-color:#1B62CC;
      }
      .p-about__feature_ai_item:nth-child(3) .p-about__feature_ai_item_th{
        background-color:#1F70DC;
      }
      .p-about__feature_ai_item:nth-child(4) .p-about__feature_ai_item_th{
        background-color:#227CE9;
      }
      .p-about__feature_ai_item:nth-child(5) .p-about__feature_ai_item_th{
        background-color:#2689F7;
      }
      .p-about__feature_ai_item_text{
        flex:1;
        background-color:#fff;
        font-weight:500;
        padding:calc(24 * var(--width-ratio-1280)) calc(16 * var(--width-ratio-1280));
        border-radius: 0 0 calc(12 * var(--width-ratio-1280)) calc(12 * var(--width-ratio-1280));
        display: flex;
        align-items: center;
      }
    }
