/* 機器詳細ページ */
.device-article {
    display: flex;
    justify-content: center;
}
.device-article-fv {
    width: 80%;
}
.device-article-sp {
    display: none;
}

.device-article-pc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8rem
    ;
}

.device-article .device-wide-fv-left {
    width: 40%;
    text-align: center;
}

.device-article .device-article-fv-right {
    text-align: left;
    width: 55%;
}

.device-article .pc-wide-img {
    max-width: 500px;
    width: 100%;
    margin: 0 auto;
}
.device-article .pc-wide-img img, .device-article .pc-long-img img {
    margin: 0 auto;
}

.device-article .label p:first-child, .device-article 
.label p:not(:first-child) {
    flex: initial;
}

.device-article-fv-right .label {
    justify-content: left;
    margin: 0;
    gap: 2.4rem;
    max-width: 100%;
    padding: 2.4rem 0;
}

.device-article-fv-right .label p {
    width: calc(45% - 1rem); /* gapの半分を引いて2列に */
}

.device-article-fv-right .text {
    margin-top: 2.4rem;
}


/* 主な特徴 */
.device-feature {
    width: 80%;
}

.device-feature-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 8rem 4rem;
    justify-content: center;
}

.device-feature-box {
    width: 20%;
    height: auto;
    border-radius: 10px;
}

.device-feature-box h3 {
    font-size: 2rem;
    font-weight: 700;
    padding: 2.4rem 0;
    background-color: #6285FC;
    color: white;
    border-radius: 10px 10px 0 0;
}

.device-feature-box p {
    font-size: 1.8rem;
    padding: 2.4rem 1.6rem;
}


/* レンタル料金 */
.price-table.sp {
    display: none;
}

.device-price {
    width: 80%;
}

.device-price table {
    border-collapse: separate;
    width: 80%;
    margin: 0 auto;
    font-size: 2rem;
    border-radius: 10px;
}

.price-table thead th {
    background-color: #6285FC;
    color: #fff;
    padding: 2.4rem 0;
    border: 1px solid #eee;
    font-weight: 700;
}

/* テーブルの左上丸めるため */
.price-table thead th:first-child {
    border-radius: 10px 0 0 0;
}
/* テーブルの右上丸めるため */
.price-table thead th:last-child {
    border-radius: 0 10px 0 0;
}


.price-table tbody td {
    padding: 2.4rem 0;
    border: 1px solid #eee;
    font-weight: bold;
}
/* テーブルの左下丸めるため */
.price-table.pc tbody td:first-child {
    border-radius: 0 0 0 10px;
}
/* テーブルの右下丸めるため */
.price-table.pc tbody td:last-child {
    border-radius: 0 0 10px 0;
}


.device-article-payment .payment-container {
    max-width: 1000px;
    width: 80%;
    margin: 0 auto;
    padding: 8rem 0;
    border-right: 0;
    border-bottom: 1px solid black;
}
.device-article-payment .payment-container:last-of-type {
    border: none;
    padding-bottom: 0;
}
.device-article-payment .payment-container:first-of-type  {
    padding-top: 0;
}
.device-article-payment .payment-logo, .device-article-payment .denshi-logo-1 {
    margin: 3.2rem auto;
}


.payment-container p {
    padding: 0;
    padding-bottom: 1.6rem;
    margin: 0;
}

/*決済ロゴ*/
.device-article .qr-logo {
    max-width: 17rem;
}

/* 機器詳細 */
.device-size {
    width: 80%;
}

.device-size-wrapper {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 8rem;
}

.device-size-right .device-size-img {
    max-width: 600px;
}

.device-size-left {
    text-align: left;
}
.device-size .size-title {
    font-size: 2.5rem;
    font-weight: 700;
}

.size-left-inner {
    margin-top: 5.6rem;
    text-align: left;
}

.size-left-inner .label {
    max-width: 100%;
    margin-top: 8px;
    padding: 0;
    justify-content: left;
}
.size-left-inner .label p {
    width: 150px
}

