/*

 * -----------------------------------------------------

 *  全体

 * -----------------------------------------------------

 */



* {

        padding: 0px;

        margin: 0px;

        font-family: "Montserrat", "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", sans-serif;

        -webkit-tap-highlight-color:rgba(0,0,0,0);

}



a{

        outline:none;

}



body {

        overflow: hidden;

        background-color: #e0eaee;

}



 *::selection {

        background: none;

}



*::-moz-selection {

        background: none;

}



#wrapper {

        overflow: hidden;

        background-color: #fff;

        display: none;

}



#sideMenu_scrollOuter_scrollInner {

        display: flex;

        flex-wrap: wrap;

        align-content: flex-start;

        gap: 8px;

        width: 100% !important;

        box-sizing: border-box;

}



.for-pc {

        display: none;

}











/*

 * -----------------------------------------------------

 *  エラーウィンドウ

 * -----------------------------------------------------

 */



#errorWindow {

        position: absolute;

        top: 293px;

        left: 397px;

        width: 406px;

        min-height: 30px;

        z-index: 510;

        background-color: rgba(255, 255, 255, 0.8);

        color: #000;

        box-sizing: border-box;

        padding: 20px 20px 20px 20px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        display: none;

        padding-bottom: 60px;

}



#errorWindow-ok {

        position: relative;

        left: 100px;

        top: 30px;

        width: 150px;

        height: 40px;

        background-color: #39b1ff;

        color: #fff;

        text-align: center;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        box-sizing: border-box;

        padding-top: 8px;

        padding-left: 0px;

        border: 1px solid #ccc;

        cursor: pointer;

}







/*

 * -----------------------------------------------------

 *  モーダルウィンドウ共通

 * -----------------------------------------------------

 */

.pc-modal-header {

        position: absolute;

        top: 0px;

        left: 0px;

        width: 100%;

        height: 24px;

        background-color: transparent;

        border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px;

        background-image: url("../images/bg_modal_h.png");

}

.pc-modal-body {

        position: absolute;

        top: 24px;

        left: 0px;

        width: 100%;

        height: 100px;

        background-color: rgba(255, 255, 255, 0.8);

}



.pc-modal-footer {

        position: absolute;

        bottom: 0px;

        left: 0px;

        width: 100%;

        height: 12px;

        background-color: transparent;

        border-radius: 0px 0px 5px 5px / 0px 0px 5px 5px;

        background-image: url("../images/bg_modal_h.png");

}



.pc-modal-title {

        position: absolute;

        top: 15px;

        left: 231px;

        width: 346px;

        height: 33px;

        text-align: center;

        box-sizing: border-box;

        padding-top: 5px;

        font-size: 20px;

        line-height: 1;

        font-weight: 700;

        letter-spacing: 0.2px;

        color: #111;

}







.pc-close {

        position: absolute;

        top: 8px;

        right: 8px;

        height: 52px;

        width: 52px;

        background-color: #ccc;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        border: #a3a3a3 solid 1px;

        background-image: url("../images/close.png");

        opacity: 1;

        cursor: pointer;

        z-index: 100;

}



.pc-modal-bodyText {

        position: absolute;

        top: 75px;

        left: 0px;

        width: 100%;

        height: 90px;

        text-align: center;

        font-size: 0.9rem;

        line-height: 24px;

        background-color: transparent;



}



#pc-modal-bg {

        position: absolute;

        top: 0px;

        left: 0px;

        width: 100%;

        height: 820px;

        /*height: 720px;*/

        background-color: #000;

        opacity: 0.5;

        z-index: 500;

        display: none;

}





/*

 * -----------------------------------------------------

 *  印刷プレビュー

 * -----------------------------------------------------

 */







#pc-printPreview-area {

        position: absolute;

        top: 35px;

        left: 390px;

        /*margin: 0 auto;*/

        width: 420px;

        height: 800px;

        z-index: 510;

        display: none;

}



#pc-printPreview-canvas {

        position: absolute;

        top: 65px;

        left: 0px;

        width: 420px;

        height: 594px;

}



#pc-printPreview-close {

        position: absolute;

        top: 0px;

        right: 0px;

}



#pc-printPreview-btnPrint {

        position: absolute;

        top: 672px;

        left: 100px;

        width: 235px;

        height: 60px;

        background-color: #39b1ff;

        text-align: center;

        box-sizing: border-box;

        padding-top: 14px;

        padding-left: 30px;

        color: #fff;

        font-weight: bold;

        font-size: 1rem;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        background-image: url("../images/icon_print.png");

        background-repeat: no-repeat;

        background-position: 55px 18px;

        cursor: pointer;

}



#pc-printPreview-btnPrint:hover{

        background-color: #4ca6e0;

}



#pc-printPreview-qrCode {

        position: absolute;

        top: 30px;

        left: 314px;

        width: 100px;

        height: 100px;

        z-index: 500;

        transform: scale(0.1);

}





/*

 * -----------------------------------------------------

 *  お気に入り

 * -----------------------------------------------------

 */



 #pc-favorite-area {

         position: absolute;

         top: 64px;

         left: 250px;

         width: 700px;

         height: 688px;

         z-index: 510;

         display: none;

 }



#pc-favorite-modal-title {

          background-image: url("../images/title_faborite.png");

          padding-left: 25px;

          left: 160px;

}



#pc-favorite-bodyText2 {

        position: absolute;

        top: 140px;

        left: 0px;

        width: 100%;

        height: 90px;

        text-align: center;

        font-size: 0.9rem;

        line-height: 28px;

        background-color: none;

        color: #fff;

        font-weight: bold;

        text-shadow: 1px 1px 1px #808080;

}



