strong.period{
    font-size: 1.2em;
}
    
dl dt {
    font-weight: bold;
}

dl dd {
    margin-left: 0;
}

.replace-mod-headingLv3 {
    margin: 0;
    color: #fff;
    background: #666;
    padding: 6px 10px 4px;
  }
.replace-mod-headingLv3 h3{
    font-size: 16px;
    line-height: 1.25;
    margin: 0;
    font-weight: normal;
}
.replace-mod-paragraph{
    margin: 10px 0;
}

.replace-mod-paragraph02{
    margin: 40px 0;
}

.replace-mod-paragraph-center{
    text-align: center;    
}

@media screen and (max-width: 768px) {
    strong.period{
    font-size: 1em;
}
}

.replace-mar-to30{margin-top: 30px;}
.replace-mar-to50{margin-top: 50px;}
.replace-mar-ri30{margin-right: 30px;}
.replace-mar-ri50{margin-right: 50px;}
.replace-mar-le30{margin-left: 30px;}
.replace-mar-le50{margin-left: 50px;}
.replace-mar-bo30{margin-bottom: 30px;}
.replace-mar-bo50{margin-bottom: 50px;}

.replace-red{
    color: #C7161D;
}

/*///////////////////　メイン画像　///////////////////*/

.replace-img{
    margin: 40px 0;
}
.main-image{
    display: flex;
    width: auto;
    max-width: 1052px;
}

.replace-img img{
    width: auto;
    max-width: 100%;
}

.change-img-sp {
    display: none;
}
.change-img-sp-btn {
    display: none;
}
.change-img-sp01 {
    display: none;
}

/*///////////////////　h2title　///////////////////*/
h2.replace-h2tit{
    background-color: #3697D4;
    text-align: center;
    font-size: 20px;
    margin: 100px 0 50px 0;
    padding: 20px 0;
    color: #FFF;
}

/*///////////////////　こんなイメージありませんか　///////////////////*/

.whatimg-img{
    display: flex;
    margin:0 30px;
}


.speedio-line-up{
    font-size: 22px;
    font-weight: bold;
    margin: 50px 0 30px 0;
    width: 100%;
    text-align: center;
}

.speedio_lineup{
    display: flex;
}
.speedio_lineup div{
    width: 100%;
    color: #004999;
    font-size: 20px;
    font-weight: bold;
    background-color: #DCE8F6;
    border-radius: 10px;
    text-align: center;
    margin: 0 15px;
    padding: 10px;
}

.lineup-img{
    margin: 30px 0 100px 0;
    width: 100%;
    text-align: center;
}



/*///////////////////　SPEEDIOおすすめ製品　///////////////////*/

.recommend-item{
    display: flex;
    align-items:center;
    margin: 0 30px 30px 30px;
}

.recommend-item02{
    display: flex;
    align-items:center;
    margin:50px 30px 30px 30px;
}

.recommend-item .catch,
.recommend-item02 .catch{
    padding: 10px 0;
    text-align: center;
    background-color:#DCE8F6;
    border-radius:10px;
    color: #004999;
    font-weight: bold;
    font-size: 20px;
    width: 30%;
}

.recommend-item .title,
.recommend-item02 .title{
    color: #333333;
    font-weight: bold;
    font-size: 20px;
    margin-left: 20px;
    border-bottom: 1px solid #333333;
    padding: 10px 0;
    width: 70%;
}

.recommend-item-sub-catch{
    font-size: 20px;
    color: #004999;
    font-weight: bold;
    margin: 0 30px 0 60px;
    border-bottom: #004898 1px solid;
}

.recommend-item-sub-catch02{
    font-size: 20px;
    color: #004999;
    font-weight: bold;
    margin: 30px 30px 0 60px;
    border-bottom: #004898 1px solid;
}

.recommend-item-body{
    display: flex;
    align-items:start;
    margin: 30px 60px 0 60px;
}

.recommend-item-body02{
    display: flex;
    align-items:start;
    margin: 50px 60px 0 60px;
}


.recommend-item-body-item{
    border-left: 8px solid #3697D4;
    background-color: #DCE8F6;
}

.recommend-item-body-copy{
    background-color: #FFF;
    margin: 0 0 0 14px;
    padding-left: 10px;
    font-size: 14px;
}

.recommend-item-body-copy span{
    font-weight: bold;
    margin-bottom: 20px;
    display: block;
}

.recommend-item-img{
    width: 80%;
    text-align: right;
}

.recommend-item-movie{
    background-color:#DCE8F6 ;
    text-align: center;
    padding: 10px;
    margin: 30px 30px 0 30px;
}

.more-machine01{
    display: flex;
    align-items:center;
    justify-content: center;
    margin: 50px 0 0 0;
}