.device-size .contact-button {
    margin-top: 5.6rem;
}

/* 画像なし */
.device-size.no-image {
    /*display: none; 後で非表示に*/
}

.device-size.no-image .device-size-wrapper {
    display: block;
}

.device-size.no-image .device-size-left {
    display: flex;
    justify-content: center;
}

.device-size.no-image .size-left-inner {
    width: 25%;
    text-align: center;
    padding: 0 5%;
    border-right: 1px solid #000000;
}

.device-size.no-image .size-left-inner:last-child {
    display: block;
    border: none;
}

.device-size.no-image .size-left-inner .size-title {
    margin-bottom: 2.4rem;
}
.device-size.no-image .size-left-inner span {
    display: inline-block;
    font-weight: 700;
    padding-top: 1.6rem;
}

.device-size.no-image .size-left-inner .label {
    justify-content: center;
    display: block;
}

.device-size.no-image .size-left-inner .label p {
    margin: 1.6rem auto;
}

/* 基本機能 */
.device-info {
    width: 80%;
    padding: 8rem 0;
    border-radius: 30px;
}

.device-info .heading-wrapper {
    margin-bottom: 4rem;
}
.device-info .label {
    max-width: 80%;
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    gap: 2.4rem 2%; /* 各要素の間隔 */
}

.device-info .label p {
    background-color: #E6E6E6;
    padding: 1.6rem 0;
    width: 18%;
    border-radius: 999px;
    font-size: 1.4rem;
    color: #000;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.device-info .note {
    display: inline-block;
    width: 80%;
    font-size: 1.8rem;
    margin-top: 2.4rem;
    text-align: left;
    text-indent: -1em;       /* 1行目を左に出す */
    padding-left: 1em;   
}

/* ステップ */
.device-step {
    width: 80%;
    padding: 8rem 6.4rem;
    border-radius: 30px;
}

.device-step-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8rem
}


.device-step-inner-1 {
    width: 30%;
}
.device-step-inner-2 {
    width: 45%;
}

.device-step-box {
    display: flex;
    align-items: center;
    border-radius: 3rem;
}

.device-step-value {
    background-color: #6285FC;
    color: #fff;
    border-radius: 3rem 0 0  3rem;
    padding: 0.8rem 2.4rem;
    display: flex;              /* 横並び */
    align-items: center; 
    font-weight: 700;
}

.device-step-value .ranobe-pop {
    font-size: 2rem;
    display: inline-block;
    border-bottom: 1px solid #fff;
    margin-right: 0.8rem;
}

.device-step-value .step-number {
    font-size: 3.5rem;
}

.device-step-text {
    padding-left: 4%;
}
.device-step .arrow-wrapper {
    height: 6rem;
}

/* 縦長 */
.device-long-fv-left .pc-long-img {
    max-width: 400px;
}

/* 縦長fv */
/* 1200以下 */
@media screen and (max-width: 1200px) {
    .device-article .sp-long-img {
        max-width: 150px;
        margin: 0 auto;
    }
}


/* fv */
/* 1200以下 */
@media screen and (max-width: 1200px) {
.device-article-pc {
    display: none;
}

.device-article-sp {
    display: block;
    margin: 0 auto;
}

.device-article .sp-wide-img {
    max-width: 200px;
    margin: 0 auto;
}

.device-article-sp .label {
    display: flex;
    width: 100%;
    max-width: 100%;
    justify-content: center;
}
.device-article-sp .label p {
    width: 45%;
    font-size: 1.8rem;
}

.device-article-sp .text {
    margin-top: 0.8rem;
    .text-align: left;
}
} 

@media (max-width: 768px) {
.device-article {
    margin: 4rem auto;
}

.device-article .label {
    justify-content: space-between;
}

.device-article-sp .label p {
    font-size: 1.2rem;
    min-width: 14rem;
    
}
}