#pc-favorite-body {

        height: 652px;

        width: 700px;

        background-image: url("../images/bg_favorite.png");

}



#pc-favoriteList-canvas {

        position: absolute;

        top: 132px;

        left: 0px;

        width: auto;

}



.pc-favoriteList-inner-btn-save {

        position: absolute;

        width: 90px;

        height: 47px;

        background-color: #39b1ff;

        box-sizing: border-box;

        text-align: center;

        line-height: 48px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        color: #fff;

        cursor: pointer;

        font-size: 0.9rem;

}



.pc-favoriteList-inner-btn-save:hover {

        background-color: #4ca6e0;

}



.pc-favoriteList-inner-btn-read {

        position: absolute;

        width: 90px;

        height: 47px;

        background-color: #fff;

        border: 1px solid #39b1ff;

        box-sizing: border-box;

        text-align: center;

        line-height: 48px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        color: #39b1ff;

        cursor: pointer;

        display: none;

        font-size: 0.9rem;

}



.pc-favoriteList-inner-btn-read:hover {

        background-color: #eee;

}



#pc-favoriteList-inner-btn-save0 {

        top: 553px;

        left: 42px;

}



#pc-favoriteList-inner-btn-save1 {

        top: 553px;

        left: 255px;

}



#pc-favoriteList-inner-btn-save2 {

        top: 553px;

        left: 468px;

}



#pc-favoriteList-inner-btn-read0 {

        top: 553px;

        left: 141px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

}



#pc-favoriteList-inner-btn-read1 {

        top: 553px;

        left: 354px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

}



#pc-favoriteList-inner-btn-read2 {

        top: 553px;

        left: 567px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

}





/*

 * -----------------------------------------------------

 *  プラン変更

 * -----------------------------------------------------

 */



#pc-changePlan-area {

        position: absolute;

        top: 172px;

        left: 197px;

        width: 806px;

        height: 472px;

        z-index: 510;

        opacity: 0;

}



#pc-changePlan-body {

        height: 436px;

}



#pc-changePlan-scrollBody {

        position: absolute;

        top: 80px;

        left: 58px;

        width: 720px;

        height: 330px;

        overflow: hidden;

}



#pc-changePlan-modal-title {

        background-image: url("../images/title_plain.png");

}



.changePlan_thumbnail {

        position: relative;

        float: left;

        margin-right: 15px;

        margin-bottom: 14px;

        width: 218px;

        height: 284px;

        cursor: pointer;

        transition: transform 0.2s ease, box-shadow 0.2s ease;

        border-radius: 8px;

        overflow: hidden;

}

.changePlan_thumbnail:hover {

        transform: translateY(-2px);

        box-shadow: 0 4px 12px rgba(75, 169, 227, 0.2);

}





/*

 * -----------------------------------------------------

 *  ヘルプ

 * -----------------------------------------------------

 */



#pc-help-area {

        position: absolute;

        top: 28px;

        left: 67px;

        width: 1066px;

        height: 780px;

        z-index: 510;

        opacity: 0;

}



#pc-help-body {

        height: 744px;

}



#pc-help-image {

        position: absolute;

        top: 70px;

        left: 100px;

        width: 870px;

        overflow: hidden;

}



#pc-help-modal-title {

        background-image: url("../images/title_help.png");

        padding-left: 30px;

        left: 360px;

}





/*

 * -----------------------------------------------------

 *  シリーズ変更

 * -----------------------------------------------------

 */



#pc-changeSeries-area {

        position: absolute;

        top: 123px;

        left: 197px;

        width: 860px;

        height: 586px;

        z-index: 510;

        opacity: 0;

        /*display: none;*/

}



#pc-changeSeries-scrollBody {

        position: absolute;

        top: 80px;

        left: 45px;

        width: 810px;

        height: 425px;

        overflow: hidden;

        /*background-color: rgba(255, 255, 0, 0.5)*/

        box-sizing: border-box;

}



#pc-changeSeries-modal-title {

        background-image: url("../images/title_plain.png");

}





#pc-changeSeries-annotation {

        position: absolute;

        top: 520px;

        left: 0px;

        font-size: 0.9rem;

        color: #4ba9e3;

        background-color: none;

        width: 100%;

        text-align: center;

}



.pc-changeSeries-images {

        margin-left: 8px;

        margin-right: 6px;

        margin-bottom: 4px;

        cursor: pointer;

        transition: transform 0.2s ease, box-shadow 0.2s ease;

        border-radius: 8px;

        overflow: hidden;

}

.pc-changeSeries-images:hover {

        transform: translateY(-2px);

        box-shadow: 0 4px 12px rgba(75, 169, 227, 0.2);

}





/*

 * -----------------------------------------------------

 *  インテリアスタイル変更

 * -----------------------------------------------------

 */



#pc-changeInterior-area {

        position: absolute;

        top: 123px;

        left: 197px;

        width: 806px;

        height: 586px;

        z-index: 510;

        opacity: 0;

}



#pc-changeInterior-body {

        height: 550px;

}



#pc-changeInterior-scrollBody {

        position: absolute;

        top: 80px;

        left: 58px;

        width: 720px;

        height: 425px;

        overflow: hidden;

}



.recommendPlan_thumbnail {

        position: relative;

        float: left;

        margin-right: 15px;

        margin-bottom: 14px;

        width: 220px;

        height: 198px;

        cursor: pointer;

}



