@charset "UTF-8"; /* reset -----------------------------------------*/ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, embed, figure { margin: 0; padding: 0; border: 0; vertical-align: baseline; font-weight: normal; font-size: 100%; } html { font-size: 62.5%; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } input, textarea { margin: 0; padding: 0; } ol, ul { list-style: none; } *, *:before, *:after { box-sizing: border-box; } /* base -----------------------------------------*/ body { background: #fff; color: #333; font-feature-settings: "palt"; line-height: 1.4; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; } button { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; cursor: pointer; transition: all 0.3s; } button:hover, button:focus { opacity: 0.7; } a { color: #06c; text-decoration: none; transition: all 0.3s; } a:hover, a:focus { opacity: 0.7; } .btn_style { margin: 0 auto; position: relative; display: block; max-width: 360px; width: 100%; padding: 16px 80px 16px 16px; background: #e60012; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3); text-align: center; } .btn_style .text { padding-left: 27px; background: url("/img/landing_page/common/icon03.png") no-repeat 0 center; background-size: 17px auto; color: #fff; white-space: nowrap; font-weight: 900; font-size: 20px; } .btn_style .thumb { position: absolute; top: -15px; right: 10px; border: 1px solid #ccc; } img { width: 100%; max-width: 100%; vertical-align: bottom; } .lp-textPhoneLink { display: flex; flex-direction: column; } .lp-textPhoneLink-numberGroup { display: flex; align-items: center; color: #333; font-size: 24px; font-weight: bold; text-decoration: none; cursor: text; } .lp-textPhoneLink-number { line-height: 1; } .lp-textPhoneLink-numberGroupOuter { display: inline-block; } .lp-textPhoneLink-icon { display: flex; width: 40px; margin: 0px 8px 0 0; } .lp-textPhoneLink-notes { font-size: 12px; line-height: 1.2; } .lp-layout-header-logo { min-width: 110px; margin: 0; } .lp-layout-header-logo img { width: auto; max-width: 100%; height: 20px; } @media screen and (max-width: 1080px) { .lp-layout-header-logo { min-width: 99px; margin: 0; } } @media screen and (max-width: 767px) { .lp-textPhoneLink { display: none; } } .lp-layout-header-link { color: #333; font-weight: bold; line-height: 1.31; text-decoration: underline; } .lp-layout-header-link:hover, .lp-layout-header-link:active, .lp-layout-header-link:focus { text-decoration: none; } .lp_footer { display: flex; justify-content: center; align-items: center; padding: 20px; background: #333; } .lp_footer .link { display: flex; justify-content: center; align-items: center; } .lp_footer .link li { position: relative; margin: 0 15px; color: #fff; font-size: 14px; } .lp_footer .link li a { color: #fff; font-size: 14px; } .lp_footer .link li+li::before { position: absolute; left: -15px; display: block; width: 1px; height: 100%; background: #fff; content: ""; } @media only screen and (max-width: 767px) { .lp-layout-header-logo { min-width: 26.40vw; margin: 0; } /* lp_footer */ .lp_footer .link { flex-wrap: wrap; } .lp_footer .link .copy { margin-top: 10px; width: 100%; text-align: center; } .lp_footer .link .copy::before { display: none; } } /* Phone */ .lp-textPhone-outer { display: flex; justify-content: center; align-items: center; padding: 75px 5vw 65px; border-top: 1px solid #ccc; } .lp-textPhone-outer .lp-text.of-primary { font-size: 20px; font-weight: bold; } .lp-textPhone-outer .lp-textPhone { margin-left: 28px; } a.lp-textPhone-body, a:hover.lp-textPhone-body { display: inline-block; color: #333; text-decoration: none; cursor: default; opacity: 1; } .lp-textPhone-numberGroup { display: flex; align-items: center; } .lp-textPhone-icon { width: 36px; height: 38px; margin-right: 8px; vertical-align: middle; } .lp-textPhone-outer .lp-textPhone-icon { width: 66px; height: 38px; margin: 3px 8px 0 0; } .lp-textPhone-icon .of-iconColor-primary { fill: #00a23f; } .lp-textPhone-number { display: flex; font-size: 24px; } .lp-textPhone-outer .lp-textPhone-number { display: inline-block; font-size: 44px; font-weight: bold; } .lp-textPhone-number a[href] { color: #171e30; font-weight: 600; } .lp-textPhone-note { display: block; margin-top: 8px; font-size: 12px; } .lp-textPhone-outer .lp-textPhone-note { display: inline-block; margin-top: 5px; font-size: 16px; font-weight: bold; } @media screen and (max-width: 1080px) { .lp-textPhone-outer { display: block; } .lp-textPhone-outer .lp-textPhone { margin: 15px 0 0; } .lp-textPhone-outer .lp-textPhone-number { font-size: 35px; } } @media screen and (max-width: 767px) { .lp-bottom_phone .lp-textPhone-numberGroup { justify-content: center; font-size: 14px; } .lp-bottom_phone .lp-textPhone-number { font-size: 26px; } .lp-bottom_phone .lp-textPhone-note { font-size: 14px; text-align: center; } } .lp-listButton .lp-buttonConversion { display: inline-block; max-width: 100%; background: #e60012; color: #fff; font-size: 20px; line-height: 1.4; text-align: center; text-decoration: none; } .lp-buttonConversion-body { display: flex; align-items: center; padding: 12px 8px 12px 24px; } .lp-buttonConversion-text { margin-right: 16px; font-size: 20px; } .lp-buttonConversion-image { margin: -22px 0; border: 1px solid #ccc; } .lp-buttonConversion.of-download .lp-buttonConversion-body, .lp-buttonConversion.of-anchor .lp-buttonConversion-body, .lp-buttonConversion.of-arrow .lp-buttonConversion-body, .lp-buttonConversion.of-inquiry .lp-buttonConversion-body { position: relative; padding-left: 53px; } .lp-buttonConversion.of-download .lp-buttonConversion-body::before, .lp-buttonConversion.of-anchor .lp-buttonConversion-body::before, .lp-buttonConversion.of-arrow .lp-buttonConversion-body::before, .lp-buttonConversion.of-inquiry .lp-buttonConversion-body::before { display: block; position: absolute; top: 50%; left: 22px; width: 19px; height: 18px; transform: translateY(-50%); content: ""; } .lp-buttonConversion.of-download .lp-buttonConversion-body::before { background: url("/img/landing_page/common/icon_btn_dl.png") no-repeat center center; } .lp-buttonConversion.of-anchor .lp-buttonConversion-body::before { background: url("/img/landing_page/common/icon_btn_anc_03.png") no-repeat center center; } .lp-buttonConversion.of-arrow .lp-buttonConversion-body::before { left: 26px; height: 12px; border-width: 7px 0 7px 13px; border-style: solid; border-color: transparent transparent transparent #fff; } .lp-buttonConversion.of-inquiry .lp-buttonConversion-body::before { background: url("/img/landing_page/common/icon_btn_inquiry_01.png") no-repeat center center; } .lp-buttonConversion.of-priceIcon .lp-buttonConversion-body, .lp-buttonConversion.of-priceIcon-jpy .lp-buttonConversion-body, .lp-buttonConversion.of-priceIcon-gbp .lp-buttonConversion-body, .lp-buttonConversion.of-priceIcon-krw .lp-buttonConversion-body, .lp-buttonConversion.of-priceIcon-eur .lp-buttonConversion-body { position: relative; padding-left: 53px; } .lp-buttonConversion.of-priceIcon .lp-buttonConversion-body::before, .lp-buttonConversion.of-priceIcon-jpy .lp-buttonConversion-body::before, .lp-buttonConversion.of-priceIcon-gbp .lp-buttonConversion-body::before, .lp-buttonConversion.of-priceIcon-krw .lp-buttonConversion-body::before, .lp-buttonConversion.of-priceIcon-eur .lp-buttonConversion-body::before { display: block; position: absolute; top: 50%; left: 24px; width: 19px; height: 18px; transform: translateY(-50%); content: ""; } .lp-buttonConversion.of-primary { background: #13778F; } .lp-listButton { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; column-gap: 16px; margin-top: 20px; padding: 8px 0; } @media screen and (max-width: 1079px) { .lp-listButton { column-gap: calc((16 / 768) * 100vw); } } @media screen and (max-width: 767px) { .lp-listButton { row-gap: 24px; flex-direction: column; } } .main_visual { display: flex; background: linear-gradient(#e8ebec 0%, #a5b2ba 100%); } .main_visual_inner { position: relative; display: flex; justify-content: space-between; align-items: center; margin: 0 auto; width: 100%; max-width: 1920px; } .main_visual .text_area { width: 46%; display: flex; flex-direction: column; align-items: center; padding: 0 5%; } .text_area_inner { display: flex; flex-direction: column; } .main_visual .btn_style { margin-left: 0; } .main_visual .image_wrap { width: 54%; position: relative; } .label_btn { position: absolute; bottom: 72px; right: 0; max-width: 90%; background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000 20%, #000 100%); transition: none; } .label_btn:hover { opacity: 1; } .label_btn_inner { display: flex; align-items: center; padding: 10px 230px 10px 80px; position: relative; } .label_btn_inner::before { content: ''; position: absolute; bottom: 0; right: 0; width: 100%; height: 2px; background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #C40018 20%, #C40018 100%); transition: transform .3s; transform: scale(0, 1); transform-origin: right top; } .label_btn:hover .label_btn_inner::before { transform: scale(1, 1); } .label_btn_inner::after { content: ""; position: absolute; background-image: url(/img/ss/products/measure/pr_cl-3000/bg_pr_cl-3000_003.png); background-repeat: no-repeat; background-size: contain; width: 228px; height: 167px; right: 0; } .label_icon { color: #fff; background-color: #C40018; padding: 4px 10px; font-size: 16px; font-weight: 400; align-self: flex-start; } .label_text { margin-left: 10px; font-size: 20px; font-weight: 400; color: #fff; letter-spacing: 0.1em; flex: 1; } @media screen and (min-width: 1080px) and (max-width: 1365px) { .label_btn { bottom: calc((72 / 1366) * 100vw); } .label_btn_inner { padding: calc((10 / 1366) * 100vw) calc((230 / 1366) * 100vw) calc((10 / 1366) * 100vw) calc((80 / 1366) * 100vw); } .label_icon { padding: calc((4 / 1366) * 100vw) calc((10 / 1366) * 100vw); font-size: calc((16 / 1366) * 100vw); } .label_text { font-size: calc((20 / 1366) * 100vw); margin-left: calc((10 / 1366) * 100vw); } .label_btn_inner::after { width: calc((228 / 1366) * 100vw); height: calc((167 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .label_btn { bottom: calc((48 / 768) * 100vw); } .label_btn_inner { padding: calc((10 / 768) * 100vw) calc((175 / 768) * 100vw) calc((10 / 768) * 100vw) calc((55 / 768) * 100vw); } .label_icon { font-size: calc((14 / 768) * 100vw); } .label_text { font-size: calc((16 / 768) * 100vw); margin-left: calc((10 / 768) * 100vw); } .label_btn_inner::after { width: calc((174 / 768) * 100vw); height: calc((127 / 768) * 100vw); } } @media screen and (max-width: 767px) { .label_btn { bottom: calc((37 / 375) * 100vw); } .label_btn_inner { padding: calc((7 / 375) * 100vw) calc((100 / 375) * 100vw) calc((7 / 375) * 100vw) calc((24 / 375) * 100vw); } .label_icon { font-size: calc((11 / 375) * 100vw); padding: calc((2 / 375) * 100vw) calc((6 / 375) * 100vw); } .label_text { font-size: calc((10 / 375) * 100vw); margin-left: calc((10 / 375) * 100vw); } .label_btn_inner::after { width: calc((98 / 375) * 100vw); height: calc((72 / 375) * 100vw); } } @media screen and (min-width: 1080px) { .image_wrap .tab_image { display: none; } .image_wrap .sp_image { display: none; } } @media screen and (min-width: 768px) and (max-width: 1079px) { .image_wrap .pc_image { display: none; } .image_wrap .sp_image { display: none; } } @media screen and (max-width: 767px) { .image_wrap .pc_image { display: none; } .image_wrap .tab_image { display: none; } } .main_title { display: flex; flex-direction: column; justify-content: flex-start; } .main_catchphrase { font-weight: 600; font-size: 6.0rem; line-height: 1.2; text-align: left; display: flex; flex-direction: column; font-family: minion-3-display, serif; } .small_txt { font-weight: inherit; } .main_catchphrase .small_txt { letter-spacing: 0; font-size: 3.2rem; line-height: 1.6; } .main_title .product_name { margin-top: 16px; font-size: 23px; } .main_img { width: 50%; } .main_visual .lp-listButton { margin-top: clamp(32px, 3vw, 50px); justify-content: left; flex-direction: column; gap: 32px; align-items: start; } .main_visual .lp-listButton li { display: flex; width: 100%; } .main_visual .lp-scrollButton .lp-buttonConversion { width: 100%; background-color: #D1D6DA; box-shadow: 0 3px 6px rgba(0, 0, 0, .16); max-width: 340px; border-radius: 4px; } .main_visual .lp-scrollButton .lp-buttonConversion-body { padding-left: 40px; padding-right: 120px; } .main_visual .lp-scrollButton .lp-buttonConversion-body::before { background: none; display: block; position: absolute; top: calc(50% - 2px); left: 28px; width: 10px; height: 10px; rotate: -45deg; border-bottom: 2px solid #C8161D; border-left: 2px solid #C8161D; content: ""; } .main_visual .lp-scrollButton .lp-buttonConversion-text { color: #C8161D; font-weight: 500; font-size: 16px; margin-right: 0; padding-right: 0; } .main_visual .lp-scrollButton .lp-buttonConversion-image { position: absolute; right: 8px; border: none; width: 114px; height: auto; } .main_visual .text_link { margin-top: 20px; text-decoration: none; font-size: 16px; color: #333; } .main_visual .text_link:hover { text-decoration: underline; } @media screen and (min-width: 1080px) and (max-width: 1365px) { .main_catchphrase { font-size: calc((60 / 1366) * 100vw); } .main_catchphrase .small_txt { font-size: calc((32 / 1366) * 100vw); } .main_title .product_name { margin-top: calc((16 / 1366) * 100vw); font-size: calc((23 / 1366) * 100vw); } .main_visual .lp-listButton { margin-top: calc((37 / 1366) * 100vw); } .main_visual .text_link { margin-top: calc((20 / 1366) * 100vw); font-size: calc((16 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .main_catchphrase .small_txt { font-size: calc((46 / 768) * 100vw); } .main_catchphrase { text-align: center; font-size: calc((72 / 768) * 100vw); } .main_visual_inner { flex-direction: column-reverse; } .main_visual .text_area { width: 100%; padding: calc((58 / 768) * 100vw) calc((30 / 768) * 100vw) calc((70 / 768) * 100vw); } .main_visual .image_wrap { width: 100%; } .main_title .product_name { text-align: center; font-size: calc((20 / 768) * 100vw); } .main_visual .lp-listButton { margin-top: calc((37 / 768) * 100vw); justify-content: center; align-items: center; } .main_visual .lp-listButton li { justify-content: center; } .main_visual .text_link { text-align: center; font-size: calc((16 / 768) * 100vw); margin-top: calc((20 / 768) * 100vw); } } @media screen and (max-width: 767px) { .main_visual_inner { flex-direction: column-reverse; } .main_visual .text_area { width: 100%; padding: calc((25 / 375) * 100vw) calc((20 / 375) * 100vw) calc((62 / 375) * 100vw); } .main_visual .main_catchphrase { font-size: calc((42 / 375) * 100vw); } .main_catchphrase .small_txt { line-height: 1.4; font-size: calc((24 / 375) * 100vw); margin: 0 0 calc((5 / 375) * 100vw); } .main_visual .product_name { display: flex; flex-direction: column; align-items: center; margin-top: calc((15 / 375) * 100vw); font-size: calc((16 / 375) * 100vw); } .main_visual .lp-listButton { margin-top: calc((20 / 375) * 100vw); justify-content: center; } .main_visual .text_link { margin-top: calc((24 / 375) * 100vw); font-size: calc((16 / 375) * 100vw); } } .text_link:before { content: ""; display: inline-block; margin-right: 6px; clip-path: polygon(0 0, 100% 50%, 0 100%); height: 14px; width: 10px; background-color: #1D1D1D; vertical-align: middle; position: relative; top: -0.1em; } .lp-scroll { display: block; position: absolute; left: 40px; bottom: 30px; opacity: 1; transition: opacity 0.3s; } .lp-scrollText { color: #fff; position: relative; margin-bottom: 0; padding-bottom: 46px; writing-mode: vertical-lr; vertical-align: bottom; text-align: center; overflow: hidden; } .lp-scrollText::before, .lp-scrollText::after { position: absolute; right: 50%; bottom: 0; height: 30px; width: 1px; background: rgba(255, 255, 255, 0.2); content: ""; } .lp-scrollText::after { background: #fff; animation: scrollDown 1.5s cubic-bezier(1, 0, 0, 1) infinite; } @media screen and (min-width: 1080px) and (max-width: 1365px) { .lp-scroll { left: calc((40 / 1366) * 100vw); bottom: calc((30 / 1366) * 100vw); } } @keyframes scrollDown { 0% { transform: scale(0, 0); transform-origin: 0 0; } 50% { transform: scale(1, 1); transform-origin: 0 0; } 50.1% { transform: scale(1, 1); transform-origin: 0 100%; } 100% { transform: scale(0, 0); transform-origin: 0 100%; } } /* sections */ .sections { padding: 0 40px; } .sections .section_inner { margin: 0 auto; max-width: 1080px; padding: 110px 0; display: flex; flex-direction: column; } .section_title { font-size: 38px; font-weight: 600; text-align: left; padding-left: 32px; position: relative; font-family: minion-3-display, serif; } .section_title::before { position: absolute; content: ''; display: block; top: 25px; left: 0; border-bottom: 3px solid #C8161D; width: 24px; } .section_text { font-size: 16px; line-height: 1.75; font-weight: 400; } .section_title+.section_text { margin-top: 40px; } .section-1 { background-color: #F4F4F4; } .section_title_icon { display: inline-block; font-size: 22px; border: 2px solid #C8161D; color: #C8161D; margin-top: -7px; padding: 3px 6px 0; margin-right: 8px; vertical-align: middle; } .section-2 { background-color: #D1D6DA; overflow: hidden; } .section-2 .section_inner { height: 100%; position: relative; min-height: 560px; padding: 105px 0 150px; } .section-2 .section_inner::before { display: block; position: absolute; content: ''; background-image: url(/img/ss/products/measure/pr_cl-3000/bg_pr_cl-3000_001.png); background-repeat: no-repeat; background-size: contain; right: -65px; bottom: -40px; width: 803px; height: 527px; } .section-2 .text_area { width: 50%; } .section-3 { background-color: #F4F4F4 } .section-3 .section_list { line-height: 2; } @media screen and (min-width: 1079px) and (max-width: 1365px) { .sections { padding: 0 calc((40 / 1366) * 100vw); } .sections .section_inner { min-height: calc((560 / 1366) * 100vw); padding: calc((110 / 1366) * 100vw) 0; } .section-2 .section_inner { padding: calc((110 / 1366) * 100vw) 0 calc((150 / 1366) * 100vw) 0; min-height: calc((550 / 1366) * 100vw); } .section_title { font-size: calc((38 / 1366) * 100vw); padding-left: calc((32 / 1366) * 100vw); } .section_title::before { width: calc((24 / 1366) * 100vw); top: calc((25 / 1366) * 100vw); } .section_text { font-size: calc((16 / 1366) * 100vw); } .section_title+.section_text { margin-top: calc((40 / 1366) * 100vw); } .section_title_icon { font-size: calc((22 / 1366) * 100vw); margin-top: calc((-7 / 1366) * 100vw); margin-right: calc((8 / 1366) * 100vw); padding: calc((3 / 1366) * 100vw) calc((6 / 1366) * 100vw) 0; } .section-2 .section_inner::before { right: calc((-65 / 1366) * 100vw); bottom: calc((-40 / 1366) * 100vw); width: calc((803 / 1366) * 100vw); height: calc((527 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .sections { padding: 0 32px; } .sections .section_inner { max-width: 1060px; padding: calc((62 / 768) * 100vw) 0; } .section_title { font-size: calc((26 / 768) * 100vw); padding-left: calc((26 / 768) * 100vw); } .section_title::before { border-bottom: 3px solid #C8161D; width: calc((18 / 768) * 100vw); top: calc((18 / 768) * 100vw); } .section_text { font-size: calc((14 / 768) * 100vw); line-height: 2; } .section_title+.section_text { margin-top: calc((24 / 768) * 100vw); } .section-1 { background-color: #F4F4F4; } .section-2 { background-color: #D1D6DA; } .section-2 .section_inner { min-height: 282px; height: 100%; position: relative; padding: calc((105 / 768) * 100vw) 0 calc((150 / 768) * 100vw); } .section-2 .section_inner::before { right: calc((-20 / 768) * 100vw); bottom: 0; width: calc((639 / 768) * 100vw); height: calc((392 / 768) * 100vw); } .section-2 .text_area { display: flex; flex-direction: column; } .section-3 { background-size: 439px 369px; } .section-3 .section_inner { padding: 80px 0; } .section_title_icon { font-size: calc((20 / 768) * 100vw); margin-top: calc((-5 / 768) * 100vw); margin-right: calc((8 / 768) * 100vw); padding: calc((3 / 768) * 100vw) calc((6 / 768) * 100vw) 0; } } @media screen and (max-width: 767px) { .sections { padding: 0 calc((20 / 375) * 100vw); } .sections .section_inner { padding: calc((48 / 375) * 100vw) 0 calc((64 / 375) * 100vw); } .section_title::before { width: calc((18 / 375) * 100vw); top: calc((18 / 375) * 100vw); } .section_text { font-size: 16px; line-height: 1.75; } .section_title { font-size: calc((26 / 375) * 100vw); padding-left: calc((27 / 375) * 100vw); } .section_title+.section_text { margin: calc((27 / 375) * 100vw) 0 0; font-size: calc((16 / 375) * 100vw); } .section-1 { background-color: #F4F4F4; } .section-1 .section_title { display: block; } .section_title_icon { display: inline-flex; margin: 0 0 calc((10 / 375) * 100vw); padding: calc((7 / 375) * 100vw) calc((11 / 375) * 100vw); font-size: calc((22 / 375) * 100vw); border-width: calc((2 / 375) * 100vw); line-height: 1; } .section-2 { background-color: #D1D6DA; } .section-2 .section_inner { min-height: auto; height: auto; display: flex; flex-direction: column; align-items: center; } .section-2 .section_inner::before { position: relative; left: calc((0 / 375) * 100vw); width: calc((418 / 375) * 100vw); height: calc((257 / 375) * 100vw); } .section-2 .text_area { width: 100%; max-width: none; } .section-2 .section_title { margin: calc((32 / 375) * 100vw) 0 0; } .section-2 .section_text { padding-bottom: 0; margin-left: auto; } .section-3 .section_inner { padding: calc((64 / 375) * 100vw) 0 calc((40 / 375) * 100vw); } } .box_list { margin-top: 48px; display: flex; column-gap: 24px; } .box_item { width: 100%; cursor: pointer; position: relative; } .box_item.icon-new .icon{ content: ""; position: absolute; display: flex; align-items: center; justify-content: center; padding: 5px 10px; left: 16px; top: 16px; font-size: 16px; color: #fff; background-color: #E60012; line-height: 1.15; z-index: 1; vertical-align: middle; } .box_link{ display: flex; flex-direction: column; border-radius: 8px; overflow: hidden; box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.1); } .box_link:hover { opacity: 0.8; } .box_link .box_image { transition: transform 1s ease 0s; } .box_link:hover .box_image { transform: scale(1.2); } .box_title { background-color: #fff; padding: 24px 10px; font-size: 18px; font-weight: 600; border-bottom: 1px solid #fff; color: #333; position: relative; text-align: center; } .box_image { position: relative; } .box_text_link { display: flex; justify-content: center; align-items: center; margin-top: 16px; font-size: 16px; font-weight: 400; text-align: center; text-decoration: underline; } .box_text_link { display: none; } .box_text_link_icon { display: inline-block; margin-left: 12px; background-color: #C8161D; opacity: 0.8; width: 24px; height: 24px; position: relative; } .box_text_link_icon::after, .box_text_link_icon::before { content: ''; display: inline-block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .box_text_link_icon::after { border-top: 1px solid #fff; width: 14px; } .box_text_link_icon::before { height: 14px; border-left: 1px solid #fff; } @media screen and (min-width: 1080px) and (max-width: 1365px) { .box_title { padding: calc((24 / 1366) * 100vw) calc((10 / 1366) * 100vw); font-size: calc((18 / 1366) * 100vw); } .box_list { margin-top: calc((48 / 1366) * 100vw); column-gap: calc((24 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .box_list { margin-top: 26px; column-gap: 16px; } .box_title { padding: calc((15 / 768) * 100vw); font-size: calc((16 / 768) * 100vw); } .box_text_link { display: flex; margin-top: calc((16 / 768) * 100vw); font-size: calc((16 / 768) * 100vw); } .box_text_link_icon { margin-left: calc((12 / 768) * 100vw); width: calc((24 / 768) * 100vw); height: calc((24 / 768) * 100vw); } .box_text_link_icon::after { width: calc((14 / 768) * 100vw); } .box_text_link_icon::before { height: calc((14 / 768) * 100vw); } .box_item.icon-new .icon{ padding: calc((5 / 768) * 100vw) calc((10 / 768) * 100vw); left: calc((16 / 768) * 100vw); top: calc((16 / 768) * 100vw); font-size: calc((16 / 768) * 100vw); } } @media screen and (max-width: 767px) { .box_list { margin-top: calc((27 / 375) * 100vw); row-gap: calc((40 / 375) * 100vw); column-gap: 0; flex-direction: column; } .box_title { font-size: calc((20 / 375) * 100vw); padding: calc((19 / 375) * 100vw) calc((20 / 375) * 100vw) calc((13 / 375) * 100vw); } .box_text_link { margin-top: calc((16 / 375) * 100vw); font-size: calc((18 / 375) * 100vw); } .box_text_link_icon { width: calc((28 / 375) * 100vw); height: calc((28 / 375) * 100vw); margin-left: calc((12 / 375) * 100vw); } .box_text_link_icon::after { width: calc((14 / 375) * 100vw); } .box_text_link_icon::before { height: calc((14 / 375) * 100vw); } .box_item.icon-new .icon{ padding: calc((5 / 375) * 100vw) calc((10 / 375) * 100vw); left: calc((16 / 375) * 100vw); top: calc((16 / 375) * 100vw); font-size: calc((16 / 375) * 100vw); } } /* bottom_dl_area */ .bottom_dl_area { margin: 100px auto; width: 100%; } /* bottom_dl_area */ .bottom_dl_area .inner { max-width: 1360px; width: 100%; margin: 0 auto; display: flex; justify-content: center; } .dl_area { width: 100%; display: flex; justify-content: center; align-items: center; } .bottom_dl_area .inner .text_group { flex: 1 1 auto; } .bottom_dl_area .inner .text_group .lead01 { margin-bottom: 32px; text-align: left; font-size: 32px; text-align: center; font-weight: 600; font-family: minion-3-display, serif; } .bottom_dl_btn { text-align: center; } .bottom_dl_area .large_thumb { max-width: 272px; } .lp-bottom_phone { display: flex; align-items: center; margin-top: 40px; justify-content: center; } .lp-text { font-size: 20px; } .lp-bottom_phone .lp-textPhone { padding-left: 12px; } @media screen and (min-width: 1079px) and (max-width: 1365px) { .bottom_dl_area { margin: calc((80 / 1366) * 100vw) 0; } .bottom_dl_area .inner .text_group .lead01 { font-size: calc((32 / 1366) * 100vw); margin-bottom: calc((32 / 1366) * 100vw); } .lp-listButton { margin-top: calc((20 / 1366) * 100vw); gap: calc((16 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .bottom_dl_area { margin: calc((80 / 768) * 100vw) auto; width: 100%; } .bottom_dl_area .inner { max-width: 1280px; flex-direction: column; align-items: center; } .bottom_dl_area .inner .text_group { flex: 1 1 auto; } .bottom_dl_area .inner .text_group .lead01 { margin-bottom: calc((32 / 768) * 100vw); text-align: center; font-size: calc((32 / 768) * 100vw); } .bottom_dl_btn { text-align: center; } .bottom_dl_area .large_thumb { max-width: 272px; } .lp-bottom_phone { display: flex; align-items: center; margin-top: 40px; justify-content: center; } .lp-text { font-size: 20px; } .lp-bottom_phone .lp-textPhone { padding-left: 12px; } } @media screen and (max-width: 767px) { /* bottom_dl_area */ .bottom_dl_area { margin: calc((56 / 375) * 100vw) auto; width: 100%; } /* bottom_dl_area */ .bottom_dl_area .inner { max-width: 1280px; } .bottom_dl_area .inner .text_group { flex: 1 1 auto; } .bottom_dl_area .inner .text_group .lead01 { margin-bottom: calc((30 / 375) * 100vw); text-align: center; font-size: calc((20 / 375) * 100vw); } .bottom_dl_btn { text-align: center; } .bottom_dl_area .large_thumb { max-width: 272px; } .lp-text { font-size: 20px; } .lp-bottom_phone .lp-textPhone { padding-left: 12px; } .lp-buttonConversion-text { font-size: 16px; } .lp-listButton { margin-top: calc((40 / 375) * 100vw); gap: calc((16 / 375) * 100vw); } } /* add date 20231119 */ /* -------------------------- setting start -------------------------- */ .tab-view { display: none; } .sp-view { display: none; } .pc-view { display: block; } .tab-view.of-flex { display: none; } .sp-view.of-flex { display: none; } .pc-view.of-flex { display: flex; } /* 锝?919px */ @media screen and (max-width: 1919px) { /* :root { font-size: calc((10 / 1920) * 100vw); } */ } /* 锝?079px */ @media screen and (max-width: 1079px) { /* :root { font-size: calc((10 / 1070) * 100vw * 0.5572916666666667); } */ .pc-view { display: none; } .sp-view { display: none; } .tab-view { display: block; } .pc-view.of-flex { display: none; } .sp-view.of-flex { display: none; } .tab-view.of-flex { display: flex; } } /* 锝?67px */ @media screen and (max-width: 767px) { /* :root { font-size: calc((10 / 768) * 100vw); } */ .pc-view { display: none; } .tab-view { display: none; } .sp-view { display: block; } .pc-view.of-flex { display: none; } .tab-view.of-flex { display: none; } .sp-view.of-flex { display: flex; } } /* -------------------------- setting end -------------------------- */ /* -------------------------- Header start -------------------------- */ .lp-layout-header-content { display: flex; align-items: center; justify-content: space-between; margin: 0 auto; max-width: 1920px; padding: 15px 80px; } @media screen and (max-width: 1079px) { .lp-layout-header-content { padding: 20px; flex-direction: column; align-items: center; } } .lp-layout-header-utilityGroup { flex: 1; padding-left: 40px; } @media screen and (max-width: 1079px) { .lp-layout-header-utilityGroup { display: none; } } .lp-layout-header-utilityList { display: flex; flex-wrap: wrap; justify-content: flex-end; text-align: center; } .lp-layout-header-logo { display: block; margin-bottom: 0; line-height: 1; } @media screen and (max-width: 1079px) { .lp-layout-header-logo { min-height: 0%; text-align: center; } } .lp-layout-header-logo a { text-decoration: none; } /* -------------------------- Header end -------------------------- */ /* -------------------------- Footer start -------------------------- */ .lp-layout-footer { background-color: #333; color: #fff; font-size: 13px; } .lp-layout-footer-content { margin: 0 auto; padding: 15px 80px 20px; } @media screen and (max-width: 1079px) { .lp-layout-footer-content { padding: 20px; } } .lp-layout-footer-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: -8px; margin-left: -32px; } .lp-layout-footer-list>li { position: relative; margin-top: 8px; margin-left: 32px; line-height: 1.2; } .lp-layout-footer-list>li::before { display: block; position: absolute; top: 50%; left: -16px; width: 1px; height: 15px; transform: translateY(-50%); background-color: #fff; content: ""; } .lp-layout-footer-list>li a { color: #fff; font-size: 1.3rem; line-height: 1; text-decoration: none; } .lp-layout-footer-list>li a:hover, .lp-layout-footer-list>li a:focus { text-decoration: underline; } .lp-layout-footer-list>li:first-child::before { content: none; } @media screen and (max-width: 1079px) { .lp-layout-footer-list>li.lp-layout-footer-copyright { width: 100%; text-align: center; } } @media screen and (max-width: 1079px) { .lp-layout-footer-list>li.lp-layout-footer-copyright::before { content: none; } } .lp-navigationSeries { margin: 8px auto; border: 0; color: #676767; } @media screen and (max-width: 1079px) { .lp-navigationSeries { margin-bottom: 18px; } } .lp-navigationSeries-linkList { display: flex; flex-wrap: wrap; justify-content: center; margin-top: -4px; margin-left: -16px; } .lp-navigationSeries-linkList>li { display: flex; align-items: center; margin-top: 4px; margin-left: 16px; color: #fff; font-size: 1.3rem; } .lp-navigationSeries-linkList>li>a { padding-left: 0; color: #fff; } .lp-navigationSeries-linkList>li>a::before { display: none; } .lp-navigationSeries-linkList>li::before { display: block; width: 1px; height: 16px; margin-right: 16px; border-left: 1px solid #fff; content: ""; } .lp-navigationSeries-linkList>li:first-child::before { display: none; } /* -------------------------- Footer end -------------------------- */ /* -------------------------- Module start -------------------------- */ .c-step-items-wrap {} .c-step-items { display: flex; gap: 0 40px; } .c-step-item { position: relative; width: 100%; display: flex; } .c-step-item-inner { display: flex; gap: 10px 0; flex-direction: column; } .c-step-item+.c-step-item::before, .c-step-item+.c-step-item::after { position: absolute; content: ""; height: 16px; width: calc(16px / 2); clip-path: polygon(0 0, 100% 50%, 0 100%); top: 0; bottom: 0; margin: auto; } .c-step-item+.c-step-item::before { background: #C8161D; left: -20px; } .c-step-item+.c-step-item::after { background: #F4F4F4; left: -23px; } .c-step-icon { display: flex; align-items: center; justify-content: center; outline: 1px solid #C8161D; border-radius: 100px; font-size: 16px; line-height: 1.75; color: #C8161D; background-color: #fff; padding: 2px; margin: 0 0 15px; } .c-step-text { font-size: 14px; text-align: center; } .c-step-list { margin-top: 16px; display: flex; gap: 16px; } .c-step-list>li { font-size: 14px; font-weight: 400; } .c-step-list-icon { border-radius: 50%; display: inline-block; border-radius: 50%; background-color: #41B25D; color: #fff; font-size: 12px; width: 16px; height: 16px; text-align: center; margin-right: 6px; } .c-step-list>li:nth-child(2) .c-step-list-icon { background-color: #EC6D65; } @media screen and (min-width: 1079px) and (max-width: 1365px) { .c-step-items-wrap {} .c-step-items { gap: 0 calc((40 / 1366) * 100vw); } .c-step-item { } .c-step-item-inner { gap: calc((10 / 1366) * 100vw) 0; } .c-step-icon { font-size: calc((16 / 1366) * 100vw); padding: calc((5 / 1366) * 100vw); margin: 0 0 calc((15 / 1366) * 100vw); } .c-step-text { font-size: calc((14 / 1366) * 100vw); } .c-step-item+.c-step-item::before { left: calc((-20 / 1366) * 100vw); } .c-step-item+.c-step-item::after { left: calc((-23 / 1366) * 100vw); } .c-step-list { margin-top: calc((16 / 1366) * 100vw); gap: calc((16 / 1366) * 100vw); } } @media screen and (max-width: 1079px) { .c-step-items-wrap { margin: 0 auto; width: calc((525 / 768) * 100vw); } .c-step-icon { font-size: calc((16 / 768) * 100vw); margin: 0 0 calc((15 / 768) * 100vw); } .c-step-text { font-size: calc((14 / 768) * 100vw); } .c-step-items { gap: 0 calc((40 / 768) * 100vw); } .c-step-item { } .c-step-item-inner { gap: calc((10 / 768) * 100vw); } .c-step-list { margin-top: calc((16 / 768) * 100vw); gap: calc((8 / 768) * 100vw) calc((16 / 768) * 100vw); } .c-step-item+.c-step-item::before, .c-step-item+.c-step-item::after { height: calc((16 / 768) * 100vw); width: calc((8 / 768) * 100vw); } .c-step-item+.c-step-item::before { left: calc((-20 / 768) * 100vw); } .c-step-item+.c-step-item::after { left: calc((-23 / 768) * 100vw); } .c-step-list>li { font-size: calc((14 / 768) * 100vw); } } @media screen and (max-width: 767px) { .c-step-items-wrap { width: 100%; } .c-step-items { flex-direction: column; gap: calc((48 / 768) * 100vw) 0; } .c-step-item { width: 100%; flex-direction: column; } .c-step-item-inner { flex-direction: row; gap: 0 calc((30 / 768) * 100vw); } .c-step-top, .c-step-bottom { width: 50%; } .c-step-text { font-size: calc((32 / 768) * 100vw); text-align: left; } .c-step-icon { font-size: calc((32 / 768) * 100vw); margin: 0 0 calc((30 / 768) * 100vw); } .c-step-item+.c-step-item::before, .c-step-item+.c-step-item::after { display: none; } .c-step-list { flex-direction: column; margin: calc((28 / 768) * 100vw) 0 0; gap: calc((14 / 768) * 100vw); } .c-step-list>li { display: flex; align-items: center; font-size: calc((26 / 768) * 100vw); } .c-step-list-icon { display: flex; align-items: center; justify-content: center; font-size: calc((26 / 768) * 100vw); width: calc((32 / 768) * 100vw); height: calc((32 / 768) * 100vw); margin-right: calc((12 / 768) * 100vw); } } /* -------------------------- Module end -------------------------- */ .modal_item { display: none; } .modal_title { font-size: 24px; color: #C8161D; font-weight: 600; } .modal_text { margin-top: 24px; font-weight: 400; font-size: 16px; line-height: 1.5; } .modal_image { margin-top: 24px; } .anotation_text { margin-top: 4px; font-size: 13px; text-align: right; font-weight: 400; } .modal__overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); display: flex; z-index: 999; justify-content: center; align-items: center; } .modal__wrap { position: relative; margin: 50px; background-color: #fff; border-radius: 10px; display: flex; flex-direction: column; max-height: 90vh; } .modal__wrap::before, .modal__wrap::after { content: ''; width: 100%; height: 35px; display: block; flex-shrink: 0; } .modal__container { padding: 0 20px; max-width: 980px; margin: 0 auto; width: 100%; border-radius: 10px; overflow-y: auto; } .modal__close { position: absolute; right: 16px; top: 8px; width: 24px; height: 24px; cursor: pointer; } .close__btn { position: relative; display: block; height: 24px; width: 24px; } .close__btn::before, .close__btn::after { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #919191; height: 24px; width: 2px; } .close__btn::before { transform: translate(-50%, -50%) rotate(-45deg); } .close__btn::after { transform: translate(-50%, -50%) rotate(45deg); } .modal__content { margin-top: 2rem; margin-bottom: 2rem; line-height: 1.5; color: rgba(0, 0, 0, .8); } @keyframes mmfadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes mmfadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes mmslideIn { from { transform: translateY(15%); } to { transform: translateY(0); } } @keyframes mmslideOut { from { transform: translateY(0); } to { transform: translateY(-10%); } } .micromodal-slide { display: none; } .micromodal-slide.is-open { display: block; } .micromodal-slide[aria-hidden="false"] .modal__overlay { animation: mmfadeIn .3s cubic-bezier(0.0, 0.0, 0.2, 1); } .micromodal-slide[aria-hidden="false"] .modal__container { animation: mmslideIn .3s cubic-bezier(0, 0, .2, 1); } .micromodal-slide[aria-hidden="true"] .modal__overlay { animation: mmfadeOut .3s cubic-bezier(0.0, 0.0, 0.2, 1); } .micromodal-slide[aria-hidden="true"] .modal__container { animation: mmslideOut .3s cubic-bezier(0, 0, .2, 1); } .micromodal-slide .modal__container, .micromodal-slide .modal__overlay { will-change: transform; } /* @media screen and (min-width: 1080px) and (max-width: 1365px) { .modal_title { font-size: calc((24 / 1366) * 100vw); } .modal_text{ margin-top: calc((28 / 1366) * 100vw); font-size: calc((16 / 1366) * 100vw); } .modal__container { padding: 0 calc((50 / 1366) * 100vw); } } */ @media screen and (max-width: 1079px) { .modal_title { font-size: calc((22 / 768) * 100vw); } .modal_text { margin-top: calc((25 / 768) * 100vw); font-size: calc((16 / 768) * 100vw); } .modal .feature_list { column-gap: calc((24 / 768) * 100vw); } .anotation_text { text-align: left; } .modal__wrap { padding: 0; margin: 40px; } .modal__wrap::before, .modal__wrap::after { height: 35px; } .modal__close { right: 12px; top: 12px; } .modal__container { width: auto; padding: 0 calc((20 / 768) * 100vw); max-width: 840px; } } @media screen and (max-width: 767px) { .modal_title { font-size: calc((22 / 375) * 100vw); } .modal_text { margin-top: calc((25 / 375) * 100vw); font-size: calc((16 / 375) * 100vw); } .modal .feature_list { margin: calc((20 / 375) * 100vw) 0 0; column-gap: calc((23 / 375) * 100vw); } .modal__wrap { margin: calc((20 / 375) * 100vw); max-height: 80vh; max-height: 85dvh; } .modal__wrap::before, .modal__wrap::after { height: calc((56 / 375) * 100vw); } .modal_image { width: 100%; height: 470px; overflow-x: scroll; text-align: center; position: relative; } .modal_image img { height: 100%; max-width: none; width: auto; position: absolute; left: 0; } .modal__close { top: calc((20 / 375) * 100vw); right: calc((15 / 375) * 100vw); } .modal__container { padding: 0 calc((10 / 375) * 100vw); } .close__btn { height: calc((24 / 375) * 100vw); width: calc((24 / 375) * 100vw); } } .feature_list { margin-top: 32px; display: inline-flex; column-gap: 55px; } .feature_list .feature_item { width: 50%; } .feature_title { font-size: 20px; color: #333; font-weight: 600; margin: 0 0 20px; } .feature_title span { display: flex; padding-left: 14px; border-left: 2px solid #C8161D; font-weight: 600; } .feature_lead { display: flex; font-size: 16px; color: #333; margin: 0 0 15px; letter-spacing: 0.05em; } .feature_content { display: flex; flex-direction: column; } .feature_image figcaption { font-size: 16px; margin-top: 16px; } .figure-num-list { display: flex; margin: 12px 0 0; gap: 7px 16px; flex-direction: column; } .figure-num-list.of-column { flex-direction: column; } .figure-num-list li { position: relative; font-size: 14px; padding-left: 24px; } .figure-num-list li::before { position: absolute; content: ''; display: flex; align-items: center; justify-content: center; font-size: 13px; width: 18px; height: 18px; outline: 1px solid #C8161D; color: #C8161D; left: 0; } .figure-num-list li:nth-child(1):before { content: 'A'; } .figure-num-list li:nth-child(2):before { content: 'B'; } .figure-num-list li:nth-child(3):before { content: 'C'; } .figure-num-list li:nth-child(4):before { content: 'D'; } .anotation-list{ display: flex; margin: 12px 0 0; gap: 7px 16px; } .anotation-list.of-right{ justify-content: flex-end; text-align: right; } .anotation-list li { position: relative; font-size: 14px; padding-left: 5px; } .anotation-list li::before { position: absolute; content: ''; display: flex; align-items: center; justify-content: center; font-size: 13px; top: 0; left: 0; } .annotation_text{ font-size: 14px; } .lp-textPhone-pageBottom{ display: none; } /* @media screen and (min-width: 1079px) and (max-width: 1365px) { .feature_lead{ font-size: calc((16 / 1366) * 100vw); margin: 0 0 calc((15 / 1366) * 100vw); } .feature_list { column-gap: calc((32 / 1366) * 100vw); margin-top: calc((28 / 1366) * 100vw); } .feature_title{ font-size: calc((16 / 1366) * 100vw); padding-left: calc((14 / 1366) * 100vw); margin: 0 0 calc((20 / 1366) * 100vw); } .feature_image figcaption { font-size: calc((16 / 1366) * 100vw); margin-top: calc((16 / 1366) * 100vw); } .figure-num-list{ flex-direction: column; margin: calc((12 / 1366) * 100vw) 0 0; gap: calc((7 / 1366) * 100vw) calc((16 / 1366) * 100vw); } .figure-num-list li{ font-size: calc((14 / 1366) * 100vw); padding-left: calc((24 / 1366) * 100vw); } .figure-num-list li::before{ font-size: calc((13 / 1366) * 100vw); width: calc((18 / 1366) * 100vw); height: calc((18 / 1366) * 100vw); } } */ @media screen and (max-width: 1079px) { .feature_list { flex-direction: column; row-gap: calc((23 / 768) * 100vw); margin-top: calc((32 / 768) * 100vw); } .feature_list .feature_item { width: 100%; } .feature_title { font-size: calc((14 / 768) * 100vw); margin: 0 0 calc((14.5 / 768) * 100vw); } .feature_title span { padding-left: calc((12 / 768) * 100vw); } .feature_image figcaption { font-size: calc((16 / 768) * 100vw); margin-top: calc((16 / 768) * 100vw); } .feature_lead { font-size: calc((14 / 768) * 100vw); margin: 0 0 calc((15 / 768) * 100vw); } .figure-num-list { flex-direction: column; margin: calc((12 / 768) * 100vw) 0 0; gap: calc((7 / 768) * 100vw) calc((16 / 768) * 100vw); } .figure-num-list li { font-size: calc((14 / 768) * 100vw); padding-left: calc((24 / 768) * 100vw); } .figure-num-list li::before { font-size: calc((13 / 768) * 100vw); width: calc((18 / 768) * 100vw); height: calc((18 / 768) * 100vw); } .anotation-list{ flex-direction: column; margin: calc((12 / 768) * 100vw) 0 0; gap: calc((7 / 768) * 100vw) calc((16 / 768) * 100vw); } .anotation-list li { font-size: calc((14 / 768) * 100vw); } .anotation-list li::before { font-size: calc((13 / 768) * 100vw); } .annotation_text{ font-size: calc((14 / 768) * 100vw); } .lp-textPhone-pageBottom{ display: flex; align-items: center; justify-content: center; margin-top: calc((20 / 768) * 100vw); } .lp-textPhone-pageBottom .lp-textPhone-icon{ width: calc((24 / 768) * 100vw); height: calc((24 / 768) * 100vw); } .lp-textPhone-pageBottom .lp-textPhone-number{ font-size: calc((24 / 768) * 100vw); align-items: center; } } @media screen and (max-width: 767px) { .feature_list { margin: calc((20 / 375) * 100vw) 0 0; column-gap: 0; row-gap: calc((23 / 375) * 100vw); } .feature_title { font-size: calc((16 / 375) * 100vw); margin: 0 0 calc((14.5 / 375) * 100vw); } .feature_title span { padding-left: calc((14 / 375) * 100vw); } .feature_lead { margin: 0 0 calc((30 / 375) * 100vw); font-size: calc((16 / 375) * 100vw); } .feature_image figcaption { font-size: calc((16 / 375) * 100vw); margin-top: calc((16 / 375) * 100vw); } .figure-num-list { margin: calc((12 / 375) * 100vw) 0 0; gap: calc((7 / 375) * 100vw) calc((16 / 375) * 100vw); } .figure-num-list li { font-size: calc((14 / 375) * 100vw); padding-left: calc((24 / 375) * 100vw); } .figure-num-list li::before { font-size: calc((13 / 375) * 100vw); width: calc((18 / 375) * 100vw); height: calc((18 / 375) * 100vw); } .anotation-list{ margin: calc((12 / 375) * 100vw) 0 0; gap: calc((7 / 375) * 100vw) calc((16 / 375) * 100vw); } .anotation-list li { font-size: calc((14 / 375) * 100vw); } .anotation-list li::before { font-size: calc((13 / 375) * 100vw); } .anotation-list li { font-size: calc((14 / 375) * 100vw); } .lp-textPhone-pageBottom{ margin-top: calc((20 / 375) * 100vw); } .lp-textPhone-pageBottom .lp-textPhone-icon{ width: calc((24 / 375) * 100vw); height: calc((24 / 375) * 100vw); } .lp-textPhone-pageBottom .lp-textPhone-number{ font-size: calc((18 / 375) * 100vw); align-items: center; } } /* 鍚勭従娉曞垾瑾挎暣 */ .theme-KC .udesk-client-btn{ top: 0 !important; margin-top: 170px !important; } .theme-KC .main_catchphrase,.theme-KC .section_title,.theme-KC .bottom_dl_area .inner .text_group .lead01{ font-family: sans-serif; } .theme-KW .main_catchphrase,.theme-KW .section_title,.theme-KW .bottom_dl_area .inner .text_group .lead01{ font-family: source-han-serif-tc, serif; } .theme-KK .main_catchphrase,.theme-KK .section_title,.theme-KK .bottom_dl_area .inner .text_group .lead01{ font-family: source-han-serif-korean, serif; } .theme-KT .main_catchphrase,.theme-KT .section_title,.theme-KT .bottom_dl_area .inner .text_group .lead01{ font-family: kanit, sans-serif; }