@charset "UTF-8"; #tab li { display: flex; flex-direction: column; justify-content: center; float: left; list-style: none; width: 25%; cursor: pointer; text-align: center; margin-left: 10px; position: relative; z-index: 1; } .tab-li-p-style { white-space: initial; margin: 2px; } .tab-li-p-padding { padding-left: 10px; padding-right: 10px; } .font-style-1::after { content: ""; margin-left: -8px; bottom: -9px; border-color: #0D2EA1 transparent transparent transparent; border-style: solid; border-width: 10px 8px 0 8px; width: 0; height: 0; position: absolute; left: 50%; } #container { position: relative; } #content1, #content2, #content3, #content4 { width: 300px; height: 50px; padding: 30px; position: absolute; top: 40px; left: 0; } #content1 { background-color: #ffff; width: 95%; } #content2 { background-color: #ffff; width: 95%; } #content3 { background-color: #ffff; width: 95%; } #content4 { background-color: #ffff; width: 95%; } .mod-dateList-height { height: 170px; } .select-tab-border { border: solid 1px #0D2EA1 !important; } #tab1, #tab2, #tab3, #tab4 { background-color: #e4e4e4; border: solid 1px #d9d9d9; } .text-padding { padding-bottom: 0px; } .margin-noset { margin: 0; } .left-inlne { float: inline-end; } .line-height { line-height: normal; } .opacity { opacity: unset !important; } .tab-location { display: flex; } .font-style { white-space: nowrap; margin-top: -6px; text-align: center; /* font-family: YuGothic; */ font-style: normal; font-weight: bold; font-size: 14px; } .search-by-purpose-body a::before, .mod-dateList_description a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #0D2EA1; border-right: 2px solid #0D2EA1; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -0.25em; margin-right: 6px; } .mod-linkList a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #0D2EA1; border-right: 2px solid #0D2EA1; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -0.25em; margin-right: 11px; margin-left: -3px; } .search-by-purpose { width: calc((100% - 20px * 3) / 3); margin-left: 20px; margin-bottom: 20px; display: block; /* background: #f2f2f2; */ padding: 13px 20px; box-sizing: border-box; } .mod-bannerList .product_li_area { box-shadow: 0 4px 6px #E4E1E1; border: 1px solid #EEEEEE; margin-bottom: 40px; background: #f2f2f2; } .mod-bannerList .product_img_area { text-align: center; background-color: #FFFFFF; } .mod-bannerList .product_text_area { background: #f2f2f2; margin-bottom: 0px; height: auto; display: flex; } .mod-bannerList .product_text_area .product_text_first_area { padding: 15px 7px 0px 12px; margin-bottom: 0px; } .mod-bannerList .product_text_area .product_text_second_area { padding: 15px 10px 15px 0px; margin-bottom: 0px; } .mod-bannerList .product_text_area.product_text_min_area { height: auto; } .mod-bannerList .product_text_area.product_text_three_area { height: auto; } .mod-bannerList div { margin-bottom: 0px; } .mod-bannerList .product_text_area .product_text_first_area p:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } .mod-bannerList .product_text_area p span { padding: 10px 0px 0px 0px; } .mod-bannerList .product_text_area .product_text_span_area { font-size: 12px; } .common3_button_area { border-radius: 5px; background-color: #0d2ea1; height: 35px; width: 130px; border: 0px; } /* 修理サービスご利用の流れ START*/ .repair-step { border-left: 1px #0E98D7 solid; margin-left: 30px; display: flex; flex-direction: row; } .repair-step-last { margin-left: 30px; display: flex; flex-direction: row; } .circle { border-radius: 50%; width: 60px; height: 60px; background-color: #0E98D7; } .repair-step_icon { position: relative; left: -30px; top: -30px; } .repair-step_icon p { text-align: center; line-height: 60px; color: #FFFFFF; font-size: 12px; } .repair-step_content { width: 100%; } .grid-col_2 { display: grid; grid-template-areas: "a b"; grid-template-columns: 24% auto; } .grid-col_3 { display: grid; grid-template-columns: repeat(3, 33.33%); } .grid-item_colspan_2 { grid-column-start: span 2; } .grid-item_colspan_3 { grid-column-start: span 3; } .grid-item_rowspan_2 { grid-row-start: span 2; } .grid-item_justify_end { justify-self: end; } /* 修理サービスご利用の流れ END */ /* ボタン START */ .btn_1 { text-align: center; width: 100%; } .btn_1 a { width: 100%; font-size: 14px; line-height: 1.33; padding: 12px 0px; display: inline-block; margin-top: 1em; background-color: #0D2EA1; color: #fff; cursor: pointer; } .btn_1 a:after { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -0.25em; position: relative; right: -30px; } /* ボタン END */ /* フォント START*/ .fs-12_m { font-size: 12px; font-weight: 500; } .fs-12_b { font-size: 12px; font-weight: 700; } .fs-14_m { font-size: 14px; font-weight: 500; } .fs-14_b { font-size: 14px; font-weight: 700; } .fs-16_m { font-size: 16px; font-weight: 500; } .fs-16_b { font-size: 16px; font-weight: 700; } /* フォント END*/ /* ヘルプメッセージ START */ .help_green { font-size: 14px; font-weight: 500; } .help_green a { color: #0043C1; width: 100%; } .help_green img { display: inline-block; vertical-align: middle; text-decoration: none; } /* ヘルプメッセージ END */ .mod-headingLv2 { border-bottom: unset; /* margin: 30px 0 20px;; */ } .heading_line { margin-top: 10px; width: 100%; height: 1px; background: linear-gradient(to right, #d9d9d9, #d9d9d9 50%, #d9d9d9, #d9d9d9 100%); display: flex; justify-content: flex-start; position: relative; } .heading_blue { width: 40px; height: 1px; background: linear-gradient(to right, #0D2EA1, #0D2EA1 50%, #0D2EA1, #0D2EA1 100%); position: absolute; top: 0px; } .st-mobileMenu_item_topline { border-top: 1px solid #D9D9D9; } /* ++overlay ========================================*/ .mod-heading .leadtxt { margin: 0 0 2px; color: #7fa308; font-size: 1.2em; font-weight: bold; } .unit-overlay-header .title { margin: 0 0 6px; font-size: 1.6em; } .unit-overlay-header h1 { line-height: 1.5; } #blackLayer { background-color: rgba(255, 255, 255, 0.8);; } .unit-overlay { display: none; position: absolute; width: 100%; height: 100%; font-weight: bold; } .unit-overlay .inner { position: relative; width: 775px; max-height: 80%; margin: 5% auto 0; border: 5px solid #afafaf; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; background: #fff; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .6); overflow: auto; } .unit-overlay .inner02 { padding: 15px 25px 10px; } .unit-overlay a:hover img, .unit-overlay a:focus img, .unit-overlay a:active img { opacity: .6; filter: opacity=60; } .unit-overlay .close01 { position: absolute; top: 5px; right: 5px; } .unit-overlay .close02 { text-align: center; } .unit-overlay .close03 { text-align: center; margin-top: 10px; } .unit-overlay-header .title { margin: 0 0 6px; font-size: 1.6em; } .unit-overlay-header .text { margin: 0 0 20px; color: #666; font-size: 1.2em; } .unit-overlay .list { margin: 12px 0 0; padding: 16px 0 0; border-top: dotted 1px rgb(220, 220, 220, 1); list-style: none; } .unit-overlay .first-child { margin: 0; padding: 0; background: none; border-top: unset; } .unit-overlay .list li { float: left; width: 177px; } .unit-overlay .list a { display: block; padding: 0 8px 0 0; } .unit-overlay .list a img { float: left; vertical-align: top; border: 0; } .unit-overlay .list a span { display: block; float: right; width: 112px; word-wrap: break-word; } .unit-overlay .list a span.txt { float: none; padding-left: 66px; } .unit-overlay .select-country { margin: 0 0 20px; } .unit-overlay .select-country .column2 ul { float: left; width: 50%; } .unit-overlay .select-country .column3 ul { float: left; width: 33%; } .unit-overlay .select-country a { display: block; margin: 0 0 10px; *zoom: 1; } .unit-overlay .select-country a img { margin: 0 10px 0 0; vertical-align: text-bottom; } .mod-button { display: inline-block; padding: 1px 8px; border: 1px solid #0039ae; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; background: linear-gradient(#46A9F5 0%, #1A74BA 100%); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); -ms-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); -o-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); color: #fff; font-family: Arial, Helvetica, sans-serif; font-weight: bold; text-shadow: 0 -1px 0 rgba(0, 0, 0, .5); cursor: pointer; } .mod-pt20 { padding-top: 20px; } .mod-h2-04 { color: #666; } .mod-mb15 { margin-bottom: 15px; } .step2_title, .model_image { display: none; } .unit-overlay p { margin: 0; padding: 0; } .unit-overlay h2 { line-height: 1.5; font-size: 100%; } .group li { font-weight: normal; margin: 0; padding: 0; display: list-item; text-align: -webkit-match-parent; } .group li a { color: #0039ae; text-decoration: none; } .group li a:visited { color: purple !important; } .group:after { display: block; clear: both; height: 0; visibility: hidden; content: "."; } /* ++overlay ========================================*/ .position-static-important { position: static !important; } .margin-top-40 { margin-top: 40px; } .height-auto-important { height: auto !important; } .display-none { display: none; } .display-block { display: block; } .mod-accordion_trigger.is-close .arrow:after { -webkit-transform: rotate(-225deg); transform: rotate(-225deg); margin-top: 0; } .show_sp { display: none; } .show_pc { display: block; } .isexpand { display: none; } @media screen and (max-width: 1024px) { .hidden-1 { display: none !important; } } /* sp */ @media screen and (max-width: 640px) { .tab-li-p-padding { padding-left: 0; padding-right: 0; } .mod-bannerList .product_li_area { margin-bottom: 25px !important; } .mod-bannerList .product_text_area .product_text_first_area { padding: 15px 6px 0px 8px !important; } /* .mod-bannerList .product_text_area.product_text_min_area { height: 58px !important; } */ .mod-bannerList .product_text_area .product_text_first_area p:before { margin-right: 2px !important; } .margin-noset p:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 7px; height: 7px; border-top: 2px solid #333; border-right: 2px solid #333; transform: rotate(135deg); margin-top: 15px; margin-right: 7px; position: absolute; right: 0.75em; } #tab li { float: left; list-style: none; width: 250px; height: 40px; /* line-height: 50px; */ cursor: pointer; text-align: left; margin-left: 10px; position: relative; z-index: 1; } .mod-linkListWLead-grid3 ul { margin-bottom: -20px; } .mod-dateList>ul>li { width: 100% !important; margin-bottom: 20px; } .tab-li-margin { margin: auto !important; } .hidden { display: none; } .margin-noset { margin: unset !important; } .line-height { line-height: inherit; } .sp-show { display: block !important; } .slide { float: left; list-style: none; width: 99%; height: 40px; line-height: 40px; cursor: pointer; text-align: left; position: relative; z-index: 1; background-color: #e4e4e4; border: solid 2px #d9d9d9; border-bottom-color: #FFF; margin-top: -2px; margin-bottom: 0; } .first-button-up { margin-top: -10px; } .mod-dateList-li1 { display: table-row !important; } .bottom ul { margin-bottom: 5px !important; border: solid 1px #d9d9d9; } .bottom1 ul { margin-bottom: 5px !important; border: solid 1px #d9d9d9; float: inline-start; margin-top: -1px; } .bottom2 ul { margin-bottom: 5px !important; border: solid 1px #d9d9d9; float: inline-start; margin-top: -1px; } .bottom3 ul { margin-bottom: 5px !important; border: solid 1px #d9d9d9; float: inline-start; margin-top: -1px; } .search-by-purpose { width: 100%; } .sp_mar_0 { margin: 0px !important; } /* ++SP modal ========================================*/ .mod-heading .leadtxt { margin: 0 0 2px; color: #7fa308; font-size: 1.2em; font-weight: bold; } .unit-overlay-header .title { margin: 0 0 6px; font-size: 1.6em; } .unit-overlay-header h1 { line-height: 1.5; } .unit-overlay { display: none; position: absolute; width: 100%; height: 100%; font-weight: bold; } .unit-overlay .inner { position: relative; width: auto; max-height: 80%; margin: 5% auto 0; border: 5px solid #afafaf; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; background: #fff; -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .6); overflow: auto; } .unit-overlay .inner02 { padding: 15px 25px 10px; } .unit-overlay a:hover img, .unit-overlay a:focus img, .unit-overlay a:active img { opacity: .6; filter: opacity=60; } .unit-overlay .close01 { position: absolute; top: 5px; right: 5px; } .unit-overlay .close02 { text-align: center; } .unit-overlay .close03 { text-align: center; margin-top: 10px; } .unit-overlay-header .title { margin: 0 0 6px; font-size: 1.6em; } .unit-overlay-header .text { margin: 0 0 20px; color: #666; font-size: 1.2em; } .unit-overlay p { margin: 0; padding: 0; } .mod-toggle-section .mod-toggle-section-button { display: block; position: relative; padding: 10px 20px 10px 10px; border-bottom: 1px solid #d0cece; background: -webkit-gradient(linear, left top, left bottom, color-stop(30%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, .1))); background: linear-gradient(rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .1) 100%); -webkit-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 1); box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 1); font-size: 14px; height: 21px; } .mod-toggle-section:first-of-type .mod-toggle-section-button { border-top: 1px solid #d0cece; } .mod-toggle-section div { margin: 0; padding: 0; font-size: 100%; word-wrap: break-word; } .mod-toggle-section a { color: #1a74ba; text-decoration: none; } .mod-toggle-section a:-webkit-any-link { color: -webkit-link; cursor: pointer; } .mod-toggle-section .mod-toggle-section-button:after { display: block; position: absolute; top: 50%; right: 20px; margin: -16px 0 0; zoom: 0.5; } .mod-fig-box .wrap { display: table; width: 100%; table-layout: fixed; } .mod-fig-box .wrap figure, .mod-fig-box .wrap .body { display: table-cell; vertical-align: middle; } .mod-toggle-section .mod-toggle-section-pane { display: none; padding: 15px 10px; border-bottom: 1px solid #d0cece; } .mod-text-center { text-align: center; } .mod-toggle-section-pane img { -moz-transform-origin: 0 0; -moz-transform: scale(.5); zoom: .5; max-width: 100%; height: auto; vertical-align: top; } .mod-round-box-02 { padding: 10px 12px; border: 3px solid #989797; -webkit-border-radius: 4px; border-radius: 4px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, .1))); background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .1) 100%); -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, .8), inset 0 -2px 1px rgba(255, 255, 255, .5); box-shadow: inset 0 0 1px rgba(0, 0, 0, .8), inset 0 -2px 1px rgba(255, 255, 255, .5); } .mod-h2-normal { margin: 0 0 5px; font-size: 14px; } .mod-search-box { display: table; width: 100%; table-layout: fixed; } .mod-search-box form { display: table; width: 100%; table-layout: fixed; } .mod-search-box .input { width: 70%; display: table-cell; } .mod-search-box .input input { width: 95%; padding: 4px; -webkit-box-sizing: border-box; box-sizing: border-box; color: #000; -webkit-tap-highlight-color: rgba(00, 33, 99, 0.3); text-decoration: none; opacity: 1; } .mod-search-box .input, .mod-search-box .button { display: table-cell; } .mod-button { display: inline-block; padding: 4px 10px; border: 1px solid #1a72b6; -webkit-border-radius: 4px; border-radius: 4px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #46a9f5), color-stop(100%, #1a74ba)); background: linear-gradient(#46a9f5 0%, #1a74ba 100%); background-color: #1a74ba; -webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); box-shadow: inset 0 1px 1px rgba(255, 255, 255, .4), 0 2px 2px rgba(0, 0, 0, .3); color: #fff; font-weight: bold; } .mod-button.block { display: block; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .mod-fig-box-img{ zoom: 0.5; opacity: 1; } .mod-fig-box-width { width: 98%; } /* ++SP modal ========================================*/ .show_sp { display: block; } .show_pc { display: none; } }