.recommendPlan_thumbnail:hover {

        opacity: 0.6;

}



#pc-changeInterior-modal-title {

        background-image: url("../images/title_plain.png");

}



#pc-changeInterior-annotation {

        position: absolute;

        top: 520px;

        right: 30px;

        font-size: 0.7rem;

}





/*

 * -----------------------------------------------------

 *  URLコピー

 * -----------------------------------------------------

 */



#pc-urlCopy-qrCode {

        position: absolute;

        top: 95px;

        right: 50px;

        width: 200px;

        height: 200px;

        z-index: 510;

        background-color: none;

        box-shadow: 0px 0px 0px 15px rgba(255,255,255,1);

        background-color: #fff;

}



#pc-urlCopy-bodyText {

        background-color: none;

        width: 500px;

        left: 30px;

}



#pc-urlCopy-modal-title {

         background-image: url("../images/title_urlCopy.png");

         padding-left: 25px;

 }



/* normalize modal title layout across bottom-menu related modals */

#pc-favorite-modal-title,

#pc-changePlan-modal-title,

#pc-help-modal-title,

#pc-changeSeries-modal-title,

#pc-changeInterior-modal-title,

#pc-urlCopy-modal-title {

        left: 231px;

        width: 346px;

        padding-left: 0;

        background-repeat: no-repeat;

        background-position: center;

}



#pc-urlCopy-area {

        position: absolute;

        top: 193px;

        left: 197px;

        width: 806px;

        height: 430px;

        z-index: 510;

        display: none;

}



#pc-urlCopy-modal-body {

        height: 394px;

}



#pc-urlCopy-modal-urlText {

        position: absolute;

        left: 55px;

        top: 170px;

        width: 450px;

        height: 74px;

        background-color: #fff;

        border: 1px solid #ccc;

        word-wrap: break-word;

        font-size: 0.8rem;

        box-sizing: border-box;

        padding: 10px 10px 10px 10px;

}



#pc-urlCopy-modal-urlText::selection {

       background: #aed8f2;

}



#pc-urlCopy-modal-btnCopy {

        position: absolute;

        left: 179px;

        top: 280px;

        width: 235px;

        height: 60px;

        background-color: #39b1ff;

        color: #fff;

        text-align: center;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        box-sizing: border-box;

        padding-top: 18px;

        padding-left: 30px;

        border: 1px solid #ccc;

        background-image: url("../images/icon_copy.png");

        background-repeat: no-repeat;

        background-position: 55px 18px;

        cursor: pointer;

}



#pc-urlCopy-modal-doneText {

        position: absolute;

        top: 343px;

        left: 0px;

        width: 75%;

        height: 90px;

        text-align: center;

        font-size: 0.9rem;

        line-height: 28px;

        background-color: none;

        color: red;

        display: none;

}



/* framed modal layouts opened from bottom menu */

#pc-urlCopy-area,

#pc-favorite-area,

#pc-changeSeries-area,

#pc-changeInterior-area,

#pc-changePlan-area,

#pc-help-area {

        border: 1px solid #d7dfe6;

        border-radius: 12px;

        box-shadow: 0 10px 24px rgba(75, 169, 227, 0.12);

        overflow: hidden;

}



#pc-urlCopy-area .pc-modal-header,

#pc-favorite-area .pc-modal-header,

#pc-changeSeries-area .pc-modal-header,

#pc-changeInterior-area .pc-modal-header,

#pc-changePlan-area .pc-modal-header,

#pc-help-area .pc-modal-header {

        border-bottom: 1px solid #d7dfe6;

}



#pc-urlCopy-area .pc-modal-body,

#pc-favorite-area .pc-modal-body,

#pc-changeSeries-area .pc-modal-body,

#pc-changeInterior-area .pc-modal-body,

#pc-changePlan-area .pc-modal-body,

#pc-help-area .pc-modal-body {

        border-left: 1px solid #d7dfe6;

        border-right: 1px solid #d7dfe6;

}



#pc-urlCopy-area .pc-modal-footer,

#pc-favorite-area .pc-modal-footer,

#pc-changeSeries-area .pc-modal-footer,

#pc-changeInterior-area .pc-modal-footer,

#pc-changePlan-area .pc-modal-footer,

#pc-help-area .pc-modal-footer {

        border-top: 1px solid #d7dfe6;

}



/*

 * -----------------------------------------------------

 *  シミュレーション画像表示エリア

 * -----------------------------------------------------

 */



#pc-main-area_simulation-image {

        position: absolute;

        top: 0px;

        left: 0px;

}





#preloader_pc {

        position: absolute;

        top: 430px;

        left: 540px;

        z-index: 300;

}



#mainImage_canvas_0 {

        position: absolute;

        top: 0px;

        left: 0px;

        z-index: 0;

        display: none;

}



#mainImage_canvas_1 {

        position: absolute;

        top: 0px;

        left: 0px;

        z-index: 0;

        display: none;

}



#mainImage_canvas_rollover {

        position: absolute;

        top: 0px;

        left: 0px;

        z-index: 100;

        /*opacity: 0.5;*/

        opacity: 0;

}



#mainImage_image_rollover {

        position: absolute;

        left: 0px;

        height: 820px;

        width: 1600px;

        opacity: 1;

        z-index: 90;

}



#pc-main-area-colorSelect {

        position: absolute;

        box-sizing: border-box;

        font-size: 0.5rem;

        bottom: 90px;

        right: 20px;

        height: 70px;

        width: 200px;

        background-color: none;

        border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px;

        border: #4ba9e3 solid 1px;

        background-image: url("../images/bg_colorSelect.png");

        opacity: 0.8;

        cursor: pointer;

        z-index: 400;

        overflow: hidden;

}