/* 主な特徴 */
@media screen and (max-width: 1412px) {
    .device-feature-inner {
        justify-content: center;
    }
    }
    
    @media screen and (max-width: 1650px) {
    .device-feature-box {
        width: 35%;
    }
    }
    
    @media screen and (max-width: 800px) {
    .device-feature {
        margin-bottom: 12rem;
    }
    .device-feature-box {
        width: 80%;
    }
    .device-feature-box p {
        font-size: 1.4rem;
    }
}
@media screen and (max-width: 768px) {
.device-feature {
    width: 90%;
}
    }

/* 基本料金 */
/* SP表示：PCテーブルを非表示にしてSPテーブルを表示 */
@media (max-width: 768px) {
.price-table.pc { display: none; }
.price-table.sp { display: table; }


.price-table.sp {
    width: 90%;
    font-size: 1.4rem;
}

.price-table.sp thead th, .price-table.sp tbody td {
    padding: 0.8rem 0;
}

.price-table.sp tbody tr:last-child td:first-child {
    border-bottom-left-radius: 10px;
}

.price-table.sp tbody tr:last-child td:last-child {
    border-bottom-right-radius: 10px;
}

.price-table.sp tbody td:first-child {
    background-color: #6285FC;
    color: white;
   }

.price-table.sp thead th {
    font-size: 1.6rem;
}
.price-table.sp thead th:last-child {
    background-color: #ffffff;
    color: #000000;
}

.device-price .contact-button {
    margin-top: 5.6rem;
}
}

/*決済ロゴ*/
@media (max-width: 768px) {
.device-article .qr-logo {
    max-width: 10rem;
}
}

/* 機器サイズ */
/* 画像を上に */
@media screen and (max-width: 1100px) {
.device-size-wrapper {
    flex-direction: column-reverse;
}
}

@media (max-width: 768px) {
.device-size {
    margin-bottom: 8rem;
    width: 90%;
}
.device-size .size-title {
    font-size: 1.6rem;
}
.size-left-inner {
    margin-top: 2.4rem;
}
.size-left-inner .label {
    display: flex;
}
.size-left-inner .label p {
    width: 27%;
}
}

/* 画像なし */
@media screen and (max-width: 1180px) {
.device-size.no-image .device-size-left {
    display: block;
}

.device-size.no-image .device-size-left .size-left-inner {
    margin-top: 4rem;
}
.device-size.no-image .size-left-inner {
    width: 100%;
    padding: 0 0 4rem 0;
    border-right: none;
    border-bottom: 1px solid #000000;
}

.device-size.no-image .size-left-inner:last-child {
    padding: 0;
}

.device-size.no-image .size-left-inner .label{
    display: flex;
}
}

/* 基本機能 */
@media screen and (max-width: 1120px) {
    .device-info .label p {
        width: 23%;
    }
    }
    
    @media screen and (max-width: 900px) {
    .device-info .heading-wrapper {
        margin-bottom: 4rem;
    }
    .device-info .label {
        max-width: 90%;
    }
    .device-info .label p {
        width: 48%;
        font-size: 1.2rem;
        padding: 0.8rem 0;
    }
    .device-info .note {
        font-size: 1.2rem;
    }
    }
    
    @media (max-width: 768px) {
    .device-info {
        padding: 4rem 0;
    }
    }

    /* ステップ */
/* 1200以下 */
@media screen and (max-width: 1200px) {
    .device-step-container {
        flex-direction: column-reverse;
        gap: 0
    }
    .device-gif {
        margin-bottom: 4rem;
        display: flex;
        justify-content: center;
    }
    .device-gif .img {
        margin: 0 auto;
    }

.device-step-inner-1 {
    width: 70%;
}
.device-step-inner-2 {
    width: 100%;
}

    .device-step {
        padding: 8rem 4rem;
    }
    }
    
    @media screen and (max-width: 768px) {
    .device-step {
        padding: 4rem 2.4rem;
    }
    .device-step-value {
        padding: 0.8rem 1.6rem;
    }
    .device-step-value .ranobe-pop {
        font-size: 1.4rem;
    }
    
    .device-step-value .step-number {
        font-size: 1.8rem;
    }
    .device-step h2.decorated::before {
        height: 50px;
    }
    }