@charset "utf-8";

/*-- 共通設定--*/
html {
    box-sizing: border-box;
}

.dx-wrap {
    max-width: 730px;
    margin: 0 auto;
}

/* aタグ */
.dx-about-ky a {
    color: #004e91;
    text-decoration: underline;
}

.dx-about-ky a:hover {
    opacity: 0.7;
    cursor: pointer;
}

.dx-about-ky a:visited {
    color: #004e91;
}



/* h2タグ、h3タグ */
.dx-about-ky h2 {
    font-size: 28px;
    font-weight: bold;
    color: #002B55;
    text-align: center;
    margin-bottom: 30px;
}

.dx-about-ky h2 span {
    position: relative;
}

.dx-about-ky h2 span::before {
    position: absolute;
    top: calc(50% - 1.5px);
    left: -2.5em;
    width: 2em;
    height: 3px;
    content: '';
    background: #002B55;
}

.dx-about-ky h2 span::after {
    position: absolute;
    top: calc(50% - 1.5px);
    right: -2.5em;
    width: 2em;
    height: 3px;
    content: '';
    background: #002B55;
}

.dx-about-ky h3 {
    font-size: 24px;
    font-weight: bold;
    color: #333;
    text-align: center;
    position: relative;
}

.dx-about-ky h3::after {
    content: "";
    display: block;
    margin: 10px auto 30px;
    width: 80px;
    height: 3px;
    background-color: #002B55;
}


/* サイト内リンクボタン */
.dx-about-ky .site-link-btn {
    display: block;
    width: 350px;
    height: 70px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 66px;
    border: 2px solid #FF9F0C;
    border-radius: 35px;
    background: #fff;
    -webkit-box-shadow: 5px 5px 0 #FF9F0C;
    box-shadow: 5px 5px 0 #FF9F0C;
    margin: 30px auto 0;
    text-decoration: none;
    transition: .3s;
}

.dx-about-ky a.site-link-btn {
    color: #000;
}

.dx-about-ky a.site-link-btn:visited  {
    color: #000;
}

.dx-about-ky a.site-link-btn:hover {
    /*color: #FF9F0C;*/
    -webkit-box-shadow: 0 0 0 #FF9F0C;
    box-shadow: 0 0 0 #FF9F0C;
    transform: translateY(5px);
    opacity: 1;
}

/* サイト内リンク */

.dx-about-ky a.site-link{
    font-size: 16px;
    font-weight: bold;
    text-align: right;
}

.dx-consulting{
    text-align: center; /* これを追加 */
    margin-bottom: 20px;
}

/*241129 DX関連サービス　追記*/
.dx-main-textBox2 h3{
font-size:20px;
margin-bottom: 20px;
}
.dx-main-textBox2 h3::after{
    display: none;
}
.dx-promotion-k{
display: flex;
justify-content: center;
flex-wrap: wrap;
width: 100%;
margin-bottom: 40px;
}
.dx-promotion-k > a{
max-width: 222px;
width: 50%;
margin: 0 auto;
}
.dx-promotion-k > a > figure{
text-align: left;
}
.dx-promotion-k > a > figure >img{
margin-bottom: 10px;
width: 100%;
height: auto;
object-fit: contain;
}
.dx-promotion-k > a >figure > figcaption{
width:fit-content;
line-height: 1.5;
}
.dx-promotion-k > a >figure > figcaption > i{
margin-left:5px;
}
.dx-promotion-k--consulting,
.dx-promotion-k--assessment{
width: 100%;
}
.dx-promotion-k--consulting figure figcaption::after,
.dx-promotion-k--assessment figure figcaption::after{
content:"";
display:inline-block;
width:15px;
height:15px;
margin-left:5px;
background-image:url(../img/middle/dx_about/up-right-from-square-solid.svg);
background-repeat:no-repeat;
background-size:contain;
background-position:bottom;
}
@media screen and (max-width: 730px) {
    .dx-promotion-k{
        flex-direction: column;
        align-items: center;
        row-gap: 20px;
    }
    .dx-promotion-k > .dx_service--consulting > a{
        width: 100%;
    }
}

/*.dx-promotion-k{
margin-bottom: 40px;
}*/

.dx-promotion-k,
.dx-title04-btn {
    text-align: right; /* これを追加 */
}
.dx-consulting{
    margin-bottom: 40px;
}

.dx-title04-btn{
    margin-bottom: 80px;
}

.fa-solid{
    color: #004E91;
}


/*.dx-promotion-k::before,
.dx-consulting::before,
.dx-title04-btn::before {

        content: "";
        width: 15px;
        height: 12px;
        background-image: url(../img/middle/dxpedia/dxp_link.png);
        display: inline-block;
        background-size: contain;
        background-repeat: no-repeat;
    } */
    



/* 今すぐお問合せ・ＤＸ研修一覧を確認する */
.dx-about-ky .dx-main-btn_wrap1,
.dx-about-ky .dx-main-btn_wrap2 {
    display: flex;
    justify-content: center;
    gap: 110px;
    width: 100%;
    height: 153px;
    background-color: rgba(0, 43, 85, 0.9);
    background-image: url(../img/middle/dx_about/bg_curve.png);
    background-blend-mode: multiply;
    background-size: 47%;
    background-position: bottom right;
    background-repeat: no-repeat;
    margin-bottom: 80px;
}

.dx-about-ky .dx-main-btn_wrap1 {
    gap: 110px;
}

.dx-about-ky .dx-main-btn_wrap1 p,
.dx-about-ky .dx-main-btn_wrap2 p {
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    margin: 15px auto 15px;
}

.dx-about-ky .dx-main-btn-l,
.dx-about-ky .dx-main-btn-r {
    display: block;
    width: 250px;
    height: 70px;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 66px;
    border-radius: 35px;
    margin: 0;
}

.dx-about-ky a.dx-main-btn-l {
    color: #fff;
    border: 1px solid #fff;
    background: #FF9F0C;
    -webkit-box-shadow: 5px 5px 0 #707070;
    box-shadow: 5px 5px 0 #707070;
    text-decoration: none;
    transition: .3s;
}

.dx-about-ky a.dx-main-btn-l:hover {
    /*color: #707070;*/
    -webkit-box-shadow: -5px -5px 0 #707070;
    box-shadow: 0 0 0 #707070;
    transform: translateY(5px);
    opacity:1;
}

.dx-about-ky a.dx-main-btn-r {
    color: #333;
    border: 1px solid #FF9F0C;
    background: #fff;
    -webkit-box-shadow: 5px 5px 0 #FF9F0C;
    box-shadow: 5px 5px 0 #FF9F0C;
    text-decoration: none;
    transition: .3s;
}

.dx-about-ky a.dx-main-btn-r:hover {
    /*color: #FF9F0C;*/
    -webkit-box-shadow: -5px -5px 0 #FF9F0C;
    box-shadow: 0 0 0 #FF9F0C;
    transform: translateY(5px);
    opacity:1;
}