#pc-main-area-colorSelect-image {

        position: absolute;

        top: 24px;

        left: 36px;

}



#pc-main-area-colorSelect-text {

        position: absolute;

        top: 14px;

        left: 71px;

        width: auto;

        font-size: 0.9rem;

        color: #fff;

        overflow: hidden;

}





#pc-main-area-viewChange {

        position: absolute;

        box-sizing: border-box;

        font-size: 0.8rem;

        top: 745px;

        left: 23px;

        height: 66px;

        width: 94px;

        background-color: rgba(255, 255, 255, 0.8);

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        border: 1px solid #e0e0e0;

        background-image: url("../images/bg_view.png");

        background-repeat: no-repeat;

        background-position: center 15px;

        opacity: 0.9;

        cursor: pointer;

        z-index: 400;

        overflow: hidden;

        text-align: center;

        line-height: 66px;

        box-sizing: border-box;

        padding-top: 15px;



}



#pc-main-area-viewChange:hover{

        background-color: #ddd;

}





/*

 * -----------------------------------------------------

 *  PC用のページ下部のメニュー

 * -----------------------------------------------------

 */



#pc-bottomMenu-area {

        position: absolute;

        bottom: 0;

        left: 0;

        height: 90px;

        width: 100%;

        z-index: 600;

        background-color: transparent;

        overflow: hidden;

        font-size: 0.5rem;

        background-color: #fff;

        /*background-color: yellow;*/

        /*margin: 0 0 0 40px;*/

}



#pc-bottomMenu-area-btn_changeInterior{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 22px);

        height: 56px;

        width: 125px;

        border: 1px solid #e0e0e0;

        border-radius: 10px 0px 0px 10px / 10px 0px 0px 10px;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 12px;

        text-align: center;

        line-height: 17px;

        color: #666;

        /*display: none;*/

        cursor: pointer;

}



#pc-bottomMenu-area-btn_changeSeries{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 155px);

        height: 56px;

        width: 124px;

        border: 1px solid #e0e0e0;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 12px;

        text-align: center;

        line-height: 17px;

        color: #666;

        /*display: none;*/

        cursor: pointer;

}



#pc-bottomMenu-area-btn_changePlan{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 287px);

        height: 56px;

        width: 125px;

        border: 1px solid #e0e0e0;

        border-radius: 0px 10px 10px 0px / 0px 10px 10px 0px;

        /*border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;*/

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 12px;

        text-align: center;

        line-height: 17px;

        color: #666;

        cursor: pointer;

}



#pc-bottomMenu-area-btn_saveImage{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 420px);

        height: 56px;

        width: 75px;

        border: 1px solid #e0e0e0;

        border-radius: 10px 0px 0px 10px / 10px 0px 0px 10px;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 34px;

        text-align: center;

        line-height: 17px;

        color: #666;

        cursor: pointer;

        background-image: url("../images/saveimage.png");

}



#pc-bottomMenu-area-btn_print{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 503px);

        height: 56px;

        width: 75px;

        border: 1px solid #e0e0e0;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 34px;

        text-align: center;

        line-height: 17px;

        color: #666;

        cursor: pointer;

        background-image: url("../images/print.png");

}





#pc-bottomMenu-area-btn_urlCopy{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 586px);

        height: 56px;

        width: 75px;

        border: 1px solid #e0e0e0;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 34px;

        text-align: center;

        line-height: 17px;

        color: #666;

        cursor: pointer;

        background-image: url("../images/urlcopy.png");

}



/* bottom menu typography / border normalization */

#pc-bottomMenu-area-btn_changeInterior,

#pc-bottomMenu-area-btn_changeSeries,

#pc-bottomMenu-area-btn_changePlan,

#pc-bottomMenu-area-btn_saveImage,

#pc-bottomMenu-area-btn_print,

#pc-bottomMenu-area-btn_urlCopy,

#pc-bottomMenu-area-btn_favorite,

#pc-bottomMenu-area-btn_help,

#pc-bottomMenu-area-btn_backTop,

#pc-bottomMenu-area-btn_showRoom,

#pc-bottomMenu-area-btn_serchShowRoom {

        max-width: 125px;

        border: 1px solid #d7dfe6 !important;

        border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px !important;

        color: #111 !important;

}



.pc-bottomMenu-label,

.pc-bottomMenu-label b {

        font-size: 12px !important;

        line-height: 16px !important;

        font-weight: 700 !important;

        color: inherit !important;

}



/* natural flow layout (no manual left/top alignment per button) */

#pc-bottomMenu-area {

        display: flex;

        align-items: center;

        justify-content: center;

        gap: 8px;

        padding: 0 12px;

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"] {

        position: relative !important;

        top: auto !important;

        left: auto !important;

        flex: 0 0 auto;

}



#pc-bottomMenu-area-btn_changeInterior { order: 1; }

#pc-bottomMenu-area-btn_changeSeries { order: 2; }

#pc-bottomMenu-area-btn_changePlan { order: 3; }

#pc-bottomMenu-area-btn_saveImage { order: 4; }

#pc-bottomMenu-area-btn_print { order: 5; }

#pc-bottomMenu-area-btn_urlCopy { order: 6; }

#pc-bottomMenu-area-btn_favorite { order: 7; }

#pc-bottomMenu-area-btn_help { order: 8; }

#pc-bottomMenu-area-btn_backTop { order: 9; }

