input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } html { scroll-behavior: smooth; } .c-tooltip { position: absolute; background: #f2f2f2; border: 1px solid rgba(0, 0, 0, .3); width: 100%; padding: 8px; line-height: 16px; z-index: 700; display: none; left: 50%; bottom: 0; transform: translate(-50%, 100%); } .accordion li .accordion-header { margin-bottom: 20px; } input[type=number] { -moz-appearance: textfield; } .product_item { display: table; width: 100%; border-bottom: 1px solid #e5e5e5; } .product_item__info_ct, .accessary_item__info { display: table; /*display: flex;*/ align-items: center; } .product_item__info_ct { width: 100%; } .product_item__info { text-align: right; } .product_item__name, .product_item__info { display: table-cell; vertical-align: middle; width: 50%; } .product_item__name { padding-right: 2%; } .product_item__price, .product_item__number, .accessary_item__price, .accessary_item__number { display: table-cell; vertical-align: middle; } .product_item__price, .product_item__number { width: 50%; position: relative; } .product_item__price { text-align: left; } .mh5 { margin: 0 5px; } .form-control.mh5 { width: 95%; } .product_item__input, .accessary_item__input { display: inline !important; } .p0 { padding: 0 !important; } span .c-text-field { text-align: right; } #product_go { position: relative; } .product_item__number .c-text-field { width: 70%; } #accessory .c-text-field { width: 100px; } .lbl { position: relative; display: block; text-align: left; float: left; padding: 4px 0 4px 25px; box-sizing: border-box; } .lbl:before { content: ''; width: 20px; height: 20px; display: inline-block; background: #f00; position: absolute; top: 50%; margin-top: -10px; left: 0; } /*.lbl.is-m { min-width: 10em; } .lbl.is-l { min-width: 13em; }*/ .lbl--glcn:before { background: #e2e5ec; } .lbl--obsn:before { background: #3a322d; } .lbl--plt:before { background: #989898; } .lbl--blk:before { background: #000; } .lbl--bgd:before { background: #874b52; } .lbl--cbl:before { background: #407176; } .lbl--sds:before { background: #CEB1A5; } .lbl--ibl:before { background: #7894AD; } .lbl--gry:before { /*background: #505050;*/ background: #717579; } .lbl--platinum:before { background: #717579; } .lbl--sage:before { background: #9DA896; } .lbl--van:before { background: #4c5a3e; } .step_pos__container { position: fixed; top: 0; left: 0; z-index: 100; width: 100%; transform: translate(0, -100%); } .step_pos__container.is-show { transform: translate(0, 0); } .step_pos__items a.step_pos__item:nth-child(1) { z-index: 4; } .step_pos__items a.step_pos__item:nth-child(2) { z-index: 3; } .step_pos__items a.step_pos__item:nth-child(3) { z-index: 2; } .m-rich-heading { height: auto !important; min-height: 200px; } .float_result_view { background: #fff; overflow: auto; /*height: 500px;*/ } .form input.c-text-field { width: 100% !important; } .four-item.m-bile .m-content-placement-item { border: 1px solid #c7c7c7; padding: 15px 10px !important; } .for_equal { height: 24px; display: block; } /*nav.c-link-navigation li a.c-hyperlink.f-image { margin: 0 4px 21px !important }*/ .product_item__info_ct .product_item__info_cl:not(:first-child) { border-top: 1px solid #c7c7c7; } #primary-container .m-banner p.c-paragraph-1 { padding: 0; } .step-bg { background: url(../Images/simulator_step_head01.jpg) no-repeat center center; padding-bottom: 10px; } .elm_cl02 { min-width: 100px; } .custom-top-margin { margin-top: -14px; } #step01 .c-link-navigation > ul { display: flex; justify-content: center; align-items: baseline; } #step01 .c-link-navigation > ul li { text-align: center; font-weight: bold; text-decoration: none; margin: 20px; } #step01 .c-link-navigation > ul li a { display: inline-block; } @media only screen and (max-width: 1084px) { #step01 .c-link-navigation > ul li img { max-width: 100%; transform: scale(1.1); } #step01 .c-link-navigation > ul li a.c-hyperlink.f-image { margin: 0 0px 21px !important; } #step01 .c-link-navigation > ul li a.c-hyperlink div { padding: 0 3px; } } @media only screen and (min-width: 768px) { .accessary_item { padding: 0 2%; border-right: 1px solid #b2b2b2; } .accessary_items [data-grid*="col-12"] [data-grid*="col-4"] [data-grid*="col-12"] { } .accessary_items [class*="row"] .col:nth-child(3n).accessary_item { border-right: 0; } } .input_area { position: relative; /* max-width: 1215px; margin: 0 auto;*/ } .input_area__main { position: relative; z-index: 2; } .float_result { /*width: 1215px;*/ top: 0; position: absolute; } .float_result.is-fixed { position: fixed; } .float_result.is-bottom { top: auto; bottom: 0; } .float_result_box { padding: 20px; box-sizing: border-box; } @media screen and (max-width: 768px) { .float_result { margin: 0 10px; } } @media only screen and (max-width: 859px) { .step_pos { display: none; } /*.float_result_view { display: none; }*/ #float_result.float_result { margin-top: 48px; } .float_result { position: static; width: 100%; margin: 0 0 10px; z-index: 9999; } .float_result_box { padding: 2%; z-index: 99; } .float_result_box.is-fixed { /*position: fixed;*/ position: sticky; width: 100%; top: auto; left: 0; bottom: 0; } .float_result_box__inr { background: #fff; padding: 2%; /*display: flex;*/ justify-content: space-between; align-items: center; } .float_result_btn a.c-button { margin: 0; } /* .float_result_total { max-width: 50%; }*/ /*.float_result_total__delete_all { display: none; }*/ .float_result_total__price { padding: 0; } .four-item.m-bile .m-content-placement-item { display: flex; justify-content: flex-start; align-items: center; text-align: left; margin: 8px 0 0 0; padding: 7px 8px !important; } .m-bile .m-content-placement-item picture { padding: 0; margin: 0; position: static; width: 28%; margin: 0 2% 0 0; height: auto; } .m-bile .m-content-placement-item picture img { max-width: 100%; position: static; margin: 0; padding: 0; transform: scale(1.1); } .m-bile .m-content-placement-item > div { width: 70%; } .m-bile .m-content-placement-item .c-hyperlink { padding: 2px 0; margin: 0; } .m-bile .m-content-placement-item .c-heading { padding: 0 !important; margin: 0 !important; } .elm_unit.c-heading-3, .elm_num.app_total.c-heading-3 { font-size: 18px; line-height: 24px; } .xfnt { font-size: 1em !important; } } @media only screen and (max-width: 540px) { .product_item__name, .product_item__info, .product_item__price, .product_item__price, .accessary_item__price, .accessary_item__number { width: 100%; display: block; } .accessary_item__price { margin-bottom: 10px; } .accessary_item__price > .elm_unit { padding-left: 0px; } .accessary_item__number, .product_item__number { display: flex; width: 100%; } .product_item__number .c-text-field { width: 100%; } #accessory .c-text-field { width: 95%; } .elm_unit { padding: 5px; } .product_item__info_ct, .accessary_item__info { display: block; } .product_item__info, .product_item__price { text-align: left; margin-bottom: 10px; } .lbl { float: none; } .mh5 { margin: 0px; } } @media only screen and (max-width: 667px) { .float_result_box__inr { flex-direction: column; } .float_result_total { max-width: 100%; } } @media only screen and (max-width: 767px) { a.c-button.sm-font { font-size: 8px; } .m-rich-heading .c-paragraph-3 { display: block; } .input_area__main .m-rich-heading .c-logo { display: block; position: static; margin: 20px auto; } .input_area__main .m-rich-heading { text-align: center; } #step01 nav.c-link-navigation li a.c-hyperlink.f-image { margin: 0 4px 4px !important; } /*#step01 nav.c-link-navigation li a.c-hyperlink picture { display: none; }*/ #step01 nav.c-link-navigation li a.c-hyperlink.f-image div { max-width: initial } #step01 nav.c-link-navigation > ul { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: center; } .product_item__name { font-size: 13px; padding-right: 12px; } .product_item__info { font-size: 13px; } .step_pos__item { font-size: 13px !important; padding: 10px 10px 6px 12px !important; } .product_item__number .c-text-field { padding: 6px 5px !important; } .float_result_box { padding: 10px 10px; } } @media only screen and (min-width: 768px) and (max-width: 1083px) { a.c-button.sm-font { font-size: 10px; } .accessary_item__info { display: block !important; } .accessary_item__number { display: flex !important; justify-content: flex-start; align-items: center; margin: 10px 0 0; } } /* --------------------------- estimate --------------------------- */ .estimate { display: none; margin: 0 0 50px; color: #000; } .estimate__inr { width: 100%; margin: 0 auto; } .estimate__h { font-size: .9rem; text-align: center; margin: 0 0 30px; padding: 10px 0; } .note { font-size: .6rem; line-height: 1.1rem; } .estimate__info { margin: 0 0 30px; } .estimate_to { width: 45%; float: left; } .estimate_to__company { font-size: .8rem; border-bottom: 1px solid #000; padding: 0 0 5px; margin: 0 0 10px; display: table; width: 100%; } .estimate_to__company .elm_name { display: table-cell; vertical-align: middle; padding: 0 10px 0 0; } .estimate_to__company .elm_unit { display: table-cell; vertical-align: middle; width: 3em; } .estimate_to__department { font-size: .6rem; } .estimate_from { width: 39%; float: right; } .estimate_from__date { font-size: .6rem; margin: 0 0 3px; } .estimate_from__company { font-size: .8rem; margin: 3px 0 4px; } .estimate_from__address { font-size: .6rem; line-height: 1rem; } .estimate_tb { border: 2px solid #000; width: 100%; border-collapse: separate; } .estimate_tb th, .estimate_tb td { font-size: .7rem; line-height: 1.2; padding: 5px 10px; } .estimate_tb th { border-left: 1px solid #ddd; border-bottom: 1px solid #000; font-weight: 400; } .estimate_tb td { border-left: 1px solid #ddd; border-top: 1px solid #ddd; } .estimate_tb tbody tr:first-child td { border-top: 0; } .estimate_tb .elm_ch01 { border-left: 0; text-align: left; } .estimate_tb .elm_ch02 { width: 10%; text-align: center; } .estimate_tb .elm_ch03 { width: 7%; text-align: center; } .estimate_tb .elm_ch04 { width: 17%; text-align: center; } .estimate_tb .elm_ch05 { width: 14%; text-align: center; } .estimate_tb .elm_cl01 { border-left: 0; } .estimate_tb .elm_cl03 { text-align: right; } .estimate_tb .elm_cl04 { text-align: right; } .estimate_tb .elm_cl05 { text-align: right; } .estimate_tb .elm_cl_total { border: 0; border-top: 3px double #000; } .estimate_tb__total_txt { font-size: 1rem; } .estimate_tb__total_price { font-size: 1rem; text-align: right; } .estimate__note { margin: 20px 0 0; } .estimate__comment { margin: 40px 0 0; border: 1px dotted #000; padding: 10px; font-size: .8em; } .estimate__comment_h { margin: 0 0 5px; } .estimate__comment_txt { word-wrap: break-word; } /* --------------------------- print --------------------------- */ @media print { #headerArea, #footerArea, #primary-container { display: none; } .estimate { display: block; } }