@charset "UTF-8";

/*dl_3block*/
.dl_3block .flexset {
    align-items: flex-start;
    justify-content: space-between;
}

.dl_3block .col3_m_321 {
    row-gap: 0px;
}

.dl_3block .col {
    display: flex;
    flex-direction: column;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    padding: 20px;
}

@media only screen and (max-width: 979px) {
    .dl_3block .col3_m_321 {
        margin-top: -20px;
    }

    .dl_3block .col {
        margin-top: 20px;
    }
}

.dl_3block .alignmentTitle {
    /*margin-left: 0;*/
    margin-left: auto;
    margin-right: auto;
}

.dl_3block .colLtxt {
    font-weight: 500;
}

@media only screen and (max-width: 690px) {
    .dl_3block .col {
        padding: 10px;
    }
}

.dl_3block .col figure,
.dl_3block .col h2,
.dl_3block .col .dl-p {
    display: flex;

}

.dl_3block .col figure {
    justify-content: center;
}

.dl_3block .dlb_btn_blue {
    margin-top: auto;

}

.dl_3block .col h2 {
    margin: 2rem 0;
}

.dl_3block .col figure a img {
    max-height: 350px;
    object-fit: contain;
}
.dl_3block a.col figure img {
    object-fit: contain;
    width: 100%;
    height: 100%;
}
.dl_3block .dlb_btn_blue a {
    height: 60px;
    border-radius: 5px;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.38);
}

/*df_3block*/
.df_3block {
    margin: 0px 0 100px;
}

.df_3block.m20 {
    margin-bottom: 20px;
}

.df_3block .alignmentBtn a {
    position: relative;
    width: 100%;
    box-sizing: border-box;
    font-size: 2.4rem;
    padding: 2rem 3rem 2rem 0;
    transition: all .2s ease 0s;
}

.df_3block .alignmentBtn a::after {
    content: "";
    position: absolute;
    height: 50px;
    width: 50px;
    top: initial;
    border-top: initial;
    border-right: initial;
    transform: initial;
    background-image: url(/dcms_media/image/Icon_material-cloud-download.png) !important;
    background-size: 50px 35px;
    background-repeat: no-repeat;
    background-position: center;
    right: initial;
    margin-left: 3rem;
}

.df_3block .alignmentBtn a::before {
    content: none;
}

@media only screen and (max-width: 690px) {
    .df_3block .alignmentBtn a {
        padding: 1.6rem 3rem 1.6rem 0px;
        font-size: 1.6rem;
    }

    .df_3block .alignmentBtn a::after {

        height: 30px;
        width: 30px;

        background-size: contain;
    }

}



.df_3block .alignmentBtn a:hover {
    opacity: .8;
}

/*lineup-movie*/
.lineup-movie iframe {
    display: block;
    margin: 0 auto;
}

@media only screen and (max-width: 800px) {
    .lineup-movie iframe {
        width: 100%;
        height: 300px;
    }
}

/*dl_form-y-bk*/
.dl_form-y-bk {
    background-color: #FFF2CC;
    padding: 10px;
}

.dl_form-y-bk ol {
    padding-left: 20px;
}

.dl_form-y-bk h3 {
    background-color: #FFF2CC;
}

#usefulA {
    margin: 100px 0;
}

.alignmentBtn.sp {
    display: none;
}

@media only screen and (max-width: 979px) {
    #usefulA {
        margin: 60px 0;
    }

    .df_3block {
        margin-bottom: 60px;
    }

    #usefulA .alignmentBtn {
        display: none;
    }

    #usefulA .alignmentBtn.sp {
        display: block;
        margin-top: 30px;
    }
}

@media only screen and (max-width: 690px) {
    #usefulA {
        margin: 40px 0;
    }

    .df_3block {
        margin-bottom: 40px;
    }

    #usefulA .alignmentBtn a {
        padding-left: 3em;
    }


}
.bownow_content
{
    padding: 40px;
    border:1px solid #CED4DA;
}
@media only screen and (max-width: 690px) {
    .bownow_content {
        margin-top: 40px;
        padding: 20px;
    }
}

@media only screen and (min-width: 691px) {
    #bownow_2column .col:not(.bownow_content) {
        padding-right: 60px;
    }
}


@media screen and (max-width: 979.8px) {
    .page_comparison .p-casesol02 {
        padding-top: 30px;
        padding-bottom: 80px;
    }
}
@media screen and (max-width: 679.8px) {
    .page_comparison .p-casesol02 {
      padding-top: 20px;
      padding-bottom: 60px;
    }
  }


  #usefulA .alignmentTitle {
    color: #333333;
    transition: all 0.6s;
    font-size: 18px;
  }
  #usefulA a.col:hover {
    border-color: #358FDD;
  }
  #usefulA a.col:hover .alignmentTitle {
    color:#358FDD;
  }


  @media only screen and (max-width: 690px) {
    #lineupA{
      padding-top: 30px;
      padding-bottom: 50px;
    }
  }

.p-tpcheck {
    padding-top:16px;
    padding-bottom: 16px;
}
.p-tpcheck .inner {
    box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.16);
    padding:24px;
}
.p-tpcheck__box {
    padding-bottom: 10px;
    padding-right: 380px;
}
@media screen and (max-width: 1024px) {
    .p-tpcheck__box {
        padding-right: 260px;
    }
}
@media screen and (max-width: 768px) {
    .p-tpcheck__box {
        padding-right: 0;
        padding-bottom: 30px;
    }
}
@media screen and (max-width: 680px) {
    .p-tpcheck__box {
        padding-bottom: 75px;
    }
}

.p-tpcheck__box:before {
    max-width: 314px;
    bottom:-24px;
    background-image: url(../image/p-tpcheck-bg-img01.png);
}

@media screen and (max-width: 1024px) {
    .p-tpcheck__box:before {
        max-width: 250px;
    }
}
@media screen and (max-width: 768px) {
    .p-tpcheck__box:before {
        max-width: 220px;
    }
}
@media screen and (max-width: 680px) {
    .p-tpcheck__box:before {
        max-width: 120px;
    }
}

.p-tpcheck h2 {
    color:#358FDD;
    margin-bottom: 20px;
}
.p-tpcheck h3 {
    margin-bottom: 20px;
}


.dl_3block .col:nth-child(n+4) {
    margin-top: 40px;
} 

@media only screen and (max-width: 979px) {
    .dl_3block .col:nth-child(n+3) {
        margin-top: 40px;
    }
}

@media only screen and (max-width: 690px) {
    .dl_3block .col:nth-child(n+2) {
        margin-top: 20px;
    }
}