#pc-bottomMenu-area-btn_showRoom { order: 10; }

#pc-bottomMenu-area-btn_serchShowRoom { order: 11; }



#pc-bottomMenu-area > #saveAsImageMain_a_Normal {

        order: 4;

        text-decoration: none;

}



#pc-bottomMenu-area > #saveAsImageMain_a_Normal > #pc-bottomMenu-area-btn_saveImage {

        position: relative !important;

        top: auto !important;

        left: auto !important;

}



/* text group */

#pc-bottomMenu-area-btn_changeInterior,

#pc-bottomMenu-area-btn_changeSeries,

#pc-bottomMenu-area-btn_changePlan,

#pc-bottomMenu-area-btn_backTop,

#pc-bottomMenu-area-btn_showRoom,

#pc-bottomMenu-area-btn_serchShowRoom {

        display: flex;

        align-items: center;

        justify-content: center;

        padding-top: 0 !important;

        text-align: center;

        background-image: none !important;

        font-size: 0.7rem !important;

        line-height: 17px !important;

}



#pc-bottomMenu-area-btn_changeInterior .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_changeSeries .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_changePlan .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_backTop .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_showRoom .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_serchShowRoom .pc-bottomMenu-label,

#pc-bottomMenu-area-btn_changeInterior .pc-bottomMenu-label b,

#pc-bottomMenu-area-btn_changeSeries .pc-bottomMenu-label b,

#pc-bottomMenu-area-btn_changePlan .pc-bottomMenu-label b,

#pc-bottomMenu-area-btn_backTop .pc-bottomMenu-label b,

#pc-bottomMenu-area-btn_showRoom .pc-bottomMenu-label b,

#pc-bottomMenu-area-btn_serchShowRoom .pc-bottomMenu-label b {

        text-transform: uppercase;

        text-align: center;

}



/* icon + text group */

#pc-bottomMenu-area-btn_saveImage,

#pc-bottomMenu-area-btn_print,

#pc-bottomMenu-area-btn_urlCopy,

#pc-bottomMenu-area-btn_favorite,

#pc-bottomMenu-area-btn_help {

        padding-top: 31px !important;

}



#pc-bottomMenu-area-btn_urlCopy:hover,

#pc-bottomMenu-area-btn_saveImage:hover,

#pc-bottomMenu-area-btn_print:hover,

#pc-bottomMenu-area-btn_favorite:hover,

#pc-bottomMenu-area-btn_changePlan:hover,

#pc-bottomMenu-area-btn_showRoom:hover,

#pc-bottomMenu-area-btn_serchShowRoom:hover,

#pc-bottomMenu-area-btn_changeInterior:hover,

#pc-bottomMenu-area-btn_help:hover,

#pc-bottomMenu-area-btn_changeSeries:hover,

#pc-bottomMenu-area-btn_backTop:hover

{

        background-color: #eef8fd;

        border-color: #4ba9e3;

        color: #4ba9e3 !important;

}



#pc-bottomMenu-area-btn_favorite{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 669px);

        height: 56px;

        width: 75px;

        border: 1px solid #e0e0e0;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 34px;

        text-align: center;

        line-height: 17px;

        color: #666;

        cursor: pointer;

        background-image: url("../images/favorite.png");

}



#pc-bottomMenu-area-btn_help{

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 752px);

        height: 56px;

        width: 75px;

        border: 1px solid #e0e0e0;

        border-radius: 0px 10px 10px 0px / 0px 10px 10px 0px;

        font-size: 0.7rem;

        box-sizing: border-box;

        padding-top: 34px;

        text-align: center;

        line-height: 17px;

        color: #666;

        background-image: url("../images/help.png");

        cursor: pointer;

}



#pc-bottomMenu-area-btn_backTop {

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 835px);

        height: 56px;

        width: 125px;

        border: 1px solid #e0e0e0;

        border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;

        font-size: 0.9rem;

        box-sizing: border-box;

        padding-top: 6px;

        text-align: center;

        line-height: 18px;

        color: #666;

        /*display: none;*/

        cursor: pointer;

}



#pc-bottomMenu-area-btn_showRoom {

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 917px);

        height: 56px;

        width: 125px;

        border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;

        font-size: 0.5rem;

        box-sizing: border-box;

        padding-top: 20px;

        text-align: center;

        line-height: 14px;

        color: #666;

        cursor: pointer;

        background-image: none;

}



#pc-bottomMenu-area-btn_serchShowRoom {

        position: absolute;

        top: 15px;

        left: calc(var(--pc-bottomMenu-offset) + 1015px);

        height: 56px;

        width: 125px;

        border-radius: 10px 10px 10px 10px / 10px 10px 10px 10px;

        font-size: 0.5rem;

        box-sizing: border-box;

        padding-top: 20px;

        text-align: center;

        line-height: 14px;

        color: #666;

        cursor: pointer;

        background-image: none;

}



/* High-end polish v1 */

#pc-bottomMenu-area {

        background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);

        border-top: 1px solid #d7dfe6;

        box-shadow: 0 -8px 18px rgba(17, 17, 17, 0.08);

}



#pc-bottomMenu-area-btn_changeInterior,

#pc-bottomMenu-area-btn_changeSeries,

#pc-bottomMenu-area-btn_changePlan,

#pc-bottomMenu-area-btn_saveImage,

#pc-bottomMenu-area-btn_print,

#pc-bottomMenu-area-btn_urlCopy,

#pc-bottomMenu-area-btn_favorite,

#pc-bottomMenu-area-btn_help,

