@charset "UTF-8";

/*2*/
@media screen and (max-width:768px) { /*SP*/
}
@media screen and (min-width:769px) , print { /*PC&TB*/
}

/*3*/
@media screen and (max-width:768px) { /*SP*/
}
@media screen and (min-width:769px) and ( max-width:1023px) { /*TB*/
}
@media screen and (min-width:1024px) , print { /*PC*/
}

/*4*/
@media screen and (max-width:768px) { /*SP*/
}
@media screen and (min-width:769px) and ( max-width:1223px) { /*TB*/
}
@media screen and (min-width:1224px) and ( max-width:1274px) { /*TB*/
}
@media screen and (min-width:1275px) , print { /*PC*/
}

@media screen and (max-width:768px) { /*SP*/
    .spNone{ display: none; }
    .pcNone{ display: block; }
}
@media screen and (min-width:769px) , print { /*PC&TB*/
    .spNone{ display: block; }
    .pcNone{ display: none; }
}


/*  */
@media screen and (max-width:768px) { /*SP*/
    .RP{
        font-size: 14px;
        color: #333;
    }
    .RP_h1{
        font-size: 14px;
        font-weight: bold;
        margin: 30px 0 0 0;
    }
    .RP_h2{
        font-size: 20px;
        font-weight: bold;
        margin: 0 0 0 0!important;
    }
    .RP_h3{
        font-size: 16px;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .RP_lines {
        width: 100%;
        border: none;
        border-top: 1px dotted #ccc;
        margin: 20px 0;
        display: block;
    }
    .RP_sample{
        background-color: #eee;
        padding: 5px 10px;
        margin: 0 0 10px 0;
    }
    .RP_b0{
        position: relative;
    }
    .RP_b1{
        margin: 0 0 50px 0;
    }
    .RP_p1{
        margin: 10px 0 0 0;
        width: 100%;
    }
    .RP_p2{
        margin: 10px 0 20px 0;
        width: 100%;
    }
    .RP_i1{
        /* position: absolute; */
        /* top: 60px; */
        /* left: 700px; */
    }

    /* ------- */

    .RP_searchBox {
        width: 100%;
        background-color: #F2F2F2;
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
        padding: 30px 0;
        border-radius: 4px;
        display: flex;
        align-items: center;
        gap: 15px;
    }
    .RP_searchLabel {
        margin: 0;
        font-weight: bold;
        color: #0992D9;
        font-size: 18px;
    }
    /* フォーム部分は横並び */
    .RP_searchBox form {
        display: flex;
        align-items: center;
        gap: 10px;
        flex-direction: column;
    }
    /* 入力欄 */
    .RP_searchBox input[type="text"] {
        flex: 1;
        padding: 8px 10px;
        font-size: 14px;
        border: 1px solid #aaa;
        border-radius: 4px;
        width: 280px;
    }
    /* 検索ボタン */
    .RP_searchBox button {
        padding: 8px 20px;
        font-size: 14px;
        background: #ff7f7f;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
        transition: 0.2s;
        width: 130px;
    }
    .RP_searchBox button:hover {
        background: #e06060;
    }
    .RP_searchNote{
        font-size: 11px;
        margin: 10px 0 0 0;
    }
}
@media screen and (min-width:769px) and ( max-width:1274px) { /*TB*/
    .RP{
        /* font-size: 16px; */
        font-size: 1.26vw;
        color: #333;
    }
    .RP_h1{
        /* font-size: 20px; */
        font-size: 1.57vw;
        font-weight: bold;
        /* margin: 50px 0 0 0; */
        margin: 3.92vw 0 0 0;
    }
    .RP_h2{
        /* font-size: 30px; */
        font-size: 2.35vw;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .RP_h3{
        /* font-size: 20px; */
        font-size: 1.57vw;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .RP_lines {
        width: 100%;
        border: none; 
        /* border-top: 1px dotted #ccc; */
        border-top: 0.08vw dotted #ccc;
        /* margin: 30px 0; */
        margin: 2.35vw 0;
        display: block;
    }
    .RP_sample{
        background-color: #eee;
        /* padding: 5px 10px; */
        padding: 0.39vw 0.78vw;
        /* margin: 0 10px 0 0; */
        margin: 0 0.78vw 0 0;
    }
    .RP_b0{
        position: relative;
    }
    .RP_b1{
        /* margin: 0 0 50px 0; */
        margin: 0 0 3.92vw 0;
    }
    .RP_p1{
        /* margin: 10px 0 0 0; */
        margin: 0.78vw 0 0 0;
        width: 100%;
    }
    .RP_p2{
        /* margin: 10px 0 20px 0; */
        margin: 0.78vw 0 1.57vw 0;
        width: 100%;
    }
    .RP_i1{
        position: absolute;
        /* top: 60px; left: 700px; */
        top: 4.71vw; left: 54.95vw;
    }
    /* ------- */
    .RP_searchBox {
        width: 100%;
        background-color: #F2F2F2;
        display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
        /* padding: 50px 0; */
        padding: 3.92vw 0;
        /* border-radius: 4px; */
        border-radius: 0.31vw;
        display: flex;
        align-items: center;
        /* gap: 15px; */
        gap: 1.18vw;
    }
    .RP_searchLabel {
        margin: 0;
        font-weight: bold;
        color: #0992D9;
        /* font-size: 18px; */
        font-size: 1.41vw;
    }
    /* フォーム部分は横並び */
    .RP_searchBox form {
        display: flex;
        align-items: center;
        /* gap: 20px; */
        gap: 1.57vw;
        flex: none;
        /* width: 500px; */
        width: 39.25vw;
    }
    /* 入力欄 */
    .RP_searchBox input[type="text"] {
        flex: 1;
        /* padding: 8px 10px; */
        padding: 0.63vw 0.78vw;
        /* font-size: 14px; */
        font-size: 1.10vw;
        /* border: 1px solid #aaa; */
        border: 0.08vw solid #aaa;
        /* border-radius: 4px; */
        border-radius: 0.31vw;
    }
    /* 検索ボタン */
    .RP_searchBox button {
        /* padding: 8px 20px; */
        padding: 0.63vw 1.57vw;
        /* font-size: 14px; */
        font-size: 1.10vw;
        background: #ff7f7f;
        color: #fff;
        border: none;
        /* border-radius: 4px; */
        border-radius: 0.31vw;
        cursor: pointer;
        /* box-shadow: 1px 2px 3px rgba(0,0,0,0.2); */
        box-shadow: 0.08vw 0.16vw 0.24vw rgba(0,0,0,0.2);
        transition: 0.2s;
    }
    .RP_searchBox button:hover {
        background: #e06060;
    }
    .RP_searchNote{
        /* font-size: 12px; */
        font-size: 0.94vw;
        /* margin: 10px 0 0 0; */
        margin: 0.78vw 0 0 0;
    }
}
@media screen and (min-width:1275px) , print { /*PC*/
    .RP{
        font-size: 16px;
        color: #333;
    }
    .RP_h1{
        font-size: 20px;
        font-weight: bold;
        margin: 50px 0 0 0;
    }
    .RP_h2{
        font-size: 30px;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .RP_h3{
        font-size: 20px;
        font-weight: bold;
        margin: 0 0 0 0;
    }
    .RP_lines {
        width: 100%;
        border: none; 
        border-top: 1px dotted #ccc;
        margin: 30px 0;
        display: block;
    }
    .RP_sample{
        background-color: #eee;
        padding: 5px 10px;
        margin: 0 10px 0 0;
    }
    .RP_b0{
        position: relative;
    }
    .RP_b1{
        margin: 0 0 50px 0;
    }
    .RP_p1{
        margin: 10px 0 0 0;
        width: 100%;
    }
    .RP_p2{
        margin: 10px 0 20px 0;
        width: 100%;
    }
    .RP_i1{
        position: absolute;
        top: 60px; left: 700px;
    }

    /* ------- */

    .RP_searchBox {
        width: 100%;
        background-color: #F2F2F2;
        display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
        padding: 50px 0;
        border-radius: 4px;
        display: flex;
        align-items: center;
        gap: 15px;
    }
    .RP_searchLabel {
        margin: 0;
        font-weight: bold;
        color: #0992D9;
        font-size: 18px;
    }
    /* フォーム部分は横並び */
    .RP_searchBox form {
        display: flex;
        align-items: center;
        gap: 20px;
        flex: none;
        width: 500px;
    }
    /* 入力欄 */
    .RP_searchBox input[type="text"] {
        flex: 1;
        padding: 8px 10px;
        font-size: 14px;
        border: 1px solid #aaa;
        border-radius: 4px;
    }
    /* 検索ボタン */
    .RP_searchBox button {
        padding: 8px 20px;
        font-size: 14px;
        background: #ff7f7f;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
        transition: 0.2s;
    }
    .RP_searchBox button:hover {
        background: #e06060;
    }
    .RP_searchNote{
        font-size: 12px;
        margin: 10px 0 0 0;
    }

}

/*  */
@media screen and (max-width:768px) { /*SP*/
    .RP_resultBg{
        width: 100%;
        background: #f0fafa;
        padding: 50px 0 40px 0;
        margin: 50px 0 0 0;
        font-size: 14px;
    }
    .RP_resultP1{
        margin: 0 0 0 0;
        width: 100%;
        font-size: 12px;
    }
    .RP_resultP2{
        margin: 20px 0 5px 0;
        width: 100%;
        font-weight: bold;
    }

    .RP_resultModelBox{
        width: 100%;
    }
    .RP_resultModelBox span{
        font-size: 24px;
        font-weight: bold;
        letter-spacing: 0px;
        margin: 0 0 0 10px;
    }
    /* ---table--- */
    .RP_resultTable {
        width: 100%;
        margin: 0 0 5px 0;
        font-size: 14px;
    }
    /* スマホ用 縦表示 */
    .RP_resultTable,
    .RP_resultTable thead,
    .RP_resultTable tbody,
    .RP_resultTable th,
    .RP_resultTable td,
    .RP_resultTable tr {
        display: block;
        width: 100%;
    }

    /* theadは非表示 */
    .RP_resultTable thead {
        display: none;
    }

    /* 各行（1レコード） */
    .RP_resultTable tr {
        margin-bottom: 15px;
        border-top: 1px solid #ccc;
        border-bottom: none;
        background: #fff;
        overflow: hidden;
    }

    /* 各セル */
    .RP_resultTable td {
        display: block;
        padding: 0!important;
        font-size: 13px;
        border-top: 1px solid #ccc;
        border-bottom: none;
    }
    .RP_resultTable td p {
        padding: 10px;
    }

    /* 1つ目のセルだけ上線は消す */
    .RP_resultTable td:first-child {
        border-top: none;
    }
    .RP_resultTable td:last-child {
        border-bottom: 1px solid #ccc;
    }

    /* ラベル表示 */
    .RP_resultTable td::before {
        content: attr(data-label);
        display: block;
        font-weight: bold;
        margin-bottom: 3px;
        font-size: 12px;
        padding: 10px;
        background-color: #f5f5f5;
    }
    .RP_resultTable td[data-label*="給気用空清フィルター"]::before {
        content: "給気用空清フィルター\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable td[data-label*="防カビわさびカセット"]::before {
        content: "防カビわさびカセット\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable td[data-label*="かんたんリモコン"]::before {
        content: "かんたんリモコン\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable td[data-label*="無線LAN接続アダプター"]::before {
        content: "無線LAN接続アダプター\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable td[data-label*="ビタミンカセット"]::before {
        content: "ビタミンカセット\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable td[data-label*="リモコンホルダー"]::before {
        content: "リモコンホルダー\A型式　希望小売価格(税込)";
        white-space: pre;
    }
    .RP_resultTable a{
        color: #0992D9;
        font-weight: bold;
        text-decoration-color: #0992D9;
        text-underline-offset: 4px;
        margin: 0 5px 0 0;
    }

}
@media screen and (min-width:769px) and ( max-width:1274px) { /*TB*/
    .RP_resultBg{
        width: 100%;
        background: #f0fafa;
        /* padding: 50px 0 40px 0; */
        padding: 3.92vw 0 3.14vw 0;
        /* margin: 50px 0 0 0; */
        margin: 3.92vw 0 0 0;
        /* font-size: 14px; */
        font-size: 1.10vw;
    }
    .RP_resultP1{
        margin: 0 0 0 0;
        width: 100%;
    }
    .RP_resultP2{
        /* margin: 20px 0 5px 0; */
        margin: 1.57vw 0 0.39vw 0;
        width: 100%;
        font-weight: bold;
    }
    .RP_resultModelBox{
        width: 100%;
    }
    .RP_resultModelBox span{
        /* font-size: 30px; */
        font-size: 2.35vw;
        font-weight: bold;
        /* letter-spacing: 2px; */
        letter-spacing: 0.16vw;
        /* margin: 0 0 0 10px; */
        margin: 0 0 0 0.78vw;
    }
    /* ---table--- */
    .RP_resultTable {
        width: 100%;
        border-collapse: collapse;
        /* margin: 0 0 10px 0; */
        margin: 0 0 0.78vw 0;
        background: #fff;
        /* font-size: 11px; */
        font-size: 0.86vw;
    }
    .RP_resultTable:first-of-type {
        table-layout: fixed;
    }
    .RP_resultTable th,
    .RP_resultTable td {
        /* border: 1px solid #999; */
        border: 0.08vw solid #999;
        /* padding: 8px; */
        padding: 0.63vw;
        /* font-size: 14px; */
        font-size: 1.10vw;
        text-align: left;
        word-wrap: break-word;
    }
    .RP_resultTable th {
        background: #f5f5f5;
        font-weight: bold;
    }
    .RP_resultTable a{
        color: #0992D9;
        font-weight: bold;
        text-decoration-color: #0992D9;
        /* text-underline-offset: 4px; */
        text-underline-offset: 0.31vw;
        /* margin: 0 5px 0 0; */
        margin: 0 0.39vw 0 0;
    }
}
@media screen and (min-width:1275px) , print { /*PC*/
    .RP_resultBg{
        width: 100%;
        background: #f0fafa;
        padding: 50px 0 40px 0;
        margin: 50px 0 0 0;
        font-size: 14px;
    }
    .RP_resultP1{
        margin: 0 0 0 0;
        width: 100%;
    }
    .RP_resultP2{
        margin: 20px 0 5px 0;
        width: 100%;
        font-weight: bold;
    }

    .RP_resultModelBox{
        width: 100%;
    }
    .RP_resultModelBox span{
        font-size: 30px;
        font-weight: bold;
        letter-spacing: 2px;
        margin: 0 0 0 10px;
    }
    /* ---table--- */
    .RP_resultTable {
        width: 100%;
        border-collapse: collapse;
        margin: 0 0 10px 0;
        background: #fff;
        font-size: 11px;
    }
    .RP_resultTable:first-of-type {
        table-layout: fixed;
    }
    .RP_resultTable th,
    .RP_resultTable td {
        border: 1px solid #999;
        padding: 8px;
        font-size: 14px;
        text-align: left;
        word-wrap: break-word;
    }
    .RP_resultTable th {
        background: #f5f5f5;
        font-weight: bold;
    }
    .RP_resultTable a{
        color: #0992D9;
        font-weight: bold;
        text-decoration-color: #0992D9;
        text-underline-offset: 4px;
        margin: 0 5px 0 0;
    }

}

/*  */
@media screen and (max-width:768px) { /*SP*/
    .RP_returnBtWrap{
        width: 100%;
        display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
        margin: 50px 0 50px 0;
    }
    .RP_returnBt{
        margin: 0 10px;
        padding: 10px 10px 8px 10px;
        font-size: 14px;
        background: #ff7f7f;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
        transition: 0.2s;
    }
    .RP_returnBt:hover {
        background: #e06060;
    }
}
@media screen and (min-width:769px) and ( max-width:1274px) { /*TB*/
    .RP_returnBtWrap{
        width: 100%;
        display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
        /* margin: 50px 0 100px 0; */
        margin: 3.92vw 0 7.85vw 0;
    }
    .RP_returnBt{
        /* margin: 0 10px; */
        margin: 0 0.78vw;
        /* padding: 10px 20px 8px 20px; */
        padding: 0.78vw 1.57vw 0.63vw 1.57vw;
        /* font-size: 14px; */
        font-size: 1.10vw;
        background: #ff7f7f;
        color: #fff;
        border: none;
        /* border-radius: 4px; */
        border-radius: 0.31vw;
        cursor: pointer;
        /* box-shadow: 1px 2px 3px rgba(0,0,0,0.2); */
        box-shadow: 0.08vw 0.16vw 0.24vw rgba(0,0,0,0.2);
        transition: 0.2s;
    }
    .RP_returnBt:hover {
        background: #e06060;
    }
}
@media screen and (min-width:1275px) , print { /*PC*/
    .RP_returnBtWrap{
        width: 100%;
        display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;
        margin: 50px 0 100px 0;
    }
    .RP_returnBt{
        margin: 0 10px;
        padding: 10px 20px 8px 20px;
        font-size: 14px;
        background: #ff7f7f;
        color: #fff;
        border: none;
        border-radius: 4px;
        cursor: pointer;
        box-shadow: 1px 2px 3px rgba(0,0,0,0.2);
        transition: 0.2s;
    }
    .RP_returnBt:hover {
        background: #e06060;
    }
}



/* supply add class */
#page{
    width: 100%;
}
@media screen and (max-width:768px) { /*SP*/
    .RPS{
        margin: 30px 0 30px 0;
    }
    #page h1{
        width: 100%;
        border-bottom: 2px solid #ccc;
        font-size: 20px;
        margin: 0 0 20px 0;
    }
    .RD_box{
        background-color: #fff;
        margin: 30px 0 0 0; 
        width: 100%;
    }
    .RD_target .RD_active{
        padding: 20px;
    }
}
@media screen and (min-width:769px) , print { /*PC&TB*/
    .RPS{
        margin: 70px 0 50px 0;
    }
    #page h1{
        width: 100%;
        border-bottom: 2px solid #ccc;
        font-size: 26px;
        margin: 0 0 50px 0;
    }
    .RD_box{
        background-color: #fff;
        margin: 50px 0 0 0; 
        width: 100%;
    }
    .RD_target .RD_active{
        padding: 50px;
    }
}
#page h2{
    clear: both;
    padding: 40px 0 0 0;
}
#page table{
    width: 100%;
    margin: 20px 0 0 0;
}

.contentsArea h2 {
    border-bottom: none;
}
.contentsArea h2 span {
    border-left: none;
    padding: 0;
}

/* WrapLeft */
@media screen and (max-width:768px) { /*SP*/
    .WrapLeft{
        width: 100%!important;
    }
}
@media screen and (min-width:769px) , print { /*PC&TB*/
    .WrapLeft{
        width: 700px;
    }
}

.WrapLeftImg{
    border: 1px solid #ccc;
}


