@charset "UTF-8"; /*** The new CSS reset - version 1.8.2 (last updated 23.12.2022) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ pre { all: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } html { font-size: 10px; scroll-behavior: smooth; margin-top: 0 !important; } .targetElement { scroll-margin-top: 70px; } body { width: 100%; margin: auto; font-family: "NotoSansJpRegular"; color: #000; overflow-x: hidden; } body.hb_open { overflow: hidden; } #wpadminbar { position: fixed !important; top: auto !important; bottom: 0; } .regular { font-family: "NotoSansJpRegular"; } .medium { font-family: "NotoSansJpMedium"; } .bold { font-family: "NotoSansJpBold"; } .black { font-family: "NotoSansJpBlack"; } .contents_title_area { text-align: center; position: relative; } .contents_title_area_typeB { padding: 0 20px; width: 390px; background: #fff; font-size: 3rem; opacity: 0.9; display: flex; align-items: center; justify-content: center; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); } @media screen and (max-width: 768px) { .contents_title_area_typeB { font-size: 2rem; width: 100%; padding: 5px 0 5px 36.5px; } } .contents_title_area_typeB.business { padding: 0; position: absolute; bottom: 10px; left: 60px; width: 100%; background: none; justify-content: flex-start; box-shadow: none; } @media screen and (max-width: 768px) { .contents_title_area_typeB.business { font-size: 2.4rem; flex-direction: column; align-items: flex-start; bottom: -10px; left: 30px; } } .contents_title_area_typeB.business.reverse { left: auto; right: 60px; flex-direction: row-reverse; } @media screen and (max-width: 768px) { .contents_title_area_typeB.business.reverse { flex-direction: column; align-items: flex-end; bottom: -20px; right: 30px; } } .contents_title_area.left { font-size: 3.4rem; text-align: left; } .contents_title_area.left.profile { padding-top: 227px; } @media screen and (max-width: 768px) { .contents_title_area.left.profile { font-size: 2.4rem; padding-top: 25px; text-align: center; } } .contents_title_area.left.profile2 { padding-top: 94.6px; } .contents_title_typeA { font-size: 3rem; font-family: "NotoSerifJpMedium"; color: #000; letter-spacing: 0.03rem; line-height: 2; z-index: -1; } @media screen and (max-width: 768px) { .contents_title_typeA { font-size: 2rem; } } .contents_title_typeA.lg { font-size: 2.4rem; } .contents_title_typeA.textWhite { color: #fff; } @media screen and (max-width: 768px) { .contents_title_typeA.business { font-size: 2.4rem; } } .contents_title_typeB { font-size: 3.4rem; color: #000; letter-spacing: 0.03rem; line-height: 2; z-index: -1; } @media screen and (max-width: 768px) { .contents_title_typeB { font-size: 2.4rem; } } .contents_title_typeB.textWhite { color: #fff; } @media screen and (max-width: 768px) { .contents_title_typeB.access { text-align: center; } } .contents_title_with_icon { display: flex; align-items: center; justify-content: center; gap: 1rem; } .contents_title_with_icon_image { width: 44.8px; } @media screen and (max-width: 768px) { .contents_title_with_icon_image { width: 33px; } } @media screen and (max-width: 768px) { .contents_title_with_icon { gap: 0.3rem; padding-right: 2.5rem; } } .contents_sub_title_typeA { margin: auto; width: -moz-fit-content; width: fit-content; font-size: 1.42rem; font-family: "ZenOldMincho"; color: #FE0002; position: relative; left: 20px; } @media screen and (max-width: 768px) { .contents_sub_title_typeA { font-size: 1.2rem; margin-left: 38px; } } .contents_sub_title_typeA:before { content: ""; position: absolute; top: 50%; left: -40px; width: 30px; height: 1.5px; background: #FE0002; transform: translateY(-50%); } @media screen and (max-width: 768px) { .contents_sub_title_typeA:before { width: 20px; left: -30px; } } .contents_sub_title_typeA.left20 { left: 20px; } @media screen and (max-width: 768px) { .contents_sub_title_typeA.left20 { left: 5px; } } .contents_sub_title_typeA.left50 { left: 50px; } .contents_sub_title_typeA.left { left: 0; } .contents_sub_title_typeA.business { margin: auto auto auto 0; } @media screen and (max-width: 768px) { .contents_sub_title_typeA.business { font-size: 1.55rem; } } .contents_sub_title_typeA.business.reverse { margin: auto 0 auto auto; left: auto; right: 50px; } @media screen and (max-width: 768px) { .contents_sub_title_typeA.business.reverse { left: initial; right: 10px; } } .contents_sub_title_typeA.business.reverse:before { left: auto; right: -40px; } @media screen and (max-width: 768px) { .contents_sub_title_typeA.business.reverse:before { left: -30px; } } @media screen and (max-width: 768px) { .contents_sub_title_typeA.contact_banner { left: 0; margin: auto; font-size: 1.6rem; } } .contents_sub_title_typeB { width: -moz-fit-content; width: fit-content; font-size: 1.42rem; font-family: "ZenOldMincho"; color: #FE0002; position: relative; left: 0; text-align: left; } .contents_sub_title_typeB.company { padding-left: 50px; } @media screen and (max-width: 768px) { .contents_sub_title_typeB.company { margin: auto; } } .contents_sub_title_typeB.company::before { left: 5px; } .contents_sub_title_typeB.access { padding-left: 60px; } @media screen and (max-width: 768px) { .contents_sub_title_typeB.access { margin-left: 30%; } } .contents_sub_title_typeB.access::before { left: 15px; } .contents_sub_title_typeB:before { content: ""; position: absolute; top: 50%; left: -40px; width: 30px; height: 1.5px; background: #FE0002; transform: translateY(-50%); } .contents_main_area { padding: 20px; width: 100%; background-color: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-content: space-between; gap: 20px; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3); } @media screen and (max-width: 768px) { .contents_main_area { flex-direction: column-reverse; align-items: flex-start; justify-content: flex-start; gap: 16px; padding: 27px 33px 35px 33px; } } .contents_main_area.flexEnd { align-items: flex-end; } @media screen and (max-width: 768px) { .contents_main_area.flexEnd { flex-direction: column; } } .contents_main_textArea { width: 695px; height: 262px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; } @media screen and (max-width: 768px) { .contents_main_textArea { width: 100%; height: auto; } } .contents_main_textArea_text { white-space: pre-wrap; font-size: 1.35rem; font-family: "NotoSansJpRegular"; line-height: 1.75; } @media screen and (max-width: 768px) { .contents_main_textArea_text { font-size: 1.2rem; } } .contents_main_textArea_btn { padding: 0 20px; width: 192px; height: 39px; background: #fff; font-size: 1.4rem; font-family: "NotoSansJpBlack"; color: #FE0002; border: 1px solid #FE0002; display: flex; align-items: center; justify-content: flex-end; gap: 3rem; } @media screen and (max-width: 768px) { .contents_main_textArea_btn { justify-content: center; width: 257px; height: 42px; margin: auto; gap: 2rem; padding-left: 3rem; margin-top: 24px; } } .contents_main_textArea_btn.typeB { align-self: flex-end; } .contents_main_textArea_btn:hover { color: #fff; background: #FE0002; } .contents_main_textArea_btn:hover i { color: #fff; transform: translateX(5px); } .contents_main_textArea_btn i { font-size: 14px; color: #FE0002; transition: 0.33s ease; } .contents_main_textArea_btn.center { margin: auto; } .contents_main_image { width: 466px; } @media screen and (max-width: 768px) { .contents_main_image { width: 100%; } } .bg_mask { position: relative; z-index: 0; } .bg_mask::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: rgba(0, 0, 0, 0.7); } .bg_mask::after { content: ""; position: absolute; width: 680px; height: 100%; -o-object-fit: contain; object-fit: contain; z-index: -1; top: 0; } @media screen and (max-width: 768px) { .bg_mask::after { width: 100%; height: 285px; } } .bg_mask.left::after { background-image: url("../dist/webp/common/triangle_right_top.webp"); right: 0; } @media screen and (max-width: 768px) { .bg_mask.left::after { background-image: url("../dist/webp/common/sp_triangle_top.webp"); top: -2px; right: 0; } } .bg_mask.right::after { background-image: url("../dist/webp/common/triangle_left_bottom.webp"); left: 0; } @media screen and (max-width: 768px) { .bg_mask.right::after { background-image: url("../dist/webp/common/sp_triangle_top.webp"); top: -2px; right: 0; } } .bg_mask.bottom_left::after { background-image: url("../dist/webp/common/triangle_left_bottom.webp"); top: -1px; right: 10px; transform: rotate(180deg); } @media screen and (max-width: 768px) { .bg_mask.bottom_left::after { background-image: url("../dist/webp/common/sp_triangle_top.webp"); top: -2px; right: 0; transform: none; } } .bg_mask.bottom_right::after { background-image: url("../dist/webp/common/triangle_right_top.webp"); transform: rotate(180deg); left: -20px; } @media screen and (max-width: 768px) { .bg_mask.bottom_right::after { background-image: url("../dist/webp/common/sp_triangle_top.webp"); top: -2px; right: 0; left: 0; transform: none; } } .sp_section_bg_triangle { display: none; } @media screen and (max-width: 768px) { .sp_section_bg_triangle { display: block; position: absolute; width: 100%; height: 291px; left: 0; bottom: -1px; } } .modal_wrapper { display: none; opacity: 0; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); overflow: hidden; z-index: 999999999999; transition: opacity 1s ease-in-out; } .modal_inner { position: absolute; top: 50%; left: 50%; width: 30%; transform: translate(-50%, -50%); padding: 0 30px 20px 30px; background: #fff; } @media screen and (max-width: 768px) { .modal_inner { width: 90%; } } .modal_inner_image img { width: 100%; height: auto; } .modal_inner_close { font-size: 3.4rem; padding: 10px 0 5px 0; } .modal_inner_close_btn { display: block; width: 25px; text-align: right; cursor: pointer; margin-left: auto; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .header { background: transparent; padding: 0.8em 0; width: 100%; height: 70px; position: absolute; z-index: 100000; } .header.fix { background: #fff; z-index: 80000; display: none; display: block; position: fixed; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.7); } @media screen and (max-width: 768px) { .header { padding: 5px; height: auto; } } .header_contents { max-width: 1366px; height: 100%; margin: auto; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 768px) { .header_contents { width: 100%; max-width: 100%; padding: 0 10px; height: 44px; } } .header_logo { display: block; font-size: 1.3rem; line-height: 1.2; width: 126.6px; } @media screen and (max-width: 768px) { .header_logo { width: 87px; } } .header_logo_top_text { font-size: 0.8rem; } .header_right_nav { margin-right: 2.5rem; font-size: 1.42rem; display: flex; gap: 2.5rem; } .header_right_nav_link { font-family: "NotoSansJpRegular"; color: #fff; position: relative; transition: 0.3s; } .header_right_nav_link::after { content: ""; position: absolute; bottom: -0.5rem; left: 0; width: 0; height: 1.5px; color: #FE0002; background: #FE0002; } .header_right_nav_link:hover { color: #FE0002; } .header_right_nav_link:hover::after { width: 100%; } .header_right_nav_link.fix { color: #707070; } .header_right_nav_link.fix::after { color: #707070; } .header_right_nav_link.fix:hover { color: #FE0002; } .header_right_area { display: flex; font-size: 0.8rem; align-items: center; } @media screen and (max-width: 768px) { .header_right_area { display: none; } } .header_right_btn { font-family: "NotoSansJpBold"; display: inline-block; width: 16.79rem; text-align: center; padding: 2.5px 0; color: #333; border: 1px solid #333; transition: 0.3s; } .header_right_btn:hover::after { opacity: 1; } .header_right_btn.contact { background: transparent; font-size: 1.7rem; color: #FE0002; border: 1px solid #FE0002; display: flex; align-items: center; justify-content: center; gap: 1rem; } .header_right_btn.contact:hover { color: #fff; background: #FE0002; } .header_right_btn.contact:hover i { color: #fff; } .header_right_btn.contact i { font-size: 22.8px; color: #FE0002; } .header_right_btn_phone, .header_right_btn_phone_contact { font-size: 2.56rem; font-family: "NotoSansJpBlack"; color: #fff; text-decoration: none; display: flex; justify-content: center; align-items: center; width: 240px; } .header_right_btn_phone:nth-child(2), .header_right_btn_phone_contact:nth-child(2) { width: 210px; } @media screen and (max-width: 768px) { .header_right_btn_phone, .header_right_btn_phone_contact { width: 80%; font-family: "NotoSansJpBold"; font-weight: normal; } } .header_right_btn_phone i, .header_right_btn_phone_contact i { font-size: 3.51rem; margin-right: 1.5rem; } .header_right_btn_phone_number, .header_right_btn_phone_contact_number { display: block; font-family: "DIN Alternate"; text-align: center; } .header_right_btn_phone_time, .header_right_btn_phone_contact_time { display: block; font-size: 1rem; font-family: "NotoSansJpBold"; text-align: center; } .header_right_btn_phone.fix, .header_right_btn_phone_contact.fix { color: #144A6F; } .hamburger_menu_wrapper { position: relative; width: 50px; height: 100%; } .hamburger_menu_line { display: block; width: 24px; height: 2px; background: #fff; position: absolute; top: 50%; right: 0; transform: translateY(-50%); } .hamburger_menu_line.fix { background: #000; } .hamburger_menu_line.fix::before, .hamburger_menu_line.fix::after { background: #000; } .hamburger_menu_line::before, .hamburger_menu_line::after { content: ""; display: block; width: 24px; height: 2px; background: #fff; position: absolute; right: 0; transition: 0.3s; } .hamburger_menu_line::before { top: 8px; } .hamburger_menu_line::after { top: -8px; } .hamburger_menu_line.open { background: transparent; } .hamburger_menu_line.open::before { top: 0; transform: rotate(45deg); } .hamburger_menu_line.open::after { top: 0; transform: rotate(-45deg); } .drawer_menu_wrapper { position: fixed; padding-top: 36px; top: -3000px; left: 0; width: 100%; height: 100vh; background: #333; z-index: -1; transition: 0.3s; } .drawer_menu_wrapper.open { top: 0; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .hero_section_slider { width: 100vw; height: 100vh; } @media screen and (max-width: 600px) { .hero_section_slider { height: 100%; } } .hero_section_slider .slick-list.draggable { height: 100% !important; } .hero_section_slider_image { -o-object-fit: cover; object-fit: cover; } .hero_section .inner { width: 87%; height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; position: relative; top: 21%; margin: 0 auto; } .hero_section_title { font-family: "NotoSansJpBlack"; font-weight: normal; font-size: 7.2rem; color: #fff; letter-spacing: 0; z-index: -1; } @media screen and (max-width: 600px) { .hero_section_title { font-size: 13vw; line-height: 78px; } } .hero_section_subtitle { font-size: 3.2rem; font-family: "NotoSansJpBlack"; color: #fff; letter-spacing: 0.1em; line-height: 2; margin-top: 1rem; z-index: -1; } @media screen and (max-width: 600px) { .hero_section_subtitle { font-size: 3.45vw; line-height: 35px; } } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .news_section { padding: 80px 0; } .news_section_inner { max-width: 1366px; margin: auto; } .news_section_slider_area { padding: 70px 0; } @media screen and (max-width: 600px) { .news_section_slider_area { padding: 24px 0 40px 0; } } .news_section_slick_track { display: flex; align-items: center; justify-content: center; gap: 23px; } .news_section_slider_area .slick-slide, .news_section_slick_track .slick-slide { aspect-ratio: 1/1; } @media screen and (max-width: 600px) { .news_section_slider_area .slick-slide, .news_section_slick_track .slick-slide { aspect-ratio: 1/1; } } .news_section_slider_area .slick-slide img, .news_section_slick_track .slick-slide img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .management_philosophy_section { background-position: top center; background-size: cover; background-repeat: no-repeat; width: 100vw; height: 485px; } @media screen and (max-width: 600px) { .management_philosophy_section { width: 100%; padding: 22px 25px 315px 22px; height: auto; background-size: cover; } } .management_philosophy_section_inner { max-width: 1217px; height: 100%; margin: auto; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 25px; padding-top: 40px; padding-bottom: 40px; } @media screen and (max-width: 600px) { .management_philosophy_section_inner { padding: 0; height: auto; } } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .businessContent_section { margin-top: 160px; background-position: top center; background-size: cover; background-repeat: no-repeat; width: 100vw; height: 485px; } @media screen and (max-width: 600px) { .businessContent_section { margin-top: 0; width: 100%; padding: 22px 25px 315px 22px; height: auto; background-size: cover; } } .businessContent_section_inner { max-width: 1217px; height: 100%; margin: auto; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 25px; padding-top: 40px; padding-bottom: 40px; } .businessContent_page_inner { margin: auto; max-width: 878px; } @media screen and (max-width: 600px) { .businessContent_page_inner { padding: 0 25px; } } .businessContent_page_content_area:not(:first-child) { margin-top: 52.6px; } .businessContent_page_content_title { position: relative; } .businessContent_page_content_number { font-size: 10.95rem; font-family: "DIN Alternate"; color: #FE0002; opacity: 0.3; } @media screen and (max-width: 600px) { .businessContent_page_content_number { font-size: 5.6rem; } } .businessContent_page_content_number.reverse { text-align: right; } .businessContent_page_content_imgTxt_area { margin-top: 52.6px; display: flex; align-items: center; justify-content: space-between; gap: 20px; } @media screen and (max-width: 600px) { .businessContent_page_content_imgTxt_area { flex-direction: column; } } .businessContent_page_content_imgTxt_area.reverse { flex-direction: row-reverse; } @media screen and (max-width: 600px) { .businessContent_page_content_imgTxt_area.reverse { flex-direction: column; } } .businessContent_page_content_imgTxt_img { width: 382px; height: 254.7px; } @media screen and (max-width: 600px) { .businessContent_page_content_imgTxt_img { width: 100%; height: 229px; } } .businessContent_page_content_imgTxt_txt { width: 412px; font-size: 1.42rem; font-family: "NotoSansJpMedium"; letter-spacing: 0.1em; } @media screen and (max-width: 600px) { .businessContent_page_content_imgTxt_txt { width: 100%; font-size: 1.1rem; } } .businessContent_page_content_imgTxt_txt.red { color: #FE0002; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .owned_equipment_section { margin-top: 160px; background-position: top center; background-size: cover; background-repeat: no-repeat; width: 100vw; height: 485px; } @media screen and (max-width: 600px) { .owned_equipment_section { margin-top: 0; width: 100%; padding: 22px 25px 315px 22px; height: auto; background-size: cover; } } .owned_equipment_section_inner { max-width: 1217px; height: 100%; margin: auto; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 25px; padding-top: 40px; padding-bottom: 40px; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .actualIntroduction_section { margin-top: 160px; padding: 40px 0; background: #DCDCDC; } @media screen and (max-width: 600px) { .actualIntroduction_section { margin-top: 80px; } } .actualIntroduction_section_inner { max-width: 1366px; margin: auto; } .actualIntroduction_section_slider_area { padding: 50px 0; } .actualIntroduction_section_slick_track { display: flex; align-items: center; justify-content: center; gap: 60px; } @media screen and (max-width: 600px) { .actualIntroduction_section_slick_track { gap: 23px; } } .actualIntroduction_section_slick_slide { aspect-ratio: 1/1; } .actualIntroduction_section_slick_slide img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .companyProfile_section { margin-top: 160px; background-position: top center; background-size: cover; background-repeat: no-repeat; width: 100vw; height: 485px; } @media screen and (max-width: 600px) { .companyProfile_section { margin-top: 80px; width: 100%; padding: 22px 25px 315px 22px; height: auto; background-size: cover; } } .companyProfile_section_inner { max-width: 1217px; height: 100%; margin: auto; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 25px; padding-top: 40px; padding-bottom: 40px; } .companyProfile_page_inner { margin: auto; max-width: 878px; } @media screen and (max-width: 600px) { .companyProfile_page_inner { max-width: 100%; padding: 0 25px; } } .companyProfile_page_greeting { padding-top: 20px; font-size: 5.69rem; font-family: "NotoSerifJpBold"; color: #000; text-align: center; position: relative; } @media screen and (max-width: 600px) { .companyProfile_page_greeting { font-size: 3.2rem; white-space: nowrap; } } .companyProfile_page_greeting:after { content: ""; width: 100vw; height: 72.5px; position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); background-color: #999999; z-index: -1; } @media screen and (max-width: 600px) { .companyProfile_page_greeting:after { height: 20px; bottom: 5px; } } .companyProfile_page_greeting_bigRedTxt { font-size: 11.38rem; color: #FE0002; } @media screen and (max-width: 600px) { .companyProfile_page_greeting_bigRedTxt { font-size: 5rem; } } .companyProfile_page_greeting.gold:after { background-color: #CEB773; } .companyProfile_page_text { margin: auto; padding: 53.7px 0 30.7px; width: 878px; font-size: 1.7rem; } @media screen and (max-width: 600px) { .companyProfile_page_text { padding: 39px 0 43px 0; font-size: 1.3rem; width: 100%; } } .companyProfile_page_table { margin-left: auto; width: 584px; border-collapse: collapse; border-spacing: 0; font-size: 1.42rem; line-height: 29px; color: #000; text-align: left; } @media screen and (max-width: 600px) { .companyProfile_page_table { margin-top: 67px; width: 100%; } } .companyProfile_page_table th { padding: 10.6px 0 10.6px 11.4px; width: 204px; font-family: "NotoSansJpBlack"; vertical-align: middle; border-bottom: 1px solid #707070; } .companyProfile_page_table td { padding: 10.6px 0; font-family: "NotoSansJpMedium"; border-bottom: 1px solid #707070; } .companyProfile_page_map { margin-top: 27.7px; padding: 0; width: 586.9px; height: 470.9px; margin-left: auto; } @media screen and (max-width: 600px) { .companyProfile_page_map { width: 100%; height: 438px; } } @media screen and (max-width: 600px) { .companyProfile_page_map iframe { width: 100%; height: 100%; } } .redTxt { color: #FE0002; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .contact_section { position: relative; margin-top: 160px; padding: 66px 0; width: 100vw; height: 485px; z-index: 0; background-position: center center; } @media screen and (max-width: 600px) { .contact_section { height: auto; margin-top: 80px; padding: 105px 0 185px 0; background-position: bottom right; background-size: cover; } } .contact_section::before { content: ""; z-index: -1; background-color: rgba(0, 0, 0, 0.7); position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .contact_section::after { content: ""; background-image: url("../dist/webp/common/contact_banner_bg_obj.webp"); background-repeat: no-repeat; background-size: 100% 100%; background-position: center center; position: absolute; top: 0; left: 0; width: 532px; height: 100%; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 600px) { .contact_section::after { display: none; } } .contact_section_inner { max-width: 1366px; margin: auto; } .contact_section_tellArea { display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 600px) { .contact_section_tellArea { flex-direction: column; align-items: center; justify-content: flex-start; gap: 18px; } } .contact_section_message { padding: 25px 0; font-size: 1.28rem; font-family: "NotoSansJpRegular"; color: #fff; text-align: center; } .contact_section_btn { font-family: "NotoSansJpBold"; display: inline-block; width: 100%; text-align: center; padding: 5px 0; color: #333; border: 1px solid #333; transition: 0.3s; } .contact_section_btn:hover::after { opacity: 1; } .contact_section_btn_area { margin: auto; width: 315px; } @media screen and (max-width: 600px) { .contact_section_btn_area { width: 289px; } } .contact_section_btn.contact { padding: 10px 0 10px 10px; background: transparent; font-size: 1.28rem; color: #fff; border: 1px solid #fff; display: flex; align-items: center; justify-content: center; gap: 1rem; position: relative; } @media screen and (max-width: 600px) { .contact_section_btn.contact { gap: 13px; } } .contact_section_btn.contact:hover { color: #fff; } .contact_section_btn.contact:hover i { color: #fff; } .contact_section_btn.contact:hover i:nth-child(2) { transform: translateX(10px); } .contact_section_btn.contact:hover::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(128, 128, 128, 0.5); } .contact_section_btn.contact i { font-size: 2.28rem; color: #fff; transition: 0.33s ease; } .contact_section_btn.contact i:nth-child(2) { font-size: 1.28rem; color: #fff; margin-left: 40px; } @media screen and (max-width: 600px) { .contact_section_btn.contact i:nth-child(2) { margin-left: 0; } } .sp_contact_bg_obj { display: none; } @media screen and (max-width: 600px) { .sp_contact_bg_obj { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .sp_contact_bg_obj::before { content: ""; width: 210px; height: 210px; background-image: url("../dist/webp/common/sp_contact_banner_obj_top.webp"); background-repeat: no-repeat; background-size: 100% 100%; position: absolute; top: 0; left: 0; } .sp_contact_bg_obj::after { content: ""; width: 210px; height: 210px; background-image: url("../dist/webp/common/sp_contact_banner_obj_bottom.webp"); background-repeat: no-repeat; background-size: 100% 100%; position: absolute; bottom: 0; right: 0; } } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .subHero_section_image_area { width: 100vw; height: 330px; position: relative; z-index: 90000; } .subHero_section_image_area::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: rgba(0, 0, 0, 0.6); } .subHero_section_image_area img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @media screen and (max-width: 768px) { .subHero_section_image_area { height: 157px; } } .subHero_section_title_area { text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 90000; } @media screen and (max-width: 768px) { .subHero_section_title_area { width: 100%; } } .subHero_section_title_typeA { font-size: 3rem; font-family: "NotoSerifJpMedium"; color: #fff; letter-spacing: 0.03rem; line-height: 2; z-index: -1; } @media screen and (max-width: 768px) { .subHero_section_title_typeA { font-size: 2.6rem; } } .subHero_section_sub_title_typeA { margin: auto; width: -moz-fit-content; width: fit-content; font-size: 1.42rem; font-family: "ZenOldMincho"; color: #FE0002; position: relative; left: 20px; } .subHero_section_sub_title_typeA:before { content: ""; position: absolute; top: 50%; left: -40px; width: 30px; height: 1.5px; background: #FE0002; transform: translateY(-50%); } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .actual_section_inner { max-width: 1246px; margin: auto; } @media screen and (max-width: 600px) { .actual_section_inner { width: 100%; overflow: hidden; padding: 0 25px; } } .actual_section_slick_slide { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } @media screen and (max-width: 600px) { .actual_section_slick_slide { grid-template-columns: repeat(2, 1fr); } } .actual_section_slick_image { cursor: pointer; width: 287.2px; height: 287.2px; -o-object-fit: cover; object-fit: cover; overflow: hidden; position: relative; } .actual_section_slick_image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: transform 0.33s ease-in-out; } @media screen and (max-width: 600px) { .actual_section_slick_image { width: 100%; height: initial; aspect-ratio: 1/1; } } .actual_section_slick_image:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); transition: background-color 0.33s ease-in-out; } .actual_section_slick_image_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 2.27rem; font-family: "NotoSansJpMedium"; z-index: 1; } @media screen and (max-width: 600px) { .actual_section_slick_image_text { font-size: 18px; } } .actual_section_slick_image:hover img { transform: scale(1.1); transition: transform 0.33s ease-in-out; } .actual_section_slick_image:hover .actual_section_slick_image_text { display: none; } .actual_section_slick_image:hover:after { background-color: transparent; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .equipment_section { width: 100%; } .equipment_section_inner { max-width: 1246px; margin: auto; } @media screen and (max-width: 600px) { .equipment_section_inner { padding: 0 25px; } } .equipment_section_slick_slide { padding: 72.6px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 78.2px; } @media screen and (max-width: 600px) { .equipment_section_slick_slide { grid-template-columns: repeat(2, 1fr); padding: 1.5rem 0 4.5rem; gap: 1.5rem; } } .equipment_section_slick_slide:last-child { padding-bottom: 0; } .equipment_section_slick_image { width: 352.8px; height: 352.8px; -o-object-fit: cover; object-fit: cover; overflow: hidden; position: relative; cursor: pointer; } .equipment_section_slick_image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: transform 0.33s ease-in-out; } @media screen and (max-width: 600px) { .equipment_section_slick_image { width: 100%; height: initial; aspect-ratio: 1/1; } } .equipment_section_slick_image:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); transition: background-color 0.33s ease-in-out; } .equipment_section_slick_image_text { position: absolute; bottom: 0; left: 50%; width: 100%; height: 51.2px; transform: translateX(-50%); color: #fff; background-color: #FE0002; text-align: center; line-height: 51.2px; font-size: 2.27rem; font-family: "NotoSansJpBold"; z-index: 1; } @media screen and (max-width: 600px) { .equipment_section_slick_image_text { font-size: 9px; height: 24px; line-height: 24px; } } .equipment_section_slick_image:hover img { transform: scale(1.1); transition: transform 0.33s ease-in-out; } .equipment_section_slick_image:hover .actual_section_slick_image_text { display: none; } .equipment_section_slick_image:hover:after { background-color: transparent; } .equipment_section_slick_title { width: calc(783.8px + (100vw - 1246px) / 2); height: calc((783.8px + (100vw - 1246px) / 2) / 10 * 0.54); line-height: calc((783.8px + (100vw - 1246px) / 2) / 10 * 0.54); background-repeat: no-repeat; background-size: cover; position: relative; color: #fff; font-size: 2.99rem; font-family: "NotoSansJpBold"; letter-spacing: 1.3rem; } @media screen and (max-width: 600px) { .equipment_section_slick_title { width: calc(100vw - 25px); height: calc((100vw - 25px) / 10 * 0.71); line-height: calc((100vw - 25px) / 10 * 0.71); font-size: 12px; letter-spacing: 0.3rem; position: relative; } } .equipment_section_slick_title.left { margin-right: auto; padding-left: calc(50% - 623px + 75px); } @media screen and (max-width: 600px) { .equipment_section_slick_title.left { padding-left: 25px; } } .equipment_section_slick_title.right { margin-left: auto; padding-right: calc(50% - 623px + 75px); text-align: right; background-position: right; } @media screen and (max-width: 600px) { .equipment_section_slick_title.right { padding-right: 25px; } } .equipment_section_slick_title.top_space { margin-top: 72.6px; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .breadcrumb { margin: 0 auto; max-width: 878px; padding: 19px 0 83px; } .breadcrumb.wide { max-width: 100%; } @media screen and (max-width: 600px) { .breadcrumb { padding: 19px 0 42px; } } .breadcrumb_home { font-size: 1.28rem; font-family: "NotoSansJpMedium"; color: #FE0002; } @media screen and (max-width: 600px) { .breadcrumb_home { font-size: 10px; } } .breadcrumb_name { font-size: 1.28rem; font-family: "NotoSansJpMedium"; color: #000; } @media screen and (max-width: 600px) { .breadcrumb_name { font-size: 10px; } } .pageJumpButton_textArea_btn { margin: 149px auto; padding: 0 40px 0 0; width: 340px; height: 58.3px; background: #fff; font-size: 2.27rem; font-family: "NotoSansJpMedium"; color: #FE0002; border: 1px solid #FE0002; display: flex; align-items: center; justify-content: center; position: relative; gap: 5rem; } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn { margin: 67px auto; padding: 0; font-size: 16px; gap: 0; } } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn i { position: relative; left: -30px; } } .pageJumpButton_textArea_btn:hover { color: #fff; background: #FE0002; } .pageJumpButton_textArea_btn:hover i { color: #fff; transform: translateX(-10px); } .pageJumpButton_textArea_btn i { font-size: 2.5rem; color: #FE0002; transition: 0.33s ease; } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn { width: 257px; height: 42.26px; font-size: 16px; } } .pageJumpButton_textArea_btn.contact { cursor: pointer; margin: 40px auto; padding: 0 40px 0 30px; } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.contact { margin: 20px auto 0; padding: 0 15px 0 0; } } .pageJumpButton_textArea_btn.step { position: relative; left: 0; } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.step { margin: 60px auto 0; } } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.step i { position: relative; left: 30px; } } .pageJumpButton_textArea_btn.step:hover i { color: #fff; transform: translateX(10px); } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.step:hover i { left: 30px; } } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.last_step { padding: 0; left: 0; } } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.last_step i { position: relative; left: 35px; } } .pageJumpButton_textArea_btn.last_step:hover i { color: #fff; transform: translateX(10px); } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn.last_step:hover i { left: 35px; } } .pageJumpButton_textArea_btn .wpcf7-submit { position: relative; left: 15px; } @media screen and (max-width: 600px) { .pageJumpButton_textArea_btn .wpcf7-submit { left: 5px; } } .pageJumpButton_textArea_btn .wpcf7-spinner { display: none; } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .contact_page_inner { margin: auto; max-width: 878px; } @media screen and (max-width: 600px) { .contact_page_inner { padding: 0 25px; } } .contact_page_inner.thanks p { font-size: 22.7px; font-family: "NotoSansJpMedium"; text-align: center; } @media screen and (max-width: 600px) { .contact_page_inner.thanks p { font-size: 12px; } } .contact_page_inner.thanks p:last-of-type { margin-bottom: 160px; } @media screen and (max-width: 600px) { .contact_page_inner.thanks p:last-of-type { margin-bottom: 80px; } } .contact_page_inner .wpcf7 form .wpcf7-response-output { display: none; } .contact_page_inner .wpcf7-not-valid-tip { color: #dc3232; font-size: 1.7rem; font-family: "NotoSansJpMedium"; } @media screen and (max-width: 600px) { .contact_page_inner .wpcf7-not-valid-tip { font-size: 8px; } } .contact_page_inner .loading { font-size: 1.7rem; font-family: "NotoSansJpMedium"; color: #707070; } @media screen and (max-width: 600px) { .contact_page_inner .loading { font-size: 8px; } } .contact_page_title { font-size: 1.7rem; font-family: "NotoSansJpBold"; } @media screen and (max-width: 600px) { .contact_page_title { font-size: 10.5px; } } .contact_page_contents_mail_area { margin-top: 52.6px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 28.4px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_area { margin-top: 26px; gap: 10px; } } .contact_page_contents_mail_area.reverse { flex-direction: row-reverse; } .contact_page_contents_mail_area .wpcf7-form-control-wrap[data-name=privacyPolicy] { display: block; width: 100%; text-align: center; } .contact_page_contents_mail_area .wpcf7-form-control-wrap[data-name=privacyPolicy] input { all: revert; position: relative; top: 2px; } .contact_page_contents_mail_form_area { width: 100%; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_area { flex-direction: column; align-items: flex-start; } .contact_page_contents_mail_form_area .wpcf7-form-control-wrap { width: 100%; } } .contact_page_contents_mail_form_area.radio, .contact_page_contents_mail_form_area.messageArea { align-items: flex-start; } .contact_page_contents_mail_form_area_zip, .contact_page_contents_mail_form_area_phone { width: 549px; display: flex; align-items: flex-start; justify-content: flex-start; gap: 10px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_area_zip, .contact_page_contents_mail_form_area_phone { width: 100%; gap: 0; } } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_area_zip .wpcf7-form-control-wrap, .contact_page_contents_mail_form_area_phone .wpcf7-form-control-wrap { width: 27%; } } .contact_page_contents_mail_form_area_phone .wpcf7-form-control-wrap { width: 30%; } .contact_page_contents_mail_form_label { display: inline-block; width: 320px; font-size: 2.56rem; font-family: "NotoSansJpMedium"; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_label { font-size: 12px; justify-content: flex-start; } } .contact_page_contents_mail_form_label.privacy { margin-top: 40px; width: 100%; font-size: 1.99rem; text-align: center; justify-content: center; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_label.privacy { margin-top: 20px; font-size: 12px; } } .contact_page_contents_mail_form_label.privacy .link { width: initial; display: inline; text-decoration: underline; color: #557FD4; } .contact_page_contents_mail_form_label.confirm { width: 279px; } .contact_page_contents_mail_form_required { margin: auto 41.2px auto auto; width: 62.6px; height: 26.3px; font-size: 1.7rem; font-family: "NotoSansJpBold"; background-color: #FE0002; color: #fff; text-align: center; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_required { width: initial; height: initial; font-size: 8px; font-family: "NotoSansJpBlack"; margin: auto 0 auto 6px; padding: 2px 4px; position: relative; top: 0; } } .contact_page_contents_mail_form_required.radio { margin: 6px 41.2px 0 auto; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_required.radio { margin: auto 0 auto 6px; } } .contact_page_contents_mail_form_required.privacy { display: inline-block; margin-left: 10px; position: relative; top: -2px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_required.privacy { width: initial; height: initial; } } .contact_page_contents_mail_form_input { width: 549px; height: 39.8px; border: 1px solid #DCDCDC; border-radius: 5px; font-size: 1.99rem; font-family: "NotoSansJpMedium"; padding: 0 11.3px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input { margin-top: 10px; width: 100%; height: 28px; font-size: 10px; } } .contact_page_contents_mail_form_input::-moz-placeholder { color: #DCDCDC; } .contact_page_contents_mail_form_input::placeholder { color: #DCDCDC; } .contact_page_contents_mail_form_input.textarea { height: 235px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.textarea { height: 118px; } } .contact_page_contents_mail_form_input.textarea.confirm { height: auto; } .contact_page_contents_mail_form_input.confirm { border: none; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.confirm { padding: 0; font-size: 12px; } } .contact_page_contents_mail_form_input.privacy { margin: 0 auto; padding: 15px; width: 90%; height: 128px; font-size: 1.28rem; font-family: "NotoSansJpMedium"; overflow-y: scroll; } .contact_page_contents_mail_form_input.privacy::-webkit-scrollbar { display: block; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.privacy { padding: 5px; height: 77px; font-size: 8px; } } .contact_page_contents_mail_form_input.privacy .big_text { font-size: 1.4rem; font-family: "NotoSansJpBold"; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.privacy .big_text { font-size: 9px; } } .contact_page_contents_mail_form_input.zip_code { width: 125px; height: 39.8px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.zip_code { width: 100%; height: 28px; } } .contact_page_contents_mail_form_input.search_btn { margin-left: 5px; padding: 0; width: 92px; font-size: 12.6px; font-family: "NotoSansJpMedium"; line-height: 28px; text-align: center; border-radius: 5px; background-color: #707070; color: #fff; } .contact_page_contents_mail_form_input.search_btn:hover { cursor: pointer; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_input.search_btn { width: 65px; font-size: 11px; } } .contact_page_contents_mail_form_input.phone_number { width: 100%; } .contact_page_contents_mail_form_input_bar { font-size: 12px; margin: 10px 5px 0; } .contact_page_contents_mail_form_loading { margin: 10px 5px 0; font-size: 1.7rem; font-family: "NotoSansJpMedium"; line-height: 28px; color: #707070; display: none; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_loading { font-size: 10px; } } .contact_page_contents_mail_form_radio_area { margin-top: 6px; width: 549px; font-size: 1.99rem; font-family: "NotoSansJpMedium"; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 28.4px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_radio_area { margin-top: 10px; width: 100%; font-size: 10px; flex-direction: row; display: grid; gap: 6px; } } .contact_page_contents_mail_form_radio_area input { all: revert; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_radio_area .wpcf7-list-item { margin: 0; } .contact_page_contents_mail_form_radio_area .wpcf7-list-item input { margin: 0 6px 0 0; position: relative; top: 2px; } } .contact_page_contents_mail_form_radio_area .wpcf7-list-item-label { margin-left: 10px; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_radio_area .wpcf7-list-item-label { margin-left: 0; } } .contact_page_contents_mail_form_buttons { margin-top: 20px; width: 100%; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_buttons { flex-direction: column-reverse; align-items: flex-start; justify-content: flex-start; gap: 10px; } } .contact_page_contents_mail_form_checkbox { font-size: 1.7rem; font-family: "NotoSansJpMedium"; } .contact_page_contents_mail_form_checkbox .wpcf7-list-item { margin: 0; } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_checkbox .wpcf7-list-item { margin: 0; } .contact_page_contents_mail_form_checkbox .wpcf7-list-item input { margin: 0 6px 0 0; position: relative; top: 2px; } } @media screen and (max-width: 600px) { .contact_page_contents_mail_form_checkbox { font-size: 14px; } } @font-face { font-family: "NotoSansJpMedium"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Medium.otf); } @font-face { font-family: "NotoSansJpRegular"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Regular.otf); } @font-face { font-family: "NotoSansJpBold"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Bold.otf); } @font-face { font-family: "NotoSansJpThin"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Thin.otf); } @font-face { font-family: "NotoSansJpLight"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Light.otf); } @font-face { font-family: "NotoSansJpBlack"; src: url(../fonts/Noto_Sans_JP/NotoSansJP-Black.otf); } @font-face { font-family: "NotoSerifJpRegular"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Regular.otf); } @font-face { font-family: "NotoSerifJpMedium"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Medium.otf); } @font-face { font-family: "NotoSerifJpBold"; src: url(../fonts/Noto_Serif_JP/NotoSerifJP-Bold.otf); } @font-face { font-family: "ZenOldMincho"; src: url(../fonts/Zen_Old_Mincho/ZenOldMincho-Medium.ttf); } /*--------------------------------------------------*\ | カラー | \*--------------------------------------------------*/ /*--------------------------------------------------*\ | レスポンシブ | \*--------------------------------------------------*/ /* パソコンで見たときは"pc"のclassがついた画像が表示される */ .pc { display: block !important; } .pc_inline { display: inline; } .pc_fx { display: flex; } .sp { display: none !important; } .sp_inline { display: none !important; } .sp_fx { display: none !important; } /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */ @media screen and (max-width: 600px) { .pc { display: none !important; } .pc_fx { display: none !important; } .pc_inline { display: none !important; } .sp { display: block !important; } .sp_inline { display: inline !important; } .sp_fx { display: flex !important; } } /*--------------------------------------------------*\ | utilty | \*--------------------------------------------------*/ .u_pc { display: block; } @media screen and (max-width: 600px) { .u_pc { display: none; } } .u_sp { display: none; } @media screen and (max-width: 600px) { .u_sp { display: block; } } .u_sp_imp { display: none !important; } @media screen and (max-width: 600px) { .u_sp_imp { display: block; } } .footer { background: transparent; padding: 0.8em 0; width: 100%; height: 162px; position: absolute; z-index: 100000; } @media screen and (max-width: 768px) { .footer { height: 70px; } } .footer_contents { max-width: 1366px; height: 100%; margin: auto; padding-right: 37em; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 768px) { .footer_contents { margin-top: 41px; width: 100%; max-width: 100%; padding: 0 24px; justify-content: center; } } @media screen and (max-width: 768px) { .footer_contents.address { margin-top: 16px; } } .footer_logo { display: block; font-size: 1.3rem; line-height: 1.2; width: 126.6px; } @media screen and (max-width: 768px) { .footer_logo { width: 171px; } } .footer_logo_top_text { font-size: 0.8rem; } .footer_address { padding-left: 12px; font-size: 1.14rem; line-height: 18px; font-family: "NotoSansJpMedium"; color: #000; } @media screen and (max-width: 768px) { .footer_address { padding: 0; font-size: 1.2rem; } } .footer_right_nav { margin-right: 1rem; font-size: 1.42rem; display: flex; gap: 5.8rem; } @media screen and (max-width: 768px) { .footer_right_nav { padding-top: 41px; width: 289px; margin: auto; row-gap: 1.2rem; -moz-column-gap: 3.7rem; column-gap: 3.7rem; flex-wrap: wrap; } } .footer_right_nav.hb_menu { justify-content: space-between; row-gap: 2rem; } .footer_right_nav_link { font-family: "NotoSansJpRegular"; color: #707070; position: relative; transition: 0.3s; } .footer_right_nav_link:hover { color: #FE0002; } .footer_right_nav_link:hover i { color: #fff; } .footer_right_nav_link:hover i::after { border: 1px solid #FE0002; background: #FE0002; } .footer_right_nav_link:hover::after { width: 100%; background: #FE0002; } .footer_right_nav_link.hb_menu { font-size: 2.4rem; color: #fff; } .footer_right_nav_link.hb_menu i { font-size: 1.8rem; color: #fff; } .footer_right_nav_link.hb_menu i::after { padding: 12.5px; bottom: -4px; left: -9px; } .footer_right_nav_link i { font-size: 0.8rem; margin-right: 8px; color: #FE0002; position: relative; bottom: 2.5px; } .footer_right_nav_link i::after { content: ""; border: 1px solid #707070; border-radius: 50%; padding: 6.5px; position: absolute; bottom: -3.5px; left: -5px; width: 100%; height: 100%; z-index: -1; } .footer_right_area { display: flex; font-size: 0.8rem; align-items: center; } @media screen and (max-width: 768px) { .footer_right_area { display: none; } } .footer_right_btn { font-family: "NotoSansJpBold"; display: inline-block; width: 16.79rem; text-align: center; padding: 5px 0; color: #333; border: 1px solid #333; transition: 0.3s; } .footer_right_btn:hover::after { opacity: 1; } .footer_right_btn.contact { background: transparent; font-size: 1.7rem; color: #FE0002; border: 1px solid #FE0002; display: flex; align-items: center; justify-content: center; gap: 1rem; } .footer_right_btn.contact:hover { color: #fff; background: #FE0002; } .footer_right_btn.contact:hover i { color: #fff; } .footer_right_btn.contact i { font-size: 22.8px; color: #FE0002; } .footer_right_btn_phone { font-size: 2.56rem; font-family: "NotoSansJpBlack"; color: #fff; text-decoration: none; display: flex; justify-content: center; align-items: center; width: 240px; } @media screen and (max-width: 768px) { .footer_right_btn_phone { width: 80%; font-family: "NotoSansJpBold"; font-weight: normal; } } .footer_right_btn_phone i { font-size: 3.51rem; margin-right: 1.5rem; } .footer_right_btn_phone_number { display: block; font-family: "DIN Alternate"; text-align: center; } .footer_right_btn_phone_time { display: block; font-size: 1rem; font-family: "NotoSansJpBold"; text-align: center; } .footer_right_btn_phone.done { color: #144A6F; } .footer_copyRight { margin-top: 47.67px; height: 35px; line-height: 35px; font-size: 1.28rem; font-family: "NotoSansJpRegular"; color: #fff; background: #333; text-align: center; } @media screen and (max-width: 768px) { .footer_copyRight { margin-top: 31px; font-size: 1.2rem; } } .privacy_policy_contents h2 { font-family: "NotoSansJpBlack"; font-size: 2.4rem; margin: 20px 0; position: relative; padding-left: 15px; } @media screen and (max-width: 768px) { .privacy_policy_contents h2 { font-size: 2rem; } } .privacy_policy_contents h2::before { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); display: block; width: 5px; height: 70%; background: #ED1A3D; } .privacy_policy_contents p { font-size: 1.6rem; line-height: 1.6; } @media screen and (max-width: 768px) { .privacy_policy_contents p { font-size: 1.3rem; } } .privacy_policy_contents ol { list-style-type: decimal; padding-left: 30px; line-height: 1.6; } .privacy_policy_contents ol ol { margin: 5px 0 10px 0; } @media screen and (max-width: 768px) { .privacy_policy_contents ol { padding-left: 20px; } } .privacy_policy_contents li { font-size: 1.6rem; line-height: 1.6; } .privacy_policy_contents li::marker { color: #ED1A3D; } @media screen and (max-width: 768px) { .privacy_policy_contents li { font-size: 1.3rem; } } .privacy_policy_contents a { color: #557FD4; text-decoration: underline; }/*# sourceMappingURL=styles.css.map */