#pc-bottomMenu-area-btn_backTop,

#pc-bottomMenu-area-btn_showRoom,

#pc-bottomMenu-area-btn_serchShowRoom {

        box-shadow: 0 2px 6px rgba(17, 17, 17, 0.06);

        letter-spacing: 0.1px;

}



#pc-bottomMenu-area-btn_changeInterior span,

#pc-bottomMenu-area-btn_changeSeries span,

#pc-bottomMenu-area-btn_changePlan span,

#pc-bottomMenu-area-btn_saveImage span,

#pc-bottomMenu-area-btn_print span,

#pc-bottomMenu-area-btn_urlCopy span,

#pc-bottomMenu-area-btn_favorite span,

#pc-bottomMenu-area-btn_help span,

#pc-bottomMenu-area-btn_backTop span,

#pc-bottomMenu-area-btn_showRoom span,

#pc-bottomMenu-area-btn_serchShowRoom span {

        display: inline-block;

        width: 100%;

}



#pc-bottomMenu-area-btn_saveImage,

#pc-bottomMenu-area-btn_print,

#pc-bottomMenu-area-btn_urlCopy,

#pc-bottomMenu-area-btn_favorite,

#pc-bottomMenu-area-btn_help {

        background-position: center 0px;

        background-repeat: no-repeat;

}



#pc-bottomMenu-area-btn_saveImage:hover,

#pc-bottomMenu-area-btn_print:hover,

#pc-bottomMenu-area-btn_urlCopy:hover,

#pc-bottomMenu-area-btn_favorite:hover,

#pc-bottomMenu-area-btn_help:hover,

#pc-bottomMenu-area-btn_changeInterior:hover,

#pc-bottomMenu-area-btn_changeSeries:hover,

#pc-bottomMenu-area-btn_changePlan:hover,

#pc-bottomMenu-area-btn_backTop:hover,

#pc-bottomMenu-area-btn_showRoom:hover,

#pc-bottomMenu-area-btn_serchShowRoom:hover {

        box-shadow: 0 8px 16px rgba(75, 169, 227, 0.22);

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"] {

        transition: transform 0.18s ease, box-shadow 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"] .pc-bottomMenu-label,

#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"] span,

#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"] b {

        transition: color 0.2s ease, letter-spacing 0.2s ease;

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"]:hover {

        transform: translateY(-2px);

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"]:hover .pc-bottomMenu-label,

#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"]:hover span,

#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"]:hover b {

        letter-spacing: 0.2px;

}



#pc-bottomMenu-area [id^="pc-bottomMenu-area-btn_"]:active {

        transform: translateY(0);

}



#pc-urlCopy-area,

#pc-favorite-area,

#pc-changeSeries-area,

#pc-changeInterior-area,

#pc-changePlan-area,

#pc-help-area {

        background-color: #ffffff;

}



#pc-urlCopy-area .pc-modal-title,

#pc-favorite-area .pc-modal-title,

#pc-changeSeries-area .pc-modal-title,

#pc-changeInterior-area .pc-modal-title,

#pc-changePlan-area .pc-modal-title,

#pc-help-area .pc-modal-title {

        color: #111;

        font-weight: 700;

        letter-spacing: 0.2px;

}





/*

 * -----------------------------------------------------

 *  サイドメニュー

 * -----------------------------------------------------

 */



#pc-side-menu-area {

        position: absolute;

        top: 14px;

        /*left: 690px;*/

        right: 20px;

        height: 806px;

        width: 485px;

        z-index: 150;

        background-color: none;

        overflow: hidden;

        font-size: 0.5rem;

        opacity: 0;

}



#pc-side-menu-area-body {

        position: absolute;

        top: 60px;

        left: 0px;

        height: 748px;

        width: 485px;

        z-index: 150;

        /*background-color: red;*/

        background-color: rgba(255,255,255,0.95);

        overflow: hidden;

        font-size: 0.5rem;

        border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px;

        z-index: 100;

}



#pc-side-menu-area-close {

        position: absolute;

        top: 0px;

        right: 0px;

        height: 52px;

        width: 52px;

        background-color: #bdbdbd;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        border: #a3a3a3 solid 1px;

        background-image: url("../images/close.png");

        opacity: 0.8;

        cursor: pointer;

}



#pc-side-menu-area-colorSelect {

        position: absolute;

        box-sizing: border-box;

        top: 18px;

        left: 19px;

        height: 87px;

        width: 84px;

        background-color: none;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        /*border: #4ba9e3 solid 1px;*/

        background-image: url("../images/back_to_list.png");

        background-repeat: no-repeat;

        background-size: contain;

        opacity: 0.8;

        color: #fff;

        cursor: pointer;

}



#pc-side-menu-area-colorSelect-image {

        position: absolute;

        top: 15px;

        left: 10px;

}



#pc-side-menu-area-colorSelect-text {

        position: absolute;

        top: 43px;

        left: 7px;

        width: 70px;

        background-color: none;

        font-size:0.9rem;

        color: #fff;

        overflow: hidden;

        line-height: 18px;

        text-align: center;

}



.text-bold {

        font-weight: bold;

        font-size: 1rem;

}

.text-bold2 {

        font-weight: bold;

        font-size: 1.2rem;

}



#pc-side-menu-area-header {

        position: absolute;

        top: 0px;

        left: 0px;

        height: 122px;

        width: 485px;

        background-image: url("../images/bg_menu.png");

        border-radius: 5px 5px 0px 0px / 5px 5px 0px 0px;

        z-index: 4000;

        opacity: 1;

}



#pc-side-menu-area-header-hikite {

        position: absolute;

        top: 17px;

        right: 18px;

        width: 84px;

        height: 87px;

        border-radius: 5px 5px 5px 5px / 5px 5px 5px 5px;

        background-color: #ebf7ff;

        border: rgba(75, 169, 227, 0.8) 1px solid;

        color: #4ba9e3;

        font-size: 0.9rem;

        line-height: 22px;

        padding-top: 21px;

        padding-left: 12px;

        box-sizing: border-box;

        background-image: url("../images/bg_hikite.png");

        background-repeat: no-repeat;

        background-position: 59px 30px;

        cursor: pointer;

        display: none;

}



#pc-side-menu-area-header-hikite-text {

        font-size: 1.1rem;

        font-weight: bold;

}



#pc-side-menu-area-header-title {

        position: absolute;

        top: 14px;

        left: 143px;

        height: 20px;

        width: 233px;

        font-size: 1rem;

        font-weight: bold;

}



#pc-side-menu-area-header-image{

        position: absolute;

        top: 41px;

        left: 143px;

        height: 62px;

        width: 62px;

        border: 1px solid #e5e5e5;
        
        border-radius: 50%;

}





#pc-side-menu-area-header-texts {

        position: absolute;

        top: 43px;

        left: 215px;

        height: 30px;

        width: 160px;

        line-height: 12px;

        font-size: 0.7rem;

        /*background-color: green;*/

}



#pc-side-menu-area-header-text1{

        line-height: 12px;

        font-size: 0.7rem;

        /*background-color: blue;*/

        margin-bottom: 4px;

}



#pc-side-menu-area-header-text2{

        line-height: 12px;

        font-size: 0.7rem;

        /*background-color: yellow;*/

}





/*

 * -----------------------------------------------------

 *  選択内容一覧

 * -----------------------------------------------------

 */



#pc-side-menu-area-body2 {
        position: absolute;
        top: 60px;
        left: 0px;
        height: 748px;
        width: 485px;
        z-index: 100;
        display: flex;
        flex-direction: column;
        background: linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
        overflow: hidden;
        font-size: 0.5rem;
        border-radius: 12px 12px 0 0;
        border: 1px solid #d7e3ed;
        box-shadow: 0 8px 22px rgba(17, 17, 17, 0.08);
}



#pc-side-menu-area-header2 {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 58px;
        z-index: 4000;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 0 16px;
        font-size: 0.78rem;
        background: linear-gradient(135deg, #4ba9e3 0%, #2f8fd3 100%);
        border-radius: 12px 12px 0 0;
        border-bottom: 1px solid #86c3ea;
        box-sizing: border-box;
        opacity: 1;
}



#sideMenu_scrollOuter2 {
        position: absolute;
        top: 66px;
        left: 10px;
        height: 676px;
        width: 466px;
        z-index: 5000;
        background-color: transparent;
        overflow: hidden;
        font-size: 0.5rem;
}



#pc-side-menu-area-header2-text {
        position: static;
        flex: 1 1 auto;
        min-width: 0;
        background-color: transparent;
        font-size: 0.8rem;
        line-height: 1.35;
        color: #fff;
        overflow: hidden;
}



#pc-side-menu-area-header2-image {
        position: static;
        width: 24px;
        height: 24px;
        flex: 0 0 24px;
}

#pc-side-menu-area-header2-text .text-bold2 {
        font-size: 0.9rem;
        font-weight: 700;
}

#sideMenu_scrollOuter2_scrollInner {
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
        gap: 8px;
        width: 100% !important;
        box-sizing: border-box;
        padding: 2px 2px 10px;
}

#sideMenu_scrollOuter2_scrollbar {
        right: 2px !important;
        width: 12px !important;
}

#sideMenu_scrollOuter2_scrollbarInner {
        right: 3px !important;
        width: 4px !important;
        border-radius: 999px !important;
        background-color: #87b7d9 !important;
        opacity: 0.65 !important;
}



.pc-selectArea-div_title {
        position: static;
        flex: 0 0 100%;
        width: auto;
        min-height: 20px;
        margin: 0;
        font-size: 0.82rem;
        line-height: 1.3;
        font-weight: 700;
        color: #243746;
}



.pc-selectArea-div_img {
        position: static;
        flex: 0 0 64px;
        width: 64px;
        height: 64px;
        border: 1px solid #dfe7ee;
        border-radius: 8px;
        object-fit: cover;
}



.pc-selectArea-div_texts {
        position: static;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        gap: 4px;
        flex: 1 1 0;
        min-width: 0;
        min-height: 64px;
        width: auto;
        font-size: 0.72rem;
        line-height: 1.35;
        color: #2f4150;
}



.pc-selectArea-div_text1 {
        width: auto;
        font-size: 0.72rem;
        line-height: 1.35;
        margin-bottom: 0;
        color: #1f3442;
        font-weight: 600;
        word-break: break-word;
}



.pc-selectArea-div_text2 {
        width: auto;
        font-size: 0.72rem;
        line-height: 1.35;
        color: #4f6474;
        word-break: break-word;
}



.pc-selectArea-div {
        width: calc(50% - 4px);
        min-height: 116px;
        float: none;
        display: flex;
        flex-wrap: wrap;
        align-content: flex-start;
        gap: 8px;
        background-color: #fff;
        margin-right: 0;
        margin-bottom: 0;
        box-sizing: border-box;
        border: 1px solid #d8e3ec;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(17, 17, 17, 0.05);
        cursor: pointer;
        padding: 9px 10px 10px;
        transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.pc-selectArea-div:hover {
        border-color: #4ba9e3;
        box-shadow: 0 8px 16px rgba(75, 169, 227, 0.18);
        transform: translateY(-2px);
}



.pc-side-menu-area-shadow {

        position: absolute;

        bottom: -1px;

        left: 0px;

        height: 10px;

        width: 485px;

        background-image: url("../images/side_menu_shadow.png");

        z-index: 5000;

        opacity: 0.3;

}



.sideMenu_line {

        width: 420px;

        height: 12px;

        margin-left: 19px;

        background-image: url("../images/bg_line.png");

}



#sideMenu_scrollOuter {

        position: absolute;

        top: 124px;

        left: 13px;

        height: 620px;

        width: 465px;

        z-index: 5000;

        background-color: none;

        overflow: hidden;

        font-size: 0.5rem;

        display: none;

}



.sideMenu_thumbImage {

        position: static;

        height: 64px !important;

        width: 64px !important;

        z-index: 10;

        border-radius: 50% !important;

        border: 1px solid #d8e4ee;

        object-fit: cover;

}



.sideMenu_thumbDisplayArea {

        position: relative;

        float: none;

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: flex-start;

        gap: 8px;

        width: calc(20% - 7px) !important;

        min-height: 112px;

        margin-right: 0 !important;

        margin-left: 0 !important;

        margin-bottom: 0 !important;

        transition: transform 0.18s ease;

}



.sideMenu_thumbImageOver {

        position: absolute;

        top: 0 !important;

        left: 50% !important;

        transform: translateX(-50%);

        height: 64px !important;

        width: 64px !important;

        z-index: 50;

        opacity: 1;

        cursor: pointer;

        border-radius: 50% !important;

}



.sideMenu_thumbImageOver_selected {

        cursor: default;

        background-image: none !important;

        box-shadow: 0 0 0 2px rgba(75, 169, 227, 0.9) inset, 0 0 0 3px rgba(75, 169, 227, 0.25);

}



.sideMenu_thumbImageOver_notSelect {

        cursor: default;

        background-color: rgba(255,255,255,0.45);

        width: 64px !important;

        height: 64px !important;

        border-radius: 50% !important;

}



.sideMenu_thumbName {

        position: static;

        z-index: 20;

        font-size: 0.7rem;

        line-height: 15px;

        color: #333;

        text-align: center;

        min-height: 30px;

        line-height: 1.3;

        transition: color 0.18s ease;
        
        text-transform: uppercase;

}



.sideMenu_thumbDisplayArea .sideMenu_thumbImage {

        transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;

}



.sideMenu_thumbDisplayArea:hover {

        transform: translateY(-2px);

}



.sideMenu_thumbDisplayArea:hover .sideMenu_thumbImage {

        transform: scale(1.05);

        border-color: #4ba9e3;

        box-shadow: 0 6px 14px rgba(75, 169, 227, 0.25);

}



.sideMenu_thumbDisplayArea:hover .sideMenu_thumbName {

        color: #1f7cb8;

}



.sideMenu_headLineFirst {

        position: relative;

        left: 0 !important;

        width: 100% !important;

        min-height: 17px;

        color: #000;

        font-size: 1rem;

        line-height: 18px;

        margin-top: 0px;

        margin-bottom: 5px;

        padding-top: 20px;

        padding-bottom: 3px;

        font-weight: bold;

}



.sideMenu_headLine {

        position: relative;

        left: 0 !important;

        width: 100% !important;

        min-height: 17px;

        color: #000;

        font-size: 1rem;

        line-height: 18px;

        margin-top: 15px;

        margin-bottom: 5px;

        padding-top: 10px;

        padding-bottom: 3px;

        font-weight: bold;

}



.sideMenu_thumbBlock {

        position: relative;

        min-height: 50px;

        clear: both;

        gap: 8px;

        margin-bottom: 12px;

        padding-bottom: 8px;

        display: flex;

        justify-content: flex-start;

        flex-wrap: wrap;
        
        width: 100%;

}



.sideMenu_thumbBlock:after {

        display: block;

        clear: both;

        content: "";

}



.sideMenu_thumbBlock > br {

        display: none;

}



.sideMenu_line {

        width: 100% !important;

        margin-left: 0 !important;
        
        margin-top: 15px;

}





/*

 * -----------------------------------------------------

 *  デバッグログ

 * -----------------------------------------------------

 */

#debagLog {

        width: 86%;

        margin-left: 4%;

        height: 250px;

        background-color: rgba(0,0,0,0.5);

        border: none;

        color: #ccc;

        padding: 1% 3% 3% 3%;

}



#debagLog::selection {

       background: #aaa;

}





/*

 * -----------------------------------------------------

 *  index

 * -----------------------------------------------------

 */



#testBtn {

        position: absolute;

        top: 150px;

        left: 850px;

        height: 50px;

        width: 160px;

        z-index: 50;

        background-color: #ccc;

        cursor: pointer;

        text-align: center;

        line-height: 50px;

}



#testBtn2 {

        position: absolute;

        top: 350px;

        left: 850px;

        height: 150px;

        width: 160px;

        z-index: 5000;

        background-color: blue;

        cursor: pointer;

        text-align: center;

        line-height: 50px;

}



#testBtn3 {

        position: absolute;

        top: 550px;

        left: 850px;

        height: 150px;

        width: 160px;

        z-index: 5000;

        background-color: red;

        cursor: pointer;

        text-align: center;

        line-height: 50px;

}





/*  EOF  */