/* 黄色のアンダーライン */
.dx-underline {
    background: linear-gradient(rgba(255, 202, 39, 0) 60%, rgba(255, 202, 39, 0.6) 60%);
}


/* ページ内リンクのズレの解消 */
[id] {
    scroll-margin-top: 128px;
}

@media screen and (max-width: 450px) {
    [id] {
        scroll-margin-top: 80px;
    }
    
}

/* 流れるようにスクロールしてリンク先に飛ぶ */
html {
scroll-behavior: smooth;
}



@media screen and (max-width: 450px) {

    /* レスポンシブ用に画面幅を調整 */
    .l_mainContents--2col {
        width: 100%;
        margin: 0 auto;
    }

    .dx-wrap {
        max-width: 100%;
    }


    /* h2タグ、h3タグ */
    .l_mainContents--2col h2 {
        font-size: 22px;
    }

    .l_mainContents--2col h3 {
        font-size: 20px;
    }


    /* サイト内リンクボタン */
    .l_mainContents--2col .site-link-btn {
        width: 320px;
        height: 60px;
        line-height: 56px;
        border-radius: 30px;
    }

    /* サイト内リンク */
    .dx-promotion-k,
.dx-consulting,
.dx-title04-btn {
    margin-right: 10px;
}


    /* 今すぐお問合せ・ＤＸ研修一覧を確認する */
    .l_mainContents--2col .dx-main-btn_wrap1,
    .l_mainContents--2col .dx-main-btn_wrap2 {
        display: grid;
        align-items: center;
    }

    .l_mainContents--2col .dx-main-btn_wrap1 {
        height: 280px;
        gap: 0;
        background-size: 100%;
    }

    .l_mainContents--2col .dx-main-btn_wrap2 {
        height: 143px;
        background-size: 85%;
    }

    .l_mainContents--2col .dx-main-btn_wrap1 p,
    .l_mainContents--2col .dx-main-btn_wrap2 p {
        margin: 0 auto 15px;
    }

    .l_mainContents--2col .dx-main-btn-l,
    .l_mainContents--2col .dx-main-btn-r {
        height: 60px;
        line-height: 56px;
        border-radius: 30px;
    }
}


/*** ここから木村 ***/
/*-- 共通設定--*/
.dx-title01 {
    max-width: 730px;
    margin: 0 auto;
    margin-bottom: 80px;
}

.dx-title01 .dx-content {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 80px;
}

.dx-title01 .dx-content2 {
    width: 94%;
    margin: 0 auto;
    margin-bottom: 40px;
    position: relative;
}

.dx-title01 .dx-content .dx-h3-center {
    text-align: center;
    margin-right: 10px;
    margin-left: 10px;
}



/*-- dx-main --*/
.dx-main h1 {
    max-width: 730px;
    margin: 0 auto 40px;
}

.dx-main h1 img {
    width: 100%;
    height: auto;
}

.what-is-dx-k {
    display: flex;
    justify-content: center;
    margin: 0 auto 30px;
}

.what-is-dx-k p {
    width: 430px;
    height: 60px;
    font-size: 20px;
    font-weight: bold;
    color: #002B55;
    text-align: center;
    line-height: 52px;
    border: 4px double #002B55;
}

.dx-main-textBox1 {
    width: 94%;
    margin: 40px auto 30px;
}

.dx-main-textBox1 p {
    margin-bottom: 20px;
    padding: 5px 20px;
    text-align: center;
}

.dx-main-textBox1 p:nth-child(2) {
    margin-bottom: 30px;
}

.dx-keyword-k {
    width: 94%;
    margin: 0 auto 40px;
    text-align: center;

}

.dx-keyword-k span {
    font-size: 28px;
    font-weight: bold;
}

.dx-keyword-k .dx-sp1-k {
    letter-spacing: -0.1em;
}

.dx-main-textBox2 {
    width: 93%;
    margin: 0 auto 40px;
    line-height: 2.5;
}

@media screen and (max-width: 450px) {
    .what-is-dx-k p {
        width: 300px;
        height: 80px;
        font-size: 20px;
        line-height: 25px;
        padding-top: 10px;
    }

    .what-is-dx-k span {
        display: block;
    }

    .dx-main-textBox1 {
        width: 85%;
    }

    .dx-main-textBox1 p {
        margin-bottom: 20px;
        padding: 5px 0;
    }

    .dx-main-textBox1 p .line-break-k {
        display: block;
    }

    .dx-keyword-k .line-break-k {
        display: block;
    }

    .dx-main-textBox2 {
        width: 85%;
    }
}


/*-- dx-index 目次 --*/
.dx-index {
    width: 94%;
    margin: 0 auto 50px;
}

.dx-index_wrap {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.dx-index_inner ol {
    width: 100%
}

.dx-index_inner li .dx-index-heading{
    display: block;
    width: 329px;
    height: 44px;
    padding-left: 10px;
    font-size: 22px;
    font-weight: bold;
    color: #002B55;
    letter-spacing: -0.08em;
    line-height: 44px;
    background-color: #C9EFFF;
    margin-bottom: 15px;
    text-decoration: none;
}

.dx-index_inner ol li .dx-index-heading-k::before {
    display: none;
}

.dx-index_inner a.dx-index-heading:hover {
    /*color: #FFF;
    background-color: #002B55;*/
    opacity: 0.8;
    text-decoration:underline;
    
}

.dx-about-ky .dx-index_inner ol p a {
    display: inline-block;
    padding-left: 0.9em;
    font-size: 14px;
    color: #333;
    margin-bottom: 15px;
    text-decoration: none;
}

.dx-about-ky .dx-index_inner ol li p a::before {
    content: "";
    width: 0px;
    height: 0px;
    margin-right: 5px;
    padding-bottom: 5px;
    display: inline-block;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #666;
    border-left: 5px solid transparent;
    transform: rotate(90deg);
}

.dx-about-ky .dx-index_inner ol li p a:hover {
    color: #004e91;
    text-decoration: underline;
}

@media screen and (max-width: 450px) {
    .dx-index {
        width: calc(100% - 20px);
        margin: 0 auto 50px;
    }

    .dx-index_wrap {
        display: block;
        max-width: 100%;
    }

    .dx-index_inner .dx-index-heading-k {
        width: 100%;
        height: 40px;
        font-size: 20px;
        line-height: 40px;
    }
}

/* 目次・ここまで */



/*-- DXとは？ --*/
.dx-title01 .dx-content .dx-img {
    text-align: center;
}

.dx-title01 .dx-content .dx-about {
    width: 93%;
    margin: 30px auto 80px;
    line-height: 2em;
}

.dx-title01 .dx-content .dx-about span {
    font-weight: bold;
}

.dx-title01 .dx-content .dx-p-center {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}

.dx-title01 .dx-content .dx-ul1 {
    width: 94%;
    margin: 0 auto 30px;
}

.dx-title01 .dx-content .dx-ul1 li {
    position: relative;
    color: #004E91;
    margin-left: 20px;
}

.dx-title01 .dx-content .dx-ul1 li::before {
    position: absolute;
    content: "";
    border-radius: 50%;
    width: 8px;
    height: 8px;
    top: 0.5em;
    left: -1em;
    background: #004E91;
}

.dx-title01 .dx-content .dx-ul1 li:first-child {
    margin-bottom: 10px;
}

.dx-title01 .dx-content .dx-about2 {
    width: 94%;
    margin: 0 auto;
    line-height: 2em;
    margin-bottom: 80px;
}

@media screen and (max-width: 450px) {
    .dx-title01 .dx-content .dx-about {
        width: 85%;
    }

    .dx-title01 .dx-content .dx-p-center {
        font-size: 16px;
    }

    .dx-title01 .dx-content .dx-p-center span {
        display: block;
    }

    .dx-title01 .dx-content .dx-ul1 {
        width: 85%;
    }

    .dx-title01 .dx-content .dx-about2 {
        width: 85%;
    }
}

/* DXとは？ ここまで */



/*-- 組織内のＤＸ推進を阻むもの --*/
.dx-title01 .dx-content2 .dx-p-title02 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 40px;
}

.dx-title01 .dx-content2 .dx-worries {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 30px;
}

.dx-title01 .dx-content2 .dx-worries li {
    width: calc(100% / 2);
    border-right: 1px dotted #333;
    padding: 20px 10px 10px 50px;
    position: relative;
}

.dx-title01 .dx-content2 .dx-worries li:nth-child(2n) {
    border-right: none;
}

.dx-title01 .dx-content2 .dx-worries li {
    border-bottom: 1px dotted #333;
}

.dx-title01 .dx-content2 .dx-worries li:nth-last-child(-n+2) {
    border-bottom: none;
}

.dx-title01 .dx-content2 .dx-worries li::before {
    position: absolute;
    content: '';
    top: 1em;
    left: 0.5em;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #C9EFFF;
    margin: 5px 0;
}

.dx-title01 .dx-content2 .dx-worries li::after {
    position: absolute;
    content: '';
    top: 2.3em;
    left: 1.2em;
    width: 11px;
    height: 6px;
    border-left: 3px solid #004e91;
    border-bottom: 3px solid #004e91;
    transform: rotate(-45deg);
}

.dx-title01 .dx-content2 .dx-img2 {
    text-align: center;
}

.dx-title01 .dx-content2::after {
    position: absolute;
    content: '';
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: 60px solid transparent;
    border-top: 50px solid #fff;
    width: 0;
    height: 0;
}

@media screen and (max-width: 450px) {
    .dx-title01 .dx-content2 .dx-p-title02 {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .dx-content2 .dx-p-title02 span {
        display: block;
    }

    .dx-title01 .dx-content2 .dx-worries {
        display: block;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 30px;
    }

    .dx-title01 .dx-content2 .dx-worries li {
        width: calc(100% - 20px);
        border-right: none;
        border-bottom: none;
        padding: 20px 10px 10px 50px;
        position: relative;
        margin: 0 auto;
    }

    .dx-title01 .dx-content2 .dx-img2 {
        width: calc(100% -20%);
        height: auto;
    }
}


/* 吹き出し */
.speech-bubble-k {
    width: 94%;
    position: relative;
    padding: 0 2rem;
    border-bottom: 3px solid #333;
    background: #fff;
    margin: 0 auto 40px;
}

.speech-bubble-k:before {
    position: absolute;
    bottom: -21px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    content: '';
    border-width: 21px 18px 0 18px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}

.speech-bubble-k:after {
    position: absolute;
    bottom: -15px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    content: '';
    border-width: 21px 18px 0 18px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
}

/* 吹き出し・ここまで */


.dx-title01 .dx-main-btn_wrap1 {
    margin-bottom: 50px;
}

.dx-title01 .dx-flexbox3 {
    text-align: center;
    margin-bottom: 40px;
}

.dx-title01 .dx-flexbox3 .dx-p-worries1 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 30px;
}

.dx-title01 .dx-flexbox3 img {
    width: 450px;
    height: auto;
}

.dx-title01 .dx-flexbox3 .dx-p-worries2 {
    font-weight:bold;
    font-size: 20px;
    margin-top:10px;
}

.dx-title01 .dx-flexbox3 .dx-p-worries2 .dx-p-bold {
    font-size: 28px;
    font-weight: bold;
}


@media screen and (max-width: 450px) {
    .dx-title01 .dx-flexbox3 .dx-p-worries1 {
        font-size: 18px;
    }

    .dx-title01 .dx-flexbox3 img {
        width: calc(100% - 20px);
        height: auto;
    }

    .dx-title01 .dx-flexbox3 .dx-p-worries2 {
        font-size: 18px;
    }

    .dx-consulting span {
        display: block;
    }
}

/* 組織内のＤＸ推進を阻むもの ここまで */



/* ＩＤＡが提供するＤＸ研修の特徴 */
.responsive-break-k {
    display: none;
}

.dx-training-k {
    width: 100%;
    height: 390px;
    border: 3px solid #002B55;
    border-radius: 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    align-items: center;
    margin-bottom: 30px;
}

.dx-training-k img {
    width: auto;
    height: 150px;
}

.dx-training-k p {
    font-size: 24px;
    font-weight: bold;
    color: #004E91;
    text-align: left;
}

.dx-title01 .dx-content .dx-h4 {
    width: 94%;
    font-size: 18px;
    font-weight: bold;
    position: relative;
    padding-left: 3em;
    margin: 0 auto 30px;
}

.dx-title01 .dx-content .dx-h4::before {
    position: absolute;
    content: '';
    top: -0.5em;
    left: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #085CA6;
    margin: 5px 0;
}

.dx-title01 .dx-content .dx-h4::after {
    position: absolute;
    content: '';
    top: 0.5em;
    left: 0.6em;
    width: 11px;
    height: 6px;
    border-left: 3px solid #fff;
    border-bottom: 3px solid #fff;
    transform: rotate(-45deg);
}

.dx-title01 .dx-content .dx-p-features {
    width: 94%;
    margin: 0 auto 40px;
    line-height: 2em;
}

.dx-related-training-k {
    display: flex;
    justify-content: center;
    flex: 1;
    margin-bottom: 40px;
}

.dx-related-training-k .site-link-btn {
    width: 220px;
    margin-top: 0;
}

@media screen and (max-width: 450px) {
    .responsive-break-k {
        display: block;
    }

    .dx-training-k {
        width: calc(100% - 20px);
        height: 280px;
        grid-template-columns: 45% 55%;
        margin: 0 auto 30px;
    }

    .dx-training-k img {
        height: 105px;
    }

    .dx-training-k p {
        font-size: 16px;
    }

    .dx-title01 h2 .line-break-k {
        display: block;
    }

    .dx-related-training-k {
        display: block;
        margin-bottom: 40px;
    }

    .dx-related-training-k .site-link-btn {
        width: 250px;
        margin: 0 auto 20px;
    }

    .dx-title01 .dx-content .dx-p-features {
        width: 85%;
        margin: 0 auto 40px;
        line-height: 2em;
    }
}

/* ＩＤＡが提供するＤＸ研修の特徴　ここまで */



/* ＤＸに求められるＩＴスキルの図 */
.dx-blend-css {
    margin: 80px 0;
    display: flex;
    align-items: center;
    position: relative;
}

.dx-blend-css::before {
    position: absolute;
    content: "";
    display: block;
    height: 20%;
    width: 79%;
    border-bottom: dotted 1px #ddd;
    border-left: dotted 1px #ddd;
    border-right: dotted 1px #ddd;
    top: 100%;
    left: 0;
}

.dx-blend-css::after {
    position: absolute;
    content: "";
    display: block;
    height: 20%;
    width: 19%;
    border-bottom: dotted 1px #ddd;
    border-left: dotted 1px #ddd;
    border-right: dotted 1px #ddd;
    top: 100%;
    left: 80%;
}

.dx-blend-css li {
    width: 100%;
    height: 100px;
    font-size: 18px;
    font-weight: bold;
    margin-right: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.dx-blend-css li:nth-child(1) {
    background: #C9EFFF;
    color: #16488B;
}

.dx-blend-css li:nth-child(2) {
    background: #A5CEE9;
    color: #16488B;
}

.dx-blend-css li:nth-child(3) {
    background: #4F7EB1;
    color: #fff;
}

.dx-blend-css li:nth-child(4) {
    background: #3565A0;
    color: #fff;
}

.dx-blend-css li:last-child {
    background: #004E91;
    color: #fff;
}

.dx-blend-css li::before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    margin-left: 0;
    border: 50px solid transparent;
    border-left: 15px solid #fff;
    width: 0;
    height: 0;
}

.dx-blend-css li::after {
    position: absolute;
    content: '';
    left: 50%;
    top: 0;
    margin-left: 50%;
    border: 50px solid transparent;
    width: 0;
    height: 0;
    z-index: 3;
}

.dx-blend-css li:nth-child(1)::after {
    border-left: 15px solid #C9EFFF;
}

.dx-blend-css li:nth-child(2)::after {
    border-left: 15px solid #A5CEE9;
}

.dx-blend-css li:nth-child(3)::after {
    border-left: 15px solid #4F7EB1;
}

.dx-blend-css li:nth-child(4)::after {
    border-left: 15px solid #3565A0;
}

.dx-blend-css li:last-child::after {
    display: none;
}

.dx-blend-p,
.dx-blend-p05 {
    text-align: center;
    padding: 15% 0;
    margin-left: 14%;
    line-height: 1.1em;
    position: relative;
}

.dx-blend-css li .dx-blend-p05 {
    color: #fff;
}

.dx-blend-css li:nth-of-type(4) .dx-blend-p::before {
    position: absolute;
    content: "ビジネススキル";
    color: #16488B;
    background: #fff;
    font-size: 14px;
    top: 102px;
    left: -200%;
}

.dx-blend-css .dx-blend-p05::after {
    position: absolute;
    content: "技術スキル";
    color: #16488B;
    background: #fff;
    font-size: 14px;
    top: 102px;
    left: 0.5em;
    z-index: 4;
}

.dx-blend-step {
    font-size: 18px;
    font-weight: bold;
    color: #16488B;
    position: absolute;
    top: -2em;
    left: 1.6em;
}

.dx-blend-number {
    font-size: 24px;
    position: absolute;
    top: -1.9em;
    left: 2.5em;
}

.dx-blend-br::before,
.dx-blend-number::before {
    content: "\A";
    white-space: pre;
}

@media screen and (max-width: 450px) {
    .dx-blend-css {
        margin: 80px 10px;
    }

    .dx-blend-css li {
        height: 60px;
        font-size: 10px;
    }

    .dx-blend-css li::before {
        border: 30px solid transparent;
        border-left: 15px solid #fff;
    }

    .dx-blend-css li::after {
        border: 30px solid transparent;
    }

    .dx-blend-css li:nth-of-type(4) .dx-blend-p::before {
        font-size: 10px;
        top: 68px;
    }

    .dx-blend-css .dx-blend-p05::after {
        font-size: 10px;
        top: 68px;
        left: -0.35em;
    }

    .dx-blend-step {
        font-size: 11px;
        top: -3.5em;
    }

    .dx-blend-number {
        font-size: 16px;
        top: -0.9em;
        left: 0.65em;
    }
}

/* ＤＸに求められるＩＴスキルの図・ここまで */



/*** ここから吉原 ***/
/* 吉原共有 */


.width94 {
    width: 94%;
    margin: 0 auto;
    line-height: 2;
}

.bold20 {
    font-size: 20px;
    /* フォントサイズ */
    font-weight: bold;
    /* 太字 */
    position: relative;
    /* 文字の位置を相対的にする */
}


@media screen and (max-width: 450px) {
    .l_mainContents--2col {
        width: 100%;
    }

    .bold20 {
        font-size: 16px;
        /* フォントサイズを少し大きく */
        font-weight: bold;
        /* 太字 */
        position: relative;
        /* 文字の位置を相対的にする */
    }

    /* .l_mainContents--2col h2 {
      font-size: 22px; 
  }

  .l_mainContents--2col h3 {
      font-size: 20px; 
  } */

    .width94 {
        width: 85%;
        /* 幅を90%に変更 */
        margin: 0 auto;
    }

    .l_mainContents--2col h2 {
        margin: 0;
        margin-bottom: 40px;
        font-size: 22px;
    }

    .l_mainContents--2col h3 {
        font-size: 20px;
    }
}



/* 3POINT */

.dx-item {
    position: relative;
    /* 擬似要素を絶対位置で配置するために相対位置にする */
    height: 100px;
    /* 高さを指定 */
}

.dx-item::before {
    content: "";
    position: absolute;
    /* 擬似要素を絶対位置で配置 */
    left: 0;
    /* 左に配置 */
    top: 0;
    /* 上に配置 */
    background-image: url('../img/middle/dx_about/item1.png');
    background-size: cover;
    /* 画像をカバーする */
    background-position: center;
    /* 画像の中心を配置 */
    width: 100px;
    /* 幅を設定 */
    height: 100px;
    /* 高さを設定 */
    z-index: -1;
    /* 文字の背後に配置 */
}

.item2::before {
    background-image: url('../img/middle/dx_about/item2.png');
}

.item3::before {
    background-image: url('../img/middle/dx_about/item3.png');
}


.dx-3points p {
    margin-left: 80px;
    /* 画像の幅分だけマージンを追加 */
    z-index: 1;
    /* 文字を前面に配置 */
    line-height: 2;

}

.dx-content .dx-p-center2 {
    margin-bottom: 20px;
}

.dx-3points li {
    margin-bottom: 50px;
}

.dx-item .bold20 {
    margin-bottom: 10px;
}

.dx-content .dx-3points img,
.dx-content .dx-step-wrap img {
    display: block;
    /* 画像をブロック要素にする */
    margin: 0 auto;
    /* 左右のマージンを自動設定 */
    max-width: 100%;
    /* 幅を100%に設定して、レスポンシブ対応 */
    height: auto;
    /* 高さを自動調整 */
    margin-bottom: 35px;
}

.dx-content {
    margin-bottom: 100px;
}

@media screen and (max-width: 450px) {

    .dx-item::before {
        content: "";
        position: absolute;
        /* 擬似要素を絶対位置で配置 */
        left: 0;
        /* 左に配置 */
        top: 0;
        /* 上に配置 */
        background-size: cover;
        /* 画像をカバーする */
        background-position: center;
        /* 画像の中心を配置 */
        width: 80px;
        /* 幅を設定 */
        height: 80px;
        /* 高さを設定 */
        z-index: -1;
        /* 文字の背後に配置 */
    }

    .dx-3points p {
        margin-left: 0;
        /* 画像の幅分だけマージンを追加 */
        z-index: 0;
        /* 文字を前面に配置 */

    }

    .dx-3points .bold20 {
        margin-left: 60px;
    }

    .dx-3points {
        width: 85%;
        margin: 0 auto;
    }

    .dx-3points img {
        width: 90%;
    }

    .dx-3points .item1 {
        margin-bottom: 125px;
    }

    .dx-3points .item2 {
        margin-bottom: 140px;

    }

    .dx-3points .item3 {
        margin-bottom: 220px;

    }

    .dx-h3-center span {
        display: block;
    }

    .break {
        display: block;
    }

    .dx-content p.dx-p-center2{
        line-height: 2;
        
    }
    .dx-3points p{
        line-height: 2;

    }
    .dx-3points p.bold20{
        line-height: 1.5;

    }



}


/* 3POINT end */

/*  */

/* 4STEP */

.dx-step-title {
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 5px;
}

.dx-step-body {
    margin-bottom: 10px;
}

.dx-step-wrap ol>li {
    position: relative;
    margin-bottom: 20px;
    /* 既存のスタイルを維持 */
}

.dx-step-wrap ol>li.step04 {
    position: relative;
    margin-bottom: 50px;
    /* 既存のスタイルを維持 */
}

/* ステップバー円・垂直線 */
.dx-step-wrap ol>li::before {
    content: "";
    display: block;
    width: 110px;
    /* 外円のサイズ */
    height: 110px;
    /* 外円のサイズ */
    border-radius: 50%;
    position: absolute;
    top: 0;
    /* 外円の位置を調整 */
    left: 0;
    /* 外円を元の位置に配置 */
    border: 3px solid #0071BD;
    /* 円線の色 */
    /* z-index: -1; */
    box-sizing: border-box;
    /* ボックスサイズを含める */
    background-color: #fff;
}

.dx-step-wrap ol>li:nth-of-type(1)::before {
    border-color: #C9EFFF;
    /* 1つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(2)::before {
    border-color: #A5CEE9;
    /* 2つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(3)::before {
    border-color: #4F7EB1;
    /* 3つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(4)::before {
    border-color: #004e91;
    /* 3つ目の円の色 */
}

.dx-step-wrap ol>li.step01::after {
    content: "";
    display: block;
    width: 3px;
    /* 線の幅 */
    height: 100%;
    /* 円と円の間の距離を調整 */
    background: linear-gradient(0deg, #A5CEE9, #C9EFFF);
    /* 縦方向のグラデーション */
    position: absolute;
    top: 110px;
    /* 上の円の下端に線を始める */
    left: 54px;
}

.dx-step-wrap ol>li.step02::after {
    content: "";
    display: block;
    width: 3px;
    /* 線の幅 */
    height: 100%;
    /* 円と円の間の距離を調整 */
    background: linear-gradient(0deg, #4F7EB1, #A5CEE9);
    /* 縦方向のグラデーション */
    position: absolute;
    top: 110px;
    /* 上の円の下端に線を始める */
    left: 54px;
}

.dx-step-wrap ol>li.step03::after {
    content: "";
    display: block;
    width: 3px;
    /* 線の幅 */
    height: 100%;
    /* 円と円の間の距離を調整 */
    background: linear-gradient(0deg, #004e91, #4F7EB1);
    /* 縦方向のグラデーション */
    position: absolute;
    top: 110px;
    /* 上の円の下端に線を始める */
    left: 54px;
}

.dx-step-wrap ol>li:last-child::after {
    display: none;
    /* 最後のアイテムでは線を表示しない */
}


.dx-step-wrap ol>li .step-circle {
    position: absolute;
    width: 90px;
    /* 内円のサイズ */
    height: 90px;
    /* 内円のサイズ */
    border-radius: 50%;
    top: 10px;
    /* 内円の位置を調整 */
    left: 10px;
    /* 内円を元の位置に配置 */
}

/* 各円の色を指定 */
.dx-step-wrap ol>li:nth-of-type(1) .step-circle {
    background: #C9EFFF;
    /* 1つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(2) .step-circle {
    background: #A5CEE9;
    /* 2つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(3) .step-circle {
    background: #4F7EB1;
    /* 3つ目の円の色 */
}

.dx-step-wrap ol>li:nth-of-type(4) .step-circle {
    background: #004e91;
    /* 3つ目の円の色 */
}

/* 必要に応じて続けることができます */





.dx-step-wrap ol li .dx-step-title::before {
    position: absolute;
    content: "STEP";
    top: 25px;
    left: 28px;
    /* letter-spacing: 0.15em; */
    color: #004e91;
}

/* 番号の色を変更 */
.dx-step-wrap ol li:nth-of-type(1) .dx-step-title::before {
    color: #002b55;
    /* 1つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(2) .dx-step-title::before {
    color: #002b55;
    /* 2つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(3) .dx-step-title::before {
    color: #fff;
    /* 3つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(4) .dx-step-title::before {
    color: #fff;
    /* 3つ目の色 */
}

.dx-step-wrap ol>li {
    counter-increment: number;
}

.dx-step-wrap ol li .dx-step-title::after {
    position: absolute;
    content: counter(number, decimal-leading-zero);
    top: 47px;
    left: 40px;
    color: #004e91;
    font-size: 24px;
}

.dx-step-wrap ol li:nth-of-type(1) .dx-step-title::after {
    color: #002b55;
    /* 1つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(2) .dx-step-title::after {
    color: #002b55;
    /* 2つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(3) .dx-step-title::after {
    color: #fff;
    /* 3つ目の色 */
}

.dx-step-wrap ol li:nth-of-type(4) .dx-step-title::after {
    color: #fff;
    /* 3つ目の色 */
}

.dx-step-title,
.dx-step-body,
.dx-step-link {
    margin-left: 120px;
    /* 円のサイズ + 少し余裕を持たせる */
}

.dx-step-wrap {
line-height: 2;
}

.dx-step-link {
line-height: 1.5;
margin-bottom: 1em;
}

.dx-step-wrap ul.dx-step-body li {
    position: relative;
    /* 相対位置を指定 */
    padding-left: 20px;
    /* テキストと点の間に余白を作成 */
}

.dx-step-wrap ul.dx-step-body li::before {
    content: "•";
    /* 自分で点を追加 */
    position: absolute;
    left: 0;
    /* 点を左に揃える */
    color: #333;
    /* 点の色を指定 */
}





@media screen and (max-width: 450px) {

    .dx-step-wrap {
        /* margin: auto 15px auto 10px;
   */

        width: 85%;
        margin: 0 auto;
    }

    .dx-step-wrap img {
        width: 90%;
    }

    .dx-step-wrap ol>li::before {
        width: 70px;
        /* 外円のサイズ */
        height: 70px;
        /* 外円のサイズ */
        top: -5px;
        /* 外円の位置を調整 */
        left: -5px;
        /* 外円を元の位置に配置 */
        z-index: -1;
        box-sizing: border-box;
        /* ボックスサイズを含める */
        background-color: #fff;
    }

    .dx-step-wrap ol>li .step-circle {
        width: 60px;
        height: 60px;
        top: 0;
        left: 0;
    }

    .dx-step-wrap ol li .dx-step-title::before {
        content: "STEP";
        top: 10px;
        left: 10px;
        font-size: 14px;
    }

    .dx-step-wrap ol li .dx-step-title::after {
        top: 27px;
        left: 20px;
        font-size: 14px;
    }

    .dx-step-wrap ol>li.step01::after,
    .dx-step-wrap ol>li.step02::after,
    .dx-step-wrap ol>li.step03::after,
    .dx-step-wrap ol>li.step04::after {
        width: 3px;
        height: 100%;
        top: 65px;
        left: 28px;
        z-index: -1;
    }

    .dx-step-title,
    .dx-step-body,
    .dx-step-link {
        margin-left: 75px;
    }
    .dx-step-link {
        margin-bottom: 10px;
        line-height: 1.6;
    }



    .dx-step-body li{
        margin-bottom: 10px;
    }
    .dx-step-body {
        margin-bottom: 20px;
    }

    .dx-step-title {
        font-weight: bold;
        font-size: 16px;
        margin-bottom: 5px;
    }

    .dx-step-wrap ol>li {
        margin-bottom: 35px;
        /* 既存のスタイルを維持 */
    }

    .dx-step-wrap ul.dx-step-body li {
        padding-left: 10px;
    }
}

/* 4STEP end */


/*  */


/* 研修の表 */

#dx-title03 .width90 {
    margin-bottom: 20px;
}

.bg_blue01_y {
    width: 13%;
}

.bg_blue02_y {
    width: 26%;
}

.bg_blue03_y {
    width: 61%;
}

.scroll-box .width94 {
    margin-bottom: 15px;
}



.scroll-box {
    overflow-x: auto;
    padding-bottom: 10px;
    -webkit-overflow-scrolling: touch;
}

/*スクロールバー全体の高さ*/

.scroll-box::-webkit-scrollbar {
    height: 4px;
}

/*スクロールバー全体の背景*/

.scroll-box::-webkit-scrollbar-track {
    background: #eee;
}

/*スクロールバーの動く部分*/

.scroll-box::-webkit-scrollbar-thumb {
    background: #aaa;
    border: none;
}

/*スクロールバーの動く部分のホバー（マウスオーバー）*/

.scroll-box::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/*行の色を変換(マウスオーバー)*/
.dx-tbl-tr_hover:hover td {
    background-color: #f0f0f0;
}

/* 表　ここから */
.dx_tbl {
    border-collapse: collapse;
    width: 720px;
    margin: 0 auto;
    margin-bottom: 40px;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: -0.06em;
}

.dx_tbl tr {
    height: 65px
}

.dx_tbl_head {
    height: 25px
}

.dx_tbl td {
    border: solid 3px #CEE9F2;
    vertical-align: middle;
}

.dx_tbl_bg_blue {
    background-color: #004e91;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-align: center
}

.dx_tbl_cols {
    width: 54.75px;
    line-height: 1.5em;
    text-align: center;
    background-color: #fff;
}

.dx_tbl_cols a {
    font-size: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 65px;
    text-decoration: none;
    color: #000
}


.dx_tbl_cols a:hover {
    text-decoration: none;
    color: #00bfff;
}

.dx_tbl_cell {
    font-size: 20px;
    text-align: center;
    color: #004e91;
    background-color: #fff;
    font-weight: 700
}

.dx_tbl_expression {
    text-align: center;
    font-size: 10px;
    background-color: #fff;
}

.dx_tbl_target {
    text-align: center;
    vertical-align: middle;
}

/* 列固定してスクロール */
.fixed01 {
    position: sticky;
    left: 0;
    border: solid 3px #CEE9F2;
    background-color: #004e91;
    color: #fff;

    &:before {
        content: "";
        position: absolute;
        top: -1px;
        left: -1px;
        width: 100%;
        height: 100%;
    }
}

@media screen and (max-width: 450px) {

    .scroll-box::-webkit-scrollbar {
        height: 8px;
    }


}

/* 表 ここまで */


/* 一覧アコーディオン */

.accordion {
    margin: 0 auto;
}

.flex_y {
    display: flex;
}

.term-description {
    margin-left: 20px;
    margin-bottom: 20px;
}

.term {
    display: inline-block;
    /* インラインブロックにして幅を指定 */
    width: 5em;
    /* 幅を4emに設定 */
    text-align: center;
    /* 中央揃え */
    color: #fff;
    /* テキストの色 */
}

.term-description p {
    margin: 3px;
}

.term-description span {
    margin-right: 5px;
}

.term-description .flex_y p {
    margin-bottom: 0;
    margin-right: 10px;
}

.term-description a {
    margin-right: 5px;
}


/* 各termに異なる色を設定 */
.term1 {
    background-color: crimson;
}

.term2 {
    background-color: #8e6301;
}

.term3 {
    background-color: #ed6d00;
}

.term4 {
    background-color: #0f71c1;
}

.term5 {
    background-color: #c9202d;
}



/* アコーディオンメニューここから */
.accordion {
    width: 100%;
    margin-bottom: 80px;
}

.accordion h3 {
    margin-top: 40px;
}

.p_lineupBoxList_item a:hover {
    opacity: 0.7;
    cursor: pointer;
}

/* inputのチェックボックスを非表示 */
.accordion-hidden {
    display: none;
}

/* 見出しボタン部分 */
.accordion-open {
    display: block;
    padding: 10px 60px 10px 10px;
    background: #cecece;
    cursor: pointer;
    margin: 5px 15px 5px 15px;
    position: relative;
    font-size: 20px;
    color: #333;
}

/* ＋アイコン */
.accordion-open::before,
.accordion-open::after {
    content: '';
    width: 20px;
    height: 3px;
    background: #cecece;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    z-index: 2;
}

/* アイコンのー */
.accordion-open::after {
    transform: translateY(-50%) rotate(90deg);
    transition: .5s;
}

/* アコーディオンが開いたらーに */
.accordion-hidden:checked+.accordion-open:after {
    transform: translateY(-50%) rotate(0);
}

.accordion-open span {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    background: #fff;
    border-radius: 50%;
    z-index: 1;
}

/* アコーディオン中身部分 */
.accordion-inner {
    display: block;
    height: 0;
    overflow: hidden;
    padding: 0;
    opacity: 0;
    transition: 0.5s;
    /* 表示速度の設定 */
    cursor: pointer;
}

/* チェックボックスにチェックが入ったら中身部分を表示する */
.accordion-hidden:checked+.accordion-open+.accordion-inner {
    height: auto;
    opacity: 1;
    padding: 10px;
}

@media screen and (max-width: 450px) {
    .accordion-open {
        padding: 10px 40px 10px 10px;
        font-size: 14px;
        margin: 5px;
    }

    .accordion-open span {
        top: 6px;
    }

    .term-description {
        font-size: 12px
    }

    .term-description .flex_y {
        display: block;
    }

    li.p_lineupBoxList_item {
        margin-top: 20px;
    }

    li.p_lineupBoxList_item:last-child {
        margin-bottom: 20px;
    }

    .term-description {
        margin: 15px;
    }

    ul.p_lineupBoxList {
        margin: 0;
    }

    .accordion-hidden:checked+.accordion-open+.accordion-inner {
        padding: 0;

    }

    .accordion-inner {
        width: 90%;
        margin: auto;
    }
}

/* アコーディオンメニューここまで　*/



/* ボトムカテゴリアイコン */
.p_lineupBoxList {
    margin: 0 5px 5px
}

.p_heading+.p_lineupBoxList {
    margin: 0 0 10px
}

.p_lineupBoxList_item {
    margin-top: 4px
}

.p_heading+.p_lineupBoxList .p_lineupBoxList_item {
    margin-top: 4px
}

.p_lineupBoxList_item a {
    display: inline-block;
    /* color: #333; */
    position: relative;
    padding-left: 67px;
    line-height: 2;
    text-decoration: none;
}

.p_lineupBoxList_item a::before {
    content: "\6D3E\9063";
    display: inline-block;
    margin-right: 4px;
    padding: 3px 0;
    background: #c9202d;
    line-height: 1;
    color: #fff;
    font-size: 13px;
    min-width: 60px;
    text-align: center;
    position: absolute;
    top: 3px;
    left: 0
}

.p_lineupBoxList_item a[href*="/bup/"]::before,
.p_lineupBoxList_item a[href*="/nmp/"]::before,
.p_lineupBoxList_item a[href*="/hia/"]::before,
.p_lineupBoxList_item a[href*="/nbs/"]::before,
.p_lineupBoxList_item a[href*="/kkk/"]::before,
.p_lineupBoxList_item a[href*="/psp/"]::before,
.p_lineupBoxList_item a[href*="/biz-lesson/"]::before,
.p_lineupBoxList_item a[href*="/gtc/"]::before,
.p_lineupBoxList_item a[href*="/toac/"]::before,
.p_lineupBoxList_item a[href*="/crl/"]::before,
.p_lineupBoxList_item a[href*="/ctc/"]::before,
.p_lineupBoxList_item a[href*="/ogs/"]::before,
.p_lineupBoxList_item a[href*="/kkg/"]::before,
.p_lineupBoxList_item a[href*="/efl/"]::before,
.p_lineupBoxList_item a[href*="/imp/"]::before,
.p_lineupBoxList_item a[href*="/neu/"]::before,
.p_lineupBoxList_item a[href*="/tnc/"]::before,
.p_lineupBoxList_item a[href*="/iln/"]::before {
    content: "\516C\958B";
    background: #0f71c1
}

.p_lineupBoxList_item a[href*="/kiyo/"]::before,
.p_lineupBoxList_item a[href*="/movie/"]::before,
.p_lineupBoxList_item a[href*="/dougahyakkaten/"]::before,
.p_lineupBoxList_item a[href^="/hia_e/"]::before,
.p_lineupBoxList_item a[href^="/kkg/KKe"]::before,
.p_lineupBoxList_item a[href^="/kkg/KKm"]::before,
.p_lineupBoxList_item a[href^="/nco/"]::before,
.p_lineupBoxList_item a[href^="/ina/"]::before {
    content: "e\30E9\30F3";
    background: #e23f7c
}

.p_lineupBoxList_item a[href*="/it-tool/"]::before {
    content: "IT\FF7B\FF70\FF8B\FF9E\FF7D";
    background: #00c77f
}

.p_lineupBoxList_item a[href*="/ucn/"]::before {
    content: "\901A\4FE1\6559\80B2";
    background: #8e6301
}

.p_lineupBoxList_item a[href*="/consulting/"]::before {
    content: "\30b3\30f3\30b5\30eb";
    background: #6e4a26
}

.p_lineupBoxList_item a[href*="/seminar/"]::before {
    content: "\30BB\30DF\30CA\30FC";
    background: #0b1a6f
}

.p_lineupBoxList_item a[href*="/video-slide-sale/"]::before,
.p_lineupBoxList_item a[href$="/contents/ins_compliance.html"]::before,
.p_lineupBoxList_item a[href*="/book_dvd/"]::before {
    content: "\6559\6750";
    background: #517cf1
}

.p_lineupBoxList_item a[href$="/shinjin/bunsyo-text_sales.html"]::before,
.p_lineupBoxList_item a[href$="/shinjin/text_sales.html"]::before {
    content: "\30C6\30AD\30B9\30C8";
    background: crimson
}

.p_lineupBoxList_item a[href$="/service/course/plan_businessdept.html"]::before,
.p_lineupBoxList_item a[href$="/service/course/plan_itdept.html"]::before,
.p_lineupBoxList_item a[href$="/service/course/plan_techdept.html"]::before {
    content: "所属別";
    background: crimson
}

.p_lineupBoxList_item a[href*="/video-slide-production/"]::before {
    content: "\6559\6750\5236\4F5C";
    background: #f54b1a
}

.p_lineupBoxList_item a[href*="/nbpm/dvd"]::before,
.p_lineupBoxList_item a[href$="/book_dvd/harasment_dvd.html"]::before,
.p_lineupBoxList_item a[href$="/contents/ins_compliance.html"]::before,
.p_lineupBoxList_item a[href$="/book_dvd/koumuin_rinri.html"]::before {
    content: "DVD";
    background: #517cf1
}

.p_lineupBoxList_item a[href*="/cleativeln/"]::before,
.p_lineupBoxList_item a[href*="/comu_design/"]::before,
.p_lineupBoxList_item a[href*="www.mitemo.co.jp"]::before {
    content: "ＷＳ";
    background: #ed6d00
}

.p_lineupBoxList_item a[href*="/contents/"]::before,
.p_lineupBoxList_item a[href*="/kataru/"]::before,
.p_lineupBoxList_item a[href*="/keywords/"]::before,
.p_lineupBoxList_item a[href*="/hatara-column/"]::before,
.p_lineupBoxList_item a[href*="/3minute-kensyugaku/"]::before,
.p_lineupBoxList_item a[href*="/ginko-no-"]::before,
.p_lineupBoxList_item a[href*="/month-inquiry/"]::before,
.p_lineupBoxList_item a[href*="/ranking/"]::before,
.p_lineupBoxList_item a[href*="/training-memoirs/"]::before,
.p_lineupBoxList_item a[href*="/interview-relay/"]::before,
.p_lineupBoxList_item a[href*="/mailmagazine/"]::before,
.p_lineupBoxList_item a[href*="/businessbunsho/"]::before,
.p_lineupBoxList_item a[href*="/edusolution/"]::before,
.p_lineupBoxList_item a[href*="/gam-batte/"]::before {
    content: "\8AAD\307F\7269";
    background: #00774e
}

.p_lineupBoxList_item a[href*="/online/"]::before {
    content: "online";
    background: #5558af
}

.p_lineupBoxList_item a[href*="/package/"]::before {
    content: "\30D7\30E9\30F3";
    background: #6e4a26;
    color: #fff
}

.p_lineupBoxList_item a[service_type=jirei]::before {
    content: "\4E8B\4F8B";
    background: #333
}

.p_lineupBoxList_item a[service_type=other]::before {
    content: none
}

/* ボトムアイコン end*/

/* 研修一覧のところはここまで */

/* 241129　DX関連サービス*/
.dx-title05{
margin-bottom: 80px;
}
.dx-title05 > p{
margin-bottom: 20px;
}
/*.dx-about-ky .dx-title05  h3::after{
display: none;
}*/
.dx_service--consulting{
max-width: 688px;
margin: 0 auto 20px;
border-radius: 10px;
}
.dx_service--assessment{
max-width: 688px;
margin: 0 auto;
border-radius: 10px;
}
.dx_service--consulting .service__title,
.dx_service--assessment .service__title{
font-size:16px;
margin-bottom:10px
}
.dx_service--consulting h3,
.dx_service--assessment h3{
margin-bottom: 10px;
font-size: 18px;
color:#707070;
text-align: left;
}
.dx_service--consulting a,
.dx_service--assessment a{
width: 100%;
display: flex;
justify-content: flex-start;
align-items:flex-start ;
flex-wrap:wrap;
padding: 20px;
background: #F6F8F9;
text-decoration: none;
}
.dx_service--consulting .image,
.dx_service--assessment .image{
max-width: 160px;
width: 100%;
height: auto;
margin-bottom:0;
padding: 0;
object-fit: contain;
}
.dx_service--consulting .text_box{
max-width: 440px;
margin-left: 20px;
padding: 0;
color:#333;
line-height: 2;
}
.dx_service--assessment .text_box{
max-width: 480px;
margin-left: 20px;
padding: 0;
color:#333;
line-height: 2;    
}
.dx_service--consulting .text_box h4,
.dx_service--assessment .text_box h4{
font-size: 16px;
font-weight: bold;
letter-spacing: normal;
}
.dx_service--assessment .text_box p{
max-width: 460px;
}
@media screen and (max-width: 730px) {
    .dx_service--consulting a,
    .dx_service--assessment a{
        flex-direction: column;
        align-items: center;
        row-gap: 10px;
    }
    .dx_service--consulting .text_box{
        margin: 0 auto;
    }
}

/* よくあるご質問 */
.dx-title04 {
    width: 95%;
    margin: 0 auto;
    line-height: 2;
}

.dx-title04-inner2 {
    display: flex;
    align-items: flex-start;
    /* 上揃え */
    margin-bottom: 20px;
}

.dx-title04-inner2:last-child {
    margin-bottom: 10px; /* 最後の要素のマージンボトムを10pxに設定 */
}

.dx-title04-inner1 {
    margin-bottom: 10px;
    align-items: center;
}



.boxQ,
.boxA {
    font-size: 24px;
    font-weight: bold;
    color: #fff;
    display: inline-block;
    /* インラインブロックにして幅を指定 */
    width: 40px;
    height: 40px;
    text-align: center;
    /* 中央揃え */
    min-width: 40px;
    margin-right: 10px;
line-height:1.5;
    }


.boxQ {
    background-color: #35A3C8;
}

.boxA {
    background-color: #FA8589;
}

/* dx-seminar */
.dx-seminar {
    background-image: url("../img/middle/dx_about/dx-seminar-bg.jpg");
    background-repeat: repeat;
    background-position: center;
    background-size: cover;
    width: 100%;
    padding: 70px 0;
}

.dx-seminar ul {
    max-width: 625px;
    margin: 0 auto;
}

.dx-seminar h2 {
    margin-bottom: 20px;
    font-size: 28px;
    font-weight: bold;
    text-align: center;
}

.dx-seminar p {
    font-size: 14px;
    font-weight: bold;
}

.dx-seminar-sp {
    display: block;
}

.dx-seminar h3 {
    position: relative;
    margin: 30px auto;
    padding: 5px 0;
    width: 240px;
    display: block;
    font-size: 20px;
    color: #fff;
    text-align: center;
    background-color: #FA8589;
    border-radius: 10px;
}

.dx-seminar h3::after {
    content: "";
    position: absolute;
    left: 45%;
    bottom: -50px;
    width: 0px;
    height: 0px;
    margin-right: 5px;
    padding-bottom: 5px;
    display: inline-block;
    border-right: 14px solid transparent;
    border-bottom: 20px solid #FA8589;
    border-left: 14px solid transparent;
    transform: rotate(180deg);
    background-color: transparent;
}

.dx-seminar-image {
    text-align: center;
}

.dx-seminar-image a:hover {
    opacity: 0.7;
}

@media screen and (max-width: 450px) {
    .dx-seminar h2 {
        font-size: 16px;
        padding: 0 20px;
    }

    .dx-seminar-sp {
        display: none;
    }

    .dx-seminar p {
        margin: 0;
        text-align: center;
        padding: 0 20px;
    }

    .dx-title04-wrap {
        width: 85%;
        margin: 0 auto;
        line-height: 1.8;
    }

    .dx-title04 {
        width: 100%;
    }

.boxA {
    line-height: 38px;
}

.boxQ {
    line-height: 35px;
}

}