.more-machine02{
    font-size: 22px;
    text-align: center;
    font-weight: bold;
    margin: 0 30px;
}

.mov-iflame{
    width: 448px;
    height: 252px;
}


/*///////////////////SPEEDIOへの買い替えによるメリット///////////////////*/

.speedio_merit3{
    display: flex;
}
.speedio_merit3 div.merit3_det{
    width: 100%;
    background-color: #DCE8F6;
    border-radius: 10px;
    text-align: center;
    margin: 0 30px;
}

.merit3_det p{
    width: 100%;
    margin: 0;
    padding: 20px 0;
    color: #004999;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    background-image : linear-gradient(to right, #999 6px, transparent 6px);
    background-size: 10px 2px;
    background-repeat: repeat-x; 
    background-position: left bottom;
}
.merit3_det div{
    margin: 30px 0;
}

.merit-arrow{
    margin: 10px 0;
    width: 100%;
    text-align: center;
}

.merit-summary{
    background-color: #DCE8F6;
    margin: 0 30px;
    padding: 30px;
    border-radius: 10px;
}

.merit-summary .merit-copy01{
    font-size: 18px;
    font-weight: bold;
    color: #004999;
    text-align: center;
    margin-bottom: 30px;
}

.merit-bg-w{
    background-color: #FFF;
}

.production-volume{
    background-color: #CCCCCC;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 0;
}

.merit-table{
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
}

.table-explanation{
    display: flex;
    margin-top: 10px;
}
.table-explanation02{
    font-size: 12px;
    width: 100%
}

.merit-summary .merit-copy02{
    font-size: 18px;
    font-weight: bold;
    color: #004999;
    text-align: center;
    margin:30px 0 10px 0;
}

.table-box{
    -webkit-box-sizing: border-box; /* 古いWebkit系用 */
    -moz-box-sizing: border-box;     /* 古いFirefox用 */
    box-sizing: border-box;
    padding: 20px;
    width: 100%;
}
table.blue-merit{
    width: 100%;
    border-collapse: collapse;
    border: solid 1px #999;
}
table.blue-merit td{
    border: solid 1px #333;
    text-align: center;
    vertical-align:middle;
    font-size: 20px;
    font-weight: bold;
}
table.blue-merit th{
    border: solid 1px #333;
    text-align: center;
    vertical-align:middle;
    background-color: #E7E7E7;
    font-size: 18px;
    padding: 20px 0;
}
.result-gradient{
    background: linear-gradient(to right, #004898, #379FDA);
    color: #FFF;
}
.result-gray{
    color: #666;
}
.result-blue{
    color: #004999;
}
.result-min{
    font-size: 14px;
}



/*///////////////////SPEEDIOのサポート体制///////////////////*/

.replace-support{
    padding: 10px 30px;
    text-align: center;
    background-color:#DCE8F6;
    border-radius:10px;
    color: #004999;
    font-weight: bold;
    font-size: 20px;
    width: fit-content;
}
.replace-support-chach{
    font-size: 20px;
    color: #3697D4;
    font-weight: bold;
    margin: 20px 60px;
}
.replace-support-copy{
    font-size: 14px;
    color:#666;
    margin: 0px 60px 20px 60px;
}
.replace-support-img{
    margin-top:30px;
    width:100%;
    text-align: center;
}

.replace-application-process{
    display: flex;
    margin: 50px 30px 0 30px;
    justify-content:center;
    align-items:stretch;
}
.replace-application-process .box{
    width: 28%;
    background-color: #EEEEEE;
    padding: 10px;
}
.replace-application-process .arrow{
    width: 8%;
    text-align: center;
    height: 100%;
    margin: auto;
}
.replace-application-process .box-title{
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    color: #666;
}
.replace-application-process .box-copy{
    font-size: 16px;
    color: #666;
}

.replace-hanbaiten{
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    color: #666;
    margin: 30px 30px 0 30px;
    padding: 20px;
    border: 1px solid #CCC;
}

/*///////////////////ボタン　ロールover対応///////////////////*/

.replace-btnImg01:hover {
    content: url("../img/main-btn01-over.png");
}
.replace-btnImg01-sp:hover {
    content: url("../img/main-btn01-sp-over.png");
}
.replace-btnImg01-sp01:hover {
    content: url("../img/main-btn01-sp02-over.png");
}
.replace-btnImg02:hover {
    content: url("../img/main-btn02-over.png");
}
.replace-btnImg02-sp:hover {
    content: url("../img/main-btn02-sp-over.png");
}
.replace-btnImg02-sp02:hover {
    content: url("../img/main-btn02-sp02-over.png");
}

.replace-btn:hover,
.replace-btn:focus {
    opacity: 1;
  }

/*///////////////////レスポンシブ対応///////////////////*/

.replace-application-button img,
.more-machine01 img,
.recommend-item-img img,
.lineup-img img,
.whatimg-img img,
.merit3_det img,
.merit-arrow img,
.table-explanation02 img,
.replace-support-img img,
.replace-application-process img{
    width: auto;
    max-width: 100%;
}

@media screen and (max-width: 768px) {
    .main-image{
        display: block;
    }
    .whatimg-img{
        display: block;
        text-align: center;
        margin:0;
    }
    .whatimg-img div{
        margin:0 0 30px 0;
    }

    h2.replace-h2tit{
        font-size: 18px;
    }

    .speedio-line-up{
        font-size: 18px;
        margin: 50px 0 30px 0;
        width: 100%;
    }

    .speedio_lineup div{
        font-size: 18px;
    }

    .recommend-item-body{
        display: block;
    }
    .recommend-item-body02{
        display: block;
    }
    .replace-application-process{
        display: block;
        text-align: center;
    }
    .replace-application-process .box,
    .replace-application-process .arrow{
        width: 100%;
    }
    .replace-application-process .arrow .arrow-rotation{
        rotate: 90deg;
        margin: 15px auto;
    }


    .recommend-item-img{
        width: 100%;
        margin: 30px 0 0 0;
        text-align: center;
    }

    .recommend-item .catch,
    .recommend-item02 .catch,
    .recommend-item .title,
    .recommend-item02 .title{
        font-size: 16px;
    }

    .recommend-item-body-copy{
        font-size: 12px;
    }

    .more-machine02{
        font-size: 18px;
    }

    .speedio_merit3{
        display: block;
    }
    .speedio_merit3 div.merit3_det{
        width: 80%;
        margin: 0 auto;
    }
    
    .merit3_det p{
        font-size: 18px;
    }
    .merit3_det div{
        margin: 30px 0 ;
        padding-bottom: 30px;
    }
    .replace-application-process .box-title{
        font-size: 14px;
    }
    .replace-application-process .box-copy{
        font-size: 12px;
    }
    .merit-summary .merit-copy01{
        font-size: 14px;
    }
    table.blue-merit td{
        font-size: 16px;
    }
    table.blue-merit th{
        font-size: 14px;
    }
    .result-min{
        font-size: 10px;
    }
    .merit-summary .merit-copy02{
        font-size: 14px;
    }
    .change-img-pc {
        display: none;
    }
    .change-img-sp{
        display: inline;
    }
    .change-img-sp-btn {
        display: inline;
    }
    .replace-support-img img.replace-support-img-call{
        width: 300px;
    }
}

@media screen and (max-width: 552px) {
    .recommend-item-movie{
        margin: 30px 0 0 0;
    }
    .mov-iflame{
        width: 336px;
        height: 189px;
    }
    h2.replace-h2tit,
    .speedio-line-up{
        font-size: 17px;
    }
    .speedio_lineup div{
        font-size: 12px;
        font-weight: bold;
    }
    .recommend-item,
    .recommend-item02{
        margin-left: 10px;
        margin-right: 10px;
    }
    .recommend-item .catch,
    .recommend-item02 .catch,
    .recommend-item .title,
    .recommend-item02 .title,
    .recommend-item-sub-catch,
    .more-machine02,
    .merit3_det p,
    .replace-support,
    .replace-support-chach,
    .replace-hanbaiten{
        font-size: 14px;
    }
    .recommend-item .title,
    .recommend-item02 .title{
        margin-left: 10px;
    }
    .recommend-item-sub-catch{
        margin: 0 30px;
    }
    .recommend-item-body,
    .recommend-item-body02{
        margin-left: 30px;
        margin-right: 30px;
    }
    .more-machine02{
        margin: 0 10px;
    }
    .replace-support-copy{
        font-size: 12px;
    }
    .replace-support{
        margin-left: 10px;
    }
    .replace-support-chach,
    .replace-support-copy{
        margin: 30px 10px;
    }
    .speedio_merit3 div.merit3_det{
        width: 100%;
        margin: 0;
}
    .merit-summary{
        margin: 0;
        padding: 0;
    }
    .blue-merit img{
        width: 75px;
    }
    table.blue-merit th,
    table.blue-merit td{
        font-size: 12px;
    }
    .table-explanation{
        display: block;
    }
    .table-explanation02,
    .merit-copy01{
        margin-left: 10px;
        margin-right: 10px;
    }
    .merit-copy02{
        padding: 0 10px;
    }
    .change-img-sp-btn {
        display: none;
    }
    .change-img-sp01 {
        display: inline;
    }
}