/* Scss Document */ $color:#a08f1a; //サイトで良く使う色 $text:#000; //基本的なテキストの色 //hoverアニメーションを使いたい場合に使用 //呼び出し方法(cssに指定) → @include ani; @mixin ani { transition: 0.3s ease-in-out; } //display:flex;を使用した場合等に使用(widthが30%から70%まで)画面幅が768pxで100%に変わる //呼び出し方法(htmlに指定) → .flex_30 ~ .flex_70 @for $i from 30 through 70 { .flex_#{$i} { width: 1% * $i; } } //縮めた際の最小サイズ :root { --min-size: 100px; // 最小サイズ --clamp-vw: 18vw; // 通常の基準値 } @media (max-width: 1024px) { :root { --min-size: 60px; // 最小サイズ --clamp-vw: 10vw; // スマホで適度に小さくする } } $p: 100; @while $p < 310{ .padding#{$p}{ padding-top: clamp(var(--min-size),var(--clamp-vw), #{$p}px); padding-bottom: clamp(var(--min-size),var(--clamp-vw), #{$p}px); } $p: $p + 10; } $m: 100; @while $m < 310{ .margin#{$m}{ margin-top: clamp(var(--min-size),var(--clamp-vw), #{$m}px); margin-bottom: clamp(var(--min-size),var(--clamp-vw), #{$m}px); } $m: $m + 10; } $pt: 100; @while $pt < 310{ .pt-#{$pt}{ padding-top: clamp(var(--min-size),var(--clamp-vw), #{$pt}px); } $pt: $pt + 10; } $pb: 100; @while $pb < 310{ .pb-#{$pb}{ padding-bottom: clamp(var(--min-size),var(--clamp-vw), #{$pb}px); } $pb: $pb + 10; } $mt: 100; @while $mt < 310{ .mt-#{$mt}{ margin-top: clamp(var(--min-size),var(--clamp-vw), #{$mt}px); } $mt: $mt + 10; } $mb: 100; @while $mb < 310{ .mb-#{$mb}{ margin-bottom: clamp(var(--min-size),var(--clamp-vw), #{$mb}px); } $mb: $mb + 10; } a { transition: var(--trans_300ms); text-decoration: none; color: var(--basecolor); } a:focus, a:visited, a:focus-visible { text-decoration: none; color: var(--basecolor); } a:hover, a:active { text-decoration: none; color: var(--blue44a1c4); } /************************/ /*** common ***/ html { scroll-padding-top: 90px; } .header { position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 90px; border-bottom: 2px solid rgba(255, 255, 255, 0.95); background-color: transparent; transition: background-color 0.4s ease; } .header.is-scrolled { background-color: #1ba5d8; } .header_wrapper { display: flex; align-items: center; width: 100%; max-width: none; height: 100%; margin: 0; padding-left: 100px; } .logo_link { display: block; width: 225px; } .headermenu { display: flex; align-items: stretch; height: 100%; margin-left: auto; } .header_nav { height: 100%; } .header_nav_list { display: flex; align-items: center; height: 100%; } .header_nav_listitem { height: 100%; } .header_nav_link { display: flex; align-items: center; height: 100%; padding: 0 31px; color: #fff; font-size: 20px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; white-space: nowrap; } .header_linkbutton { display: flex; height: 100%; margin-left: 28px; } .header_contact { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 181px; height: 100%; color: #1b3e7f; background: rgba(255, 255, 255, 0.94); font-size: 18px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; } .header_linkbutton_mail { display: block; width: 31px; height: auto; margin-bottom: 11px; } .header_linkbutton_text { display: block; } .header_recruit { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 181px; height: 100%; color: #fff; background: #e07a3f; font-size: 18px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; } .header_linkbutton_recruit { display: block; width: 31px; height: auto; margin-bottom: 8px; filter: brightness(0) invert(1); } .header_nav_link:visited, .header_nav_link:focus { color: #fff; } .header_nav_link:hover, .header_nav_link:active { color: var(--blue44a1c4); } .header.is-scrolled .header_nav_link:hover, .header.is-scrolled .header_nav_link:active { color: #1b3e7f; } .header_contact:visited, .header_contact:focus { color: #1b3e7f; } .header_contact:hover, .header_contact:active { color: var(--blue44a1c4); } .header_recruit:visited, .header_recruit:focus { color: #fff; } .header_recruit:hover, .header_recruit:active { color: #1b3e7f; } .mainview_wrapper { position: relative; } .mainview_image { position: relative; width: 100%; height: auto; } .mainview_text { position: absolute; z-index: 4; top: 53.2%; left: 8.8%; transform: translateY(-50%); color: #fff; } .mainview_titlesub { font-size: clamp(96px, 6.2vw, 120px); letter-spacing: 0.06em; line-height: 1; font-weight: 400; margin-bottom: 24px; } .mainview_title { font-size: clamp(38px, 2.5vw, 48px); letter-spacing: 0.06em; line-height: 1; font-weight: 700; } .footer_contact { position: relative; min-height: 1100px; padding: 220px 0 220px; overflow: hidden; background: url("../images/largetext_contact.webp") center top 64px / 44% no-repeat, url("../images/bg_contact.webp") center bottom / contain no-repeat, #f5f5f5; } .footer_contact .container1200 { width: 90%; max-width: 1200px; margin: 0 auto; } .footer_contact_body { position: relative; z-index: 1; min-height: 663px; padding: 96px 80px 96px; border-radius: 8px; background: #fff; box-shadow: 0 12px 18px rgba(34, 50, 74, 0.28); text-align: center; } .footer_contact_titlesub { margin-bottom: 24px; color: #44a1c4; font-size: 42px; font-weight: 400; line-height: 1; letter-spacing: 0.12em; } .footer_contact_title { color: #1b3e7f; font-size: 42px; font-weight: 700; line-height: 1.25; letter-spacing: 0.08em; } .footer_contact_text { margin-top: 30px; color: #10192f; font-size: 24px; line-height: 1.65; letter-spacing: 0.08em; } .footer_contact_link { display: flex; justify-content: center; align-items: stretch; margin-top: 58px; } .footer_contact_telephone { width: max-content; padding-right: 50px; text-align: left; } .footer_contact_mail { width: max-content; padding-left: 50px; border-left: 1px solid #2b479b; text-align: left; } .footer_contact_link_title { margin-bottom: 28px; color: #44a1c4; font-size: 25px; font-weight: 700; line-height: 1.2; letter-spacing: 0.08em; text-align: center; } .footer_contact_phone, .footer_contact_mobile { display: flex; align-items: center; color: #1b3e7f; font-weight: 700; line-height: 1; letter-spacing: 0.08em } .footer_contact_mobile { margin-top: 22px; } .footer_contact_phone::before { content: ""; display: block; width: 16px; height: 21px; margin-right: 13px; background: url("../images/phone.svg") center / contain no-repeat; } .footer_contact_mobile::before { content: ""; display: block; width: 15px; height: 28px; margin-right: 13px; background: url("../images/mobile.svg") center / contain no-repeat; } .footer_contact_phone_heads { margin-right: 17px; font-size: 28px; font-weight: 700; letter-spacing: 0.22em; } .footer_contact_number { font-size: 43px; font-weight: 600; letter-spacing: 0.02em; } .footer_contact_mail_button { display: flex; align-items: center; justify-content: center; width: 412px; max-width: 100%; height: 110px; margin: 39px auto 0; border-radius: 4px; color: #fff; background: #1b3e7f; font-size: 31px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; } .footer_contact_mail_button:visited, .footer_contact_mail_button:focus { color: #fff; } .footer_contact_mail_button:hover, .footer_contact_mail_button:active { color: var(--blue44a1c4); } .footer_contact_mail_button::before { content: ""; display: block; width: 42px; height: 32px; margin-right: 18px; background: url("../images/mail_white.svg") center / contain no-repeat; } .footer { padding-bottom: 80px; } .footer::before { content: ""; display: block; width: 100%; height: 34px; background: url("../images/footer_line.webp") center / cover no-repeat; } .footer_contact_phone_heads.letter001em { letter-spacing: 0.01em; } .footer_wrapper { display: flex; justify-content: space-between; align-items: flex-start; min-height: 319px; padding-top: 80px; } .footer_body { line-height: 1.35; font-size: 20px; font-weight: 700; } .footer_logo { width: 340px; margin-bottom: 26px; } .footer_nav { display: flex; align-items: center; gap: 0; margin-top: 101px; } .footer_nav_link { display: inline-flex; align-items: center; min-height: 22px; padding: 0 27px; border-left: 1px solid #363636; line-height: 1; font-size: 20px; font-weight: 700; white-space: nowrap; } .footer_nav_link:first-child { padding-left: 0; border-left: none; } .footer_nav_link:last-child { padding-right: 0; } /*** index ***/ .top_mainview { position: relative; overflow: hidden; } .top_mainview_wrapper { min-height: 700px; overflow: hidden; background: #173f72; } .top_mainview_wrapper::after { content: "Scroll"; position: absolute; right: 30px; bottom: 82px; z-index: 3; display: flex; align-items: center; column-gap: 18px; color: #fff; font-size: 16px; font-weight: 400; line-height: 1; letter-spacing: 0.1em; writing-mode: vertical-rl; } .flexslider { height: 700px; } .slides { height: 100%; } .flexslider .slides > li { height: 700px; } .flexslider .slides img { width: 100%; height: 100%; object-fit: cover; } .top_mainview::after { content: ""; position: absolute; right: 36px; bottom: 0; z-index: 3; width: 1px; height: 70px; background: rgba(255, 255, 255, 0.9); } .top_mainview_title { position: absolute; left: 100px; bottom: 82px; z-index: 3; color: #fff; font-size: 76px; font-weight: 700; line-height: 1.38; letter-spacing: 0.12em; } .top_mainview_titlebox { margin: 0; } .top_mainview_whitebox { display: inline-block; margin-right: 8px; padding: 0 14px 4px; border-radius: 4px; color: #1b3e7f; background: #fff; line-height: 1.18; } .top_about { position: relative; overflow: hidden; padding: 140px 0 140px; background: url("../images/largetext_about.webp") left top 7.9vw / 156px auto no-repeat, #fff; } .top_about::after { content: ""; position: absolute; left: 0; bottom: 0; z-index: 0; width: 192px; height: 76px; background: url("../images/top_arch_01.webp") left bottom / contain no-repeat; } .top_about_wrapper { position: relative; z-index: 1; --top-about-left-space: clamp(80px, calc(100vw - 1200px), 360px); --top-about-image-space: clamp(54px, 4.16vw, 80px); display: flex; align-items: flex-start; justify-content: flex-end; width: 100%; max-width: none; margin: 0; } .top_about_wrapper::before { content: ""; flex: 0 1 var(--top-about-left-space); min-width: 0; height: 1px; } .top_about_body { flex: 1 1 852px; min-width: 0; color: #10192f; } .top_about_titlesub { margin-bottom: 5px; color: #44a1c4; font-family: "Oswald", sans-serif; font-size: 42px; font-weight: 400; } .top_about_title { color: #1b3e7f; font-size: 45px; font-weight: 700; } .top_about_strong { margin-top:20px; color: #1b3e7f; font-size: 24px; font-weight: 700; line-height: 1.35; letter-spacing: 0.08em; } .top_about_text { margin-top: 22px; font-size: 17px; font-weight: 700; line-height: 1.65; letter-spacing: 0.08em; } .top_about_text + .top_about_text { margin-top: 25px; } .top_about_linkbutton { position: relative; display: flex; align-items: center; justify-content: center; width: 500px; max-width: 100%; height: 78px; margin-top: 54px; border-radius: 4px; color: #fff; background: #1b3d7e; font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; } .top_about_linkbutton:visited, .top_about_linkbutton:focus { color: #fff; } .top_about_linkbutton:hover, .top_about_linkbutton:active { color: #45a8cb; } .top_about_linkbutton::after { content: ""; position: absolute; top: 50%; right: 36px; width: 18px; height: 18px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: translateY(-50%) rotate(45deg); } .top_about_image { flex: 0 1 862px; min-width: 431px; max-width: 862px; margin-left: var(--top-about-image-space); overflow: hidden; } .top_about_image img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; } .top_reasons { position: relative; overflow: hidden; padding: 130px 0 130px; background: url("../images/largetext_reasons.webp") right -8px top 7.9vw / 156px auto no-repeat, #1b3e7f; } .top_reasons_wrapper { position: relative; z-index: 1; width: 90%; max-width: 1200px; margin-left: auto; margin-right: auto; text-align: center; } .top_reasons_titlesub { color: #fff; font-family: "Oswald", sans-serif; font-size: 40px; font-weight: 400; } .top_reasons_title { margin-top: 4px; color: #fff; font-size: clamp(40px, 2.34vw, 48px); font-weight: 700; } .top_reasons_list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 24px; margin-top: 32px; } .top_reasons_listitem { padding: 27px 26px 38px; border-radius: 8px; background: #fff; box-shadow: 8px 10px 14px rgba(13, 35, 72, 0.34); text-align: left; } .top_reasons_listitem_number { color: #1b3e7f; font-family: "din2014", sans-serif; font-size: 60px; font-weight: 600; line-height: 1; } .top_reasons_listitem_image { display: flex; align-items: center; justify-content: center; height: 134px; margin-top: 36px; } .top_reasons_listitem_image .blockimage { width: auto; max-width: 172px; max-height: 112px; } .top_reasons_listitem_title { margin-top: 31px; padding-bottom: 8px; border-bottom: 2px solid #44a1c4; color: #44a1c4; font-size: 24px; font-weight: 700; text-align: center; } .top_reasons_listitem_text { margin-top: 15px; font-size: 18px; font-weight: 500; line-height: 1.6; } .top_company { position: relative; min-height: 760px; padding: 220px 0 100px; overflow: hidden; background: url("../images/largetext_company.webp") left -18px top 2vw / 156px auto no-repeat, url("../images/top_blur.webp") right center / auto 100% no-repeat, #fff; } .top_company::after { content: ""; position: absolute; right: 0; top: 0; z-index: 0; width: 192px; height: 76px; background: url("../images/top_arch_02.webp") right top / contain no-repeat; } .top_company_wrapper { position: relative; z-index: 1; display: flex; justify-content: center; gap: 20px; min-height: 544px; padding: 50px; } .top_company_body { position: relative; z-index: 2; flex: 0 1 618px; } .top_company_titlesub { color: #44a1c4; font-family: "Oswald", sans-serif; font-size: clamp(36px, 2vw, 40px); font-weight: 400; line-height: 1; margin-bottom: 20px; } .top_company_title { color: #1b3e7f; font-size: clamp(40px, 2.34vw, 48px); font-weight: 700; margin-bottom: 24px; } .top_company_text { margin-bottom: 40px; font-size: 18px; font-weight: 500; } .top_company_button { position: relative; display: flex; align-items: center; justify-content: center; max-width: 500px; width: 100%; height: 78px; border-radius: 4px; color: #fff; background: #1b3e7f; font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: 0.06em; } .top_company_button:visited, .top_company_button:focus { color: #fff; } .top_company_button:hover, .top_company_button:active { color: #44a1c4; } .top_company_button::after { content: ""; position: absolute; top: 50%; right: 36px; width: 18px; height: 18px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: translateY(-50%) rotate(45deg); } .top_company_image { position: relative; z-index: 1; flex: 0 1 664px; width: 51%; min-width: 332px; pointer-events: none; } .top_recruit { position: relative; overflow: hidden; background: url("../images/largetext_recruit.webp") right -20px top 8.8vw / 156px auto no-repeat, url("../images/top_recruit_01.webp") left center / auto 100% no-repeat, url("../images/top_recruit_bg.webp") center top / cover no-repeat, #fff; } .top_recruit_wrapper { position: relative; width: 100%; max-width: none; height: 100%; margin: 0; padding: min(11.6vw, 224px) 0 min(12.7vw, 244px); } .top_recruit_body { margin-left: 52.7%; width: fit-content; max-width: 556px; padding: min(4.9vw, 95px) min(1vw, 20px) min(10.2vw, 196px) min(2.2vw, 44px); color: #fff; background: url("../images/top_recruit_logo.svg") center / contain no-repeat; } .top_recruit_titlesub { color: #fff; font-family: "Oswald", sans-serif; font-size: clamp(34px, 2.08vw, 40px); font-weight: 400; line-height: 1; letter-spacing: 0.06em; } .top_recruit_title { margin-top: 12px; color: #fff; font-size: clamp(38px, 2.34vw, 45px); font-weight: 700; letter-spacing: 0.06em; } .top_recruit_text { margin-top: 24px; color: #fff; font-size: 18px; } .top_recruit_button { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 112px; margin-top: 44px; border-radius: 4px; color: #1b3e7f; background: #fff; font-size: 24px; font-weight: 700; line-height: 1; } .top_recruit_button:visited, .top_recruit_button:focus { color: #1b3e7f; } .top_recruit_button:hover, .top_recruit_button:active { color: #44a1c4; } .top_recruit_button::after { content: ""; position: absolute; top: 50%; right: 36px; width: 18px; height: 18px; border-top: 3px solid #1b3e7f; border-right: 3px solid #1b3e7f; transform: translateY(-50%) rotate(45deg); } /*** about ***/ .about_01 { position: relative; overflow: hidden; padding: calc(6vw - 1px) 0 10vw; background: url("../images/about_bg_01.webp") right top / 89% 6vw no-repeat, url("../images/about_bg_03.webp") left bottom / 89% 10vw no-repeat; } .about_02 { position: relative; overflow: hidden; padding: 0 0 10vw; background: url("../images/about_bg_05.webp") right bottom / 89% 10vw no-repeat; } .about_03 { position: relative; overflow: hidden; padding-bottom: 76px; } .about_01_wrapper, .about_02_wrapper, .about_03_wrapper { position: relative; z-index: 1; --about-left-space: clamp(80px, calc(100vw - 1200px), 360px); --about-image-space: clamp(50px, 5.2vw, 100px); display: flex; align-items: flex-start; justify-content: flex-end; width: 100%; max-width: none; margin: 0; padding-bottom: 60px; } .about_01_wrapper, .about_03_wrapper { background: url("../images/bg_logo.svg") left 4.2% top 5.3vw / 24.3% auto no-repeat; } .about_02_wrapper { flex-direction: row-reverse; background: url("../images/bg_logo.svg") right 4.2% top 5.3vw / 24.3% auto no-repeat; } .about_01_wrapper::before, .about_02_wrapper::before, .about_03_wrapper::before { content: ""; flex: 0 1 var(--about-left-space); min-width: 0; height: 1px; } .about_body { flex: 1 1 603px; min-width: 0; color: #10192f; padding-top: clamp(100px, 6.4vw, 124px); } .about_title { display: flex; align-items: flex-end; gap: 24px; border-left: 16px solid #43b4d9; } .about_title_head { color: #44a1c4; } .about_title_titlesub { margin-bottom: 15px; font-family: "Oswald", sans-serif; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; padding-left: 22px; line-height: 1; } .about_title_number { font-size: clamp(72px, 4.7vw, 90px); font-weight: 600; padding-left: 35px; line-height: 1; } .about_title_body { color: #1b3e7f; font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; } .about_paragraph { margin-top: 24px; } .about_image { flex: 0 1 862px; min-width: 431px; max-width: 862px; margin-left: var(--about-image-space); overflow: hidden; } .about_image img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; } .about_02 .about_image { margin-left: auto; margin-right: var(--about-image-space); } /*** recruit ***/ .recruit_message { background-color: #f3f3f3; padding-top: 70px; } .recruit_message_wrapper { width: 92%; height: auto; max-width: 1784px; padding: 7.3vw 40px 9.4vw; border-radius: 10px; margin-left: auto; margin-right: auto; background: url("../images/recruit_message.webp") center / contain no-repeat; } .recruit_message_titlesub { font-family: "Oswald", sans-serif; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; line-height: 1; text-align: center; color: #fff; } .recruit_message_title { margin-top: 20px; color: #fff; font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; line-height: 1; text-align: center; } .recruit_message_text { color: #fff; font-weight: 500; margin-top: 28px; max-width: 1200px; margin-right: auto; margin-left: auto; } .recruit_flow { position: relative; overflow: hidden; padding-top: 140px; background: url("../images/largetext_flow.webp") center top 140px / 24.5% auto no-repeat, url("../images/largetext_contactbyphone.webp") center bottom / 96% auto no-repeat, #f3f3f3; } .recruit_flow_wrapper { position: relative; z-index: 1; padding: 80px 0 160px; } .recruit_flow_titlesub { color: #44a1c4; font-family: "Oswald", sans-serif; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; line-height: 1; text-align: center; } .recruit_flow_title { margin-top: 20px; color: #1b3d7e; font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; line-height: 1; text-align: center; } .recruit_flow_list { margin-top: 80px; } .recruit_flow_listitem { position: relative; display: grid; grid-template-columns: 216px minmax(0, 1fr); align-items: center; gap: 80px; min-height: 126px; padding-bottom: 64px; margin-bottom: 60px; } .recruit_flow_listitem::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 26px; background: url("../images/recruit_flow_line.webp") center / 100% auto no-repeat; } .recruit_flow_listitem:last-child { padding-bottom: 0; margin-bottom: 0; } .recruit_flow_listitem:last-child::after { display: none; } .recruit_flow_listitem_icon { width: 216px; } .recruit_flow_listitem_body { min-width: 0; } .recruit_flow_listitem_title { color: #44a1c4; font-size: 24px; font-weight: 700; line-height: 1.3; } .recruit_flow_listitem_text { margin-top: 16px; color: #002465; font-weight: 500; line-height: 1.65; } .recruit_flow_infomation { margin-top: 130px; padding: 96px 80px 92px; border-radius: 10px; color: #fff; background: #1b3e7f; text-align: center; box-shadow: 0 12px 18px rgba(34, 50, 74, 0.28); border-radius: 10px; } .recruit_flow_infomation_body { padding-bottom: 46px; } .recruit_flow_infomation_title { font-size: clamp(43px, 2.5vw, 48px); font-weight: 700; line-height: 1.35; } .recruit_flow_infomation_opening { margin-top: 4px; font-size: 26px; font-weight: 700; line-height: 1.35; } .recruit_flow_infomation_phone { display: flex; align-items: baseline; justify-content: center; margin-top: 40px; font-size: 40px; font-weight: 700; line-height: 1; } .recruit_flow_infomation_phone::before { content: ""; display: block; width: 24px; height: 46px; margin-right: 18px; background: url(../images/mobile_white.svg) center / 100% auto no-repeat; position: relative; top: 4px; } .recruit_flow_infomation_number { font-size: clamp(52px, 3vw, 58px); font-weight: 600; letter-spacing: 0.03em; } .recruit_flow_infomation_pic { font-size: 30px; } .recruit_flow_infomation_text { margin-top: 28px; font-size: 24px; line-height: 1.55; } .recruit_flow_infomation_greeting { padding-top: 46px; border-top: 1px solid rgba(255, 255, 255, 0.95); font-size: clamp(36px, 2.1vw, 40px); font-weight: 700; line-height: 1.5; } .recruit_requirements { position: relative; overflow: hidden; padding: 130px 0 130px; } #recruit_staff { background: url("../images/largetext_requirement01.webp") left -4px top 4.3vw / 156px auto no-repeat; } #recruit_assistant { background: url("../images/largetext_requirement02.webp") right -4px top / 156px auto no-repeat; } .recruit_requirements_wrapper { position: relative; z-index: 1; } .recruit_requirements_titlesub { color: #44a1c4; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; line-height: 1; text-align: center; } .recruit_requirements_title { margin-top: 20px; color: #1b3e7f; font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; line-height: 1; text-align: center; } .recruit_requirements_category { margin-top: 64px; padding: 84px 84px 96px; border-radius: 10px; background: #e3f3f8; text-align: center; } .recruit_requirements_category_title { color: #1b3e7f; font-size: clamp(32px, 2.1vw, 40px); font-weight: 700; line-height: 1.3; } .recruit_requirements_category_list { display: grid; grid-template-columns: repeat(2, minmax(0, 500px)); justify-content: center; gap: 36px; margin-top: 40px; } .recruit_requirements_category_button { position: relative; display: flex; align-items: center; justify-content: center; min-height: 80px; padding: 0 64px 0 32px; border-radius: 5px; color: #fff; background: #1b3d7e; font-size: 24px; font-weight: 700; line-height: 1.35; text-align: center; } .recruit_requirements_category_button:visited, .recruit_requirements_category_button:focus { color: #fff; } .recruit_requirements_category_button:hover, .recruit_requirements_category_button:active { color: #44a1c4; } .recruit_requirements_category_button::after { content: ""; position: absolute; top: 50%; right: 32px; width: 14px; height: 14px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: translateY(-50%) rotate(45deg); } .recruit_requirements_list { margin-top: 80px; } .recruit_requirements_list + .recruit_requirements_list { margin-top: 130px; } .recruit_requirements_list_title { display: flex; align-items: center; color: #1b3e7f; font-size: clamp(32px, 2.1vw, 40px); font-weight: 700; line-height: 1.3; } .recruit_requirements_list_title::before { content: ""; display: block; flex: 0 0 auto; width: 14px; height: 63px; margin-right: 28px; background: #44a1c4; } .recruit_requirements_listitem { display: flex; align-items: stretch; border-bottom: 1px solid #e9e9e9; } .recruit_requirements_listitem:first-of-type { margin-top: 60px; border-top: 1px solid #e9e9e9; } .recruit_requirements_listitem_title { flex: 0 0 26%; padding: 30px 24px 30px 10px; font-size: 26px; color: #10142c; font-weight: 700; line-height: 1.4; } .recruit_requirements_listitem_text { flex: 1 1 auto; padding: 30px 20px 30px 0; color: #10142c; font-size: inherit; font-weight: 500; line-height: 1.55; } .recruit_requirements_entry { margin-top: 82px; text-align: center; } .recruit_requirements_entry_button { position: relative; display: flex; align-items: center; justify-content: center; width: 500px; max-width: 100%; min-height: 78px; margin-left: auto; margin-right: auto; padding: 0 64px; border-radius: 5px; color: #fff; background: #e07a3f; font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; } .recruit_requirements_entry_button:visited, .recruit_requirements_entry_button:focus { color: #fff; } .recruit_requirements_entry_button:hover, .recruit_requirements_entry_button:active { color: #1b3e7f; } .recruit_requirements_entry_button::after { content: ""; position: absolute; top: 50%; right: 36px; width: 16px; height: 16px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: translateY(-50%) rotate(45deg); } /*** company ***/ .company_message { position: relative; padding-block: 130px; background: url("../images/largetext_message.webp") left -12px top 28px / 156px auto no-repeat; } .company_message::after { content: ""; position: absolute; left: 0; bottom: 0; z-index: 0; width: 192px; height: 76px; background: url("../images/top_arch_01.webp") left bottom / contain no-repeat; } .company_message_titlesub { margin-bottom: 10px; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; color: #44a1c4; } .company_message_title { font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; color: #1b3e7f; margin-bottom: 32px; } .company_message_paragraph { margin-top: 24px; } .company_message_sign { margin-top: 56px; font-weight: 700; width: fit-content; margin-right: 0; margin-left: auto; } .company_message_sign_company { font-size: 28px; letter-spacing: 0.08em; width: fit-content; } .company_message_sign_name { margin-top: 16px; width: fit-content; display: flex; align-items: center; } .company_message_sign_position { font-size: 24px; } .company_message_sign_ceo { margin-left: 16px; } .company_profile { padding-block: 130px; background: url("../images/largetext_profile.webp") right -12px top 14.5vw / 156px auto no-repeat, url("../images/company_profile_bg.webp") left top / contain no-repeat, #1b3e7f; } .company_profile_titlesub { font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; color: #fff; text-align: center; } .company_profile_title { font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; color: #fff; text-align: center; margin-top: 4px; } .company_profile_list { margin-top: 40px; border-top: 1px solid #fff; } .company_profile_listitem { color: #fff; border-bottom: 1px solid #fff; display: flex; } .company_profile_listitem_title { width: 20%; padding: 20px 20px 20px 10px; font-weight: 500; } .company_profile_listitem_body { padding: 20px; } .company_access { padding-top: 130px; position: relative; } .company_access::after { content: ""; position: absolute; right: 0; top: 0; z-index: 0; width: 192px; height: 76px; background: url("../images/top_arch_02.webp") right top / contain no-repeat; } .company_access_wrapper { padding-top: 48px; background: url("../images/largetext_contact.webp") center top / 44.6% no-repeat; } .company_access_body { margin-bottom: 30px; text-align: center; } .company_access_titlesub { font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; color: #44a1c4; margin-bottom: 4px; } .company_access_title { font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; color: #1b3e7f; margin-bottom: 12px; } .company_access_adress { font-size: 28px; color: #1b3e7f; font-weight: 500; } .company_access_map { aspect-ratio: 1920 / 786 ; width: 100%; } .company_access_map iframe { display: block; width: 100%; height: 100%; border: 0; } /*** privacy ***/ .privacy_list { padding-block: 130px; } .privacy_list_wrapper { } .privacy_list_head { margin-bottom: 80px; font-weight: 700; } .privacy_list_body { border-top: 1px solid #d4d4d4; } .privacy_list_item { padding: 40px 0; border-bottom: 1px solid #d4d4d4; } .privacy_list_item_head { font-size: 26px; font-weight: 700; color: #1b3e7f; margin-bottom: 28px; } .privacy_list_item_number { margin-right: 28px; } .privacy_list_item_text { font-weight: 700; } /*** contact ***/ .contact_intro { position: relative; overflow: hidden; padding-block: 80px 140px; background: url(../images/largetext_contactbyphone.webp) center bottom / 96% auto no-repeat, #f3f3f3; } .contact_intro_wrapper { padding: 68px 120px 40px; border-radius: 10px; color: #fff; background: #1b3e7f; text-align: center; box-shadow: 0 12px 18px rgba(34, 50, 74, 0.28); border-radius: 10px; } .contact_phone { display: flex; justify-content: center; align-items: center; gap: 36px; margin-top: 36px; } .contact_phone_tel, .contact_phone_mobile { display: flex; align-items: center; justify-content: center; font-size: 30px; font-weight: 700; line-height: 1; } .contact_phone_number { font-size: clamp(43px, 2.5vw, 48px); font-weight: 600; letter-spacing: 0.03em; margin-left: 16px; } .contact_phone_tel::before { content: ""; display: block; width: 16px; height: 21px; margin-right: 12px; background: url(../images/tel_white.svg) center / 100% auto no-repeat; } .contact_phone_mobile::before { content: ""; display: block; width: 15px; height: 28px; margin-right: 12px; background: url(../images/mobile_white.svg) center / 100% auto no-repeat; } .contact_intro_text { margin-top: 32px; padding-top: 30px; font-size: 18px; line-height: 2; border-top: 1px solid #ffffff; } .contact_body { padding-block: 130px 140px; } .contact_body_titlesub { color: #44a1c4; font-family: "Oswald", sans-serif; font-size: clamp(32px, 2.1vw, 40px); font-weight: 400; line-height: 1; text-align: center; } .contact_body_title { margin-top: 20px; color: #1b3d7e; font-size: clamp(38px, 2.5vw, 48px); font-weight: 700; line-height: 1; text-align: center; margin-bottom: 68px; } .wpcf7-form-control.wpcf7-text { font-size: 18px; line-height: 1.8; font-weight: 500; padding: 8px 20px; border: 1px solid #97bbd4; background-color: #f4f4f4; width: 100%; } .wpcf7-form-control.wpcf7-textarea { font-size: 18px; line-height: 1.8; font-weight: 500; padding: 8px 20px; border: 1px solid #97bbd4; background-color: #f4f4f4; width: 100%; } .wpcf7-form-control.wpcf7-text:focus, .wpcf7-form-control.wpcf7-textarea:focus, .wpcf7-form-control.wpcf7-text:focus-visible, .wpcf7-form-control.wpcf7-textarea:focus-visible { outline: none; } .contact_mailform_submit { margin-top: 40px; width: fit-content; position: relative; margin-left: auto; margin-right: auto; } .contact_mailform_submitbutton { position: relative; z-index: 5; display: flex; align-items: center; justify-content: center; width: 500px; max-width: 100%; height: 78px; border-radius: 4px; background-color: transparent; color: #fff; font-size: 24px; font-weight: 700; line-height: 1; letter-spacing: 0.08em; transition: 300ms ease; } .contact_mailform_submit::before { content: ""; position: absolute; display: block; z-index: 2; background: #1b3d7e; border-radius: 4px; top: 0; left: 0; width: 100%; height: 100%; } .contact_mailform_submit::after { content: ""; display: block; position: absolute; z-index: 3; top: 50%; right: 36px; width: 18px; height: 18px; border-top: 3px solid #fff; border-right: 3px solid #fff; transform: translateY(-50%) rotate(45deg); } .contact_mailform_submitbutton:hover, .contact_mailform_submitbutton:active, .contact_mailform_submitbutton:focus { color: #44a1c4; } .contact_form0 { border-top: 1px solid #eeeeee; } .contact_mailform_listitem { display: flex; gap: 30px; justify-content: space-between; align-items: center; border-bottom: 1px solid #eeeeee; padding: 40px 15px 40px 12px; } .contact_mailform_listitem_title { width: 32%; display: flex; justify-content: space-between; align-items: center; font-size: 26px; font-weight: 700; } .contact_mailform_listitem_address .wpcf7-form-control-wrap { display: block; margin-top: 15px; } .contact_mailform_listitem_address .wpcf7-form-control-wrap:first-of-type { margin-top: none; } .contact_mailform_listitem_reqiredtag { display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; line-height: 1; height: 32px; padding: 5px 8px; border-radius: 5px; width: fit-content; background-color: #e03f5d; } .contact_mailform_listitem_inputs { width: 65%; } .wpcf7-form-control.wpcf7-radio { display: flex; flex-direction: column; gap: 20px; } .wpcf7-list-item label { display: flex; align-items: center; cursor: pointer; position: relative; } .label_flex .wpcf7-form-control { display: flex; flex-wrap: wrap; grid-row-gap: 20px; } .label_flex label { cursor: pointer; } .wpcf7-form-control.wpcf7-radio input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; } .wpcf7-form-control.wpcf7-radio .wpcf7-list-item-label { position: relative; display: inline-flex; align-items: center; } .wpcf7-form-control.wpcf7-radio .wpcf7-list-item-label::before { content: ""; display: inline-block; width: 30px; height: 30px; flex: 0 0 30px; margin-right: 20px; border: 1px solid #97bbd4; background: #f4f4f4; box-sizing: border-box; } .wpcf7-form-control.wpcf7-radio .wpcf7-list-item-label::after { content: ""; position: absolute; top: 50%; left: 15px; width: 13px; height: 13px; background: #1b3e7f; transform: translate(-50%, -50%) scale(0); } .wpcf7-form-control.wpcf7-radio input[type="radio"]:checked + .wpcf7-list-item-label::after { transform: translate(-50%, -50%) scale(1); } .wpcf7-form-control.wpcf7-radio input[type="radio"]:focus-visible + .wpcf7-list-item-label::before { outline: 2px solid #1b3e7f; outline-offset: 3px; } .privacy_wrap .wpcf7-form-control-wrap { display: block; } .privacy_wrap .wpcf7-acceptance { display: block; margin: 0; } .privacy_wrap .wpcf7-list-item { display: block; margin: 0; display: flex; justify-content: center; } .privacy_wrap .wpcf7-list-item label { display: inline-flex; align-items: center; gap: 18px; cursor: pointer; position: relative; } .privacy_wrap .wpcf7-list-item input[type="checkbox"] { position: absolute; opacity: 0; pointer-events: none; } .privacy_wrap .wpcf7-list-item-label { position: relative; display: inline-flex; align-items: center; font-size: 20px; line-height: 1.6; font-weight: 700; } .privacy_wrap .wpcf7-list-item-label::before { content: ""; display: inline-block; width: 32px; height: 32px; flex: 0 0 32px; margin-right: 18px; border: 1px solid #97bbd4; background: #f4f4f4; box-sizing: border-box; vertical-align: middle; transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease; } .privacy_wrap .wpcf7-list-item-label::after { content: ""; position: absolute; left: 15px; top: 50%; width: 10px; height: 18px; border-right: 4px solid #44a1c4; border-bottom: 4px solid #44a1c4; transform: translate(-50%, -58%) rotate(45deg) scale(0); transform-origin: center; box-sizing: border-box; transition: transform 0.2s ease; } .privacy_wrap .wpcf7-list-item input[type="checkbox"]:checked + .wpcf7-list-item-label::after { transform: translate(-50%, -58%) rotate(45deg) scale(1); } .privacy_wrap .wpcf7-list-item input[type="checkbox"]:focus-visible + .wpcf7-list-item-label::before { outline: 2px solid #1b3e7f; outline-offset: 3px; } .privacy_wrap .wpcf7-not-valid-tip { margin-top: 8px; font-size: 14px; color: #e03f5d; } .wpcf7-form input::placeholder, .wpcf7-form textarea::placeholder { color: #b2b2b2; } .privacy_check_title { font-size: 26px; font-weight: 700; text-align: center; margin-top: 42px; margin-bottom: 16px; } .privacy_check_title_link, .privacy_check_title_link:visited, .privacy_check_title_link:focus, .privacy_check_title_link:focus-visible { color: #1ba5d8; text-decoration: underline; } .privacy_check_title_link:hover, .privacy_check_title_link:active { color: #e07a3f; text-decoration: underline; } .wpcf7-not-valid-tip { margin-top: 5px; } /* PC用 ------------------------------------------------------------*/ @media only screen and (max-width: 1400px) { } @media only screen and (min-width: 1025px) and (max-width: 1200px) { .footer_wrapper { justify-content: center; gap: clamp(48px, 6vw, 80px); } .footer_nav { display: grid; grid-template-columns: repeat(3, max-content); row-gap: 18px; margin-top: 86px; } .footer_nav_link:nth-child(3n+1) { padding-left: 0; border-left: none; } .footer_nav_link:nth-child(3n) { padding-right: 0; } } @media only screen and (max-width: 1024px) { /*** common ***/ html { scroll-padding-top: 108px; } .header { height: 108px; } .header_wrapper { padding-left: 5%; } .headermenu { display: none; } .mainview_text { top: auto; bottom: calc(50% - 54px); transform: translateY(50%); display: flex; gap: 20px; align-items: flex-end; } .mainview_titlesub { font-size: 76px; margin-bottom: 0; } .mainview_titlesub.mainview_titlesub_privacy { font-size: 48px; line-height: 1.15; } .mainview_title.mainview_title_privacy { font-size: 28px; line-height: 1.15; } .mainview_title { font-size: 32px; } .footer_contact { min-height: auto; padding: 140px 0; } .footer_contact_body { min-height: auto; padding: 80px 56px; } .footer_contact_link { display: block; margin-top: 48px; } .footer_contact_telephone, .footer_contact_mail { width: 100%; max-width: 560px; margin: 0 auto; padding: 0; } .footer_contact_mail { margin-top: 48px; padding-top: 48px; border-left: none; border-top: 1px solid #2b479b; } .footer_contact_phone, .footer_contact_mobile { justify-content: center; } .footer_wrapper { display: block; min-height: auto; padding-top: 60px; } .footer_nav { flex-wrap: wrap; margin-top: 42px; row-gap: 18px; } .footer_nav_link { font-size: 18px; } /*** index ***/ .top_mainview_wrapper, .flexslider, .flexslider .slides > li { height: 620px; min-height: 620px; } .top_mainview_title { left: 5%; bottom: 70px; font-size: 58px; } .top_about { padding-block: 80px; background: url("../images/largetext_about.webp") left -18px top 3.6vw / 120px auto no-repeat, #fff; } .top_about::after { width: 170px; height: 70px; } .top_about_wrapper { display: block; } .top_about_wrapper::before { display: none; } .top_about_body { flex: none; width: 90%; min-width: 0; max-width: 720px; margin: 0 auto; padding: 0; } .top_about_image { width: 90%; height: 430px; margin: 52px 0 0 auto; } .top_about_linkbutton { margin-top: 40px; margin-left: auto; margin-right: auto; width: 100%; } .top_reasons { padding: 80px 0 80px; background: url("../images/largetext_reasons.webp") right -22px top 6.4vw / 120px auto no-repeat, #1b3e7f; } .top_reasons_list { grid-template-columns: minmax(0, 520px); justify-content: center; gap: 24px; } .top_reasons_listitem { padding: 24px 22px 32px; } .top_reasons_listitem_number { font-size: 50px; } .top_reasons_listitem_image { height: 116px; } .top_reasons_listitem_title { font-size: 21px; } .top_reasons_listitem_text { font-size: 16px; } .top_company { position: relative; min-height: 0; padding: 120px 0 80px; background: url("../images/largetext_company.webp") left -18px top 2vw / 120px auto no-repeat, url("../images/top_blur.webp") right center / auto 100% no-repeat, #fff; } .top_company_wrapper { gap: 30px; padding: 0 20px; min-height: 0; } .top_recruit { background: url("../images/largetext_recruit.webp") right -20px top 1.6vw / 120px auto no-repeat, url("../images/top_recruit_bg.webp") center top / cover no-repeat, #fff; } .top_recruit_wrapper { padding: 80px 0; } .top_recruit_body { margin-left: auto; margin-right: auto; width: 68%; max-width: 1024px; padding: 0 5%; background: url("../images/top_recruit_logo.svg") center / contain no-repeat; } .top_recruit_button { width: 412px; margin-left: auto; margin-right: auto; } /*** about ***/ .about_01_wrapper, .about_02_wrapper, .about_03_wrapper { display: block; padding-bottom: 50px; } .about_body { flex: none; width: 90%; min-width: 0; max-width: 720px; margin: 0 auto; padding: 50px 0 0; } .about_image { width: 90%; height: 430px; margin: 48px 0 0 auto; } .about_02 .about_image { margin: 48px auto 0 0; } .about_01_wrapper, .about_03_wrapper { background: url("../images/bg_logo.svg") right 4.2% top 5.3vw / 24.3% auto no-repeat; } .about_03 { padding-bottom: 20px; } /*** recruit ***/ .recruit_message { padding-top: 60px; } .recruit_message_wrapper { width: 90%; padding: 60px 30px 68px; background: url("../images/recruit_message.webp") center / cover no-repeat; } .recruit_message_text { margin-top: 28px; } .recruit_flow { padding-top: 80px; background: url("../images/largetext_flow.webp") center top 80px / 34.6% auto no-repeat, url("../images/largetext_contactbyphone.webp") center bottom / 96% auto no-repeat, #F3F3F1; } .recruit_flow_wrapper { padding: 60px 0 100px; } .recruit_flow_list { margin-top: 72px; } .recruit_flow_listitem { grid-template-columns: 190px minmax(0, 1fr); gap: 44px; padding-bottom: 50px; margin-bottom: 46px; } .recruit_flow_listitem_icon { width: 190px; } .recruit_flow_infomation { margin-top: 60px; padding: 40px 30px 40px; } .recruit_flow_infomation_title { font-size: 32px; } .recruit_flow_infomation_opening { font-size: 20px; } .recruit_flow_infomation_phone { font-size: 20px; } .recruit_flow_infomation_number { font-size: 40px; } .recruit_flow_infomation_pic { font-size: 18px; } .recruit_flow_infomation_phone::before { width: 18px; height: 34px; margin-right: 14px; } .recruit_flow_infomation_body { padding-bottom: 30px; } .recruit_flow_infomation_greeting { padding-top: 30px; font-size: 26px; } .recruit_flow_infomation_text { font-size: 16px; } .recruit_requirements { padding: 70px 0 60px; } .recruit_requirements_category { margin-top: 60px; padding: 56px 40px 64px; } .recruit_requirements_category_title { font-size: 30px; } .recruit_requirements_category_list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; } .recruit_requirements_category_button { min-height: 72px; padding: 0 30px 0 15px; font-size: 18px; } .recruit_requirements_category_button::after { right: 14px; } .recruit_requirements_list { margin-top: 70px; } #recruit_staff { background: url(../images/largetext_requirement01.webp) left -4px top 2.8vw / 120px auto no-repeat; } #recruit_assistant { background: url(../images/largetext_requirement02.webp) right -4px top / 120px auto no-repeat; } .recruit_requirements_list + .recruit_requirements_list { margin-top: 70px; } .recruit_requirements_listitem:first-of-type { margin-top: 40px; } .recruit_requirements_listitem_title { font-size: 22px; } .recruit_requirements_entry { margin-top: 60px; } /*** company ***/ .company_message { padding-block: 80px; background: url(../images/largetext_message.webp) left -12px top 28px / 120px auto no-repeat; } .company_message_sign { margin-top: 40px; } .company_message::after { width: 170px; height: 70px; } .company_profile { padding-block: 80px; background: url(../images/largetext_profile.webp) right -12px top 14.2vw / 120px auto no-repeat, url(../images/company_profile_bg.webp) left top / contain no-repeat, #1b3e7f; } .company_access::after { width: 170px; height: 70px; } .company_access { padding-top: 80px; } .company_access_map { aspect-ratio: 297 / 210; } /*** contact ***/ .contact_intro { padding-block: 60px 80px; } .contact_intro_wrapper { padding: 40px 40px 30px; } .contact_phone { flex-direction: column; gap: 16px; margin-top: 36px; } .contact_body { padding-block: 70px 80px; } .contact_body_title { margin-bottom: 48px; } .contact_mailform_listitem_title { width: 32%; font-size: 18px; } .contact_mailform_listitem_reqiredtag { font-size: 15px; padding: 4px 4px; flex-shrink: 0; } .contact_mailform_listitem_inputs { font-size: 16px; } .wpcf7-form-control.wpcf7-text { font-size: 16px; } .wpcf7-form-control.wpcf7-textarea { font-size: 16px; } .contact_mailform_listitem { padding: 30px 15px 30px 12px; } .privacy_check_title { font-size: 22px; margin-top: 30px; margin-bottom: 12px; } .privacy_wrap .wpcf7-list-item-label { font-size: 18px; } .contact_mailform_submit { margin-top: 30px; } .contact_mailform_submitbutton { width: 430px; height: 70px; font-size: 22px; } /*** privacy ***/ .privacy_list { padding-block: 70px; } .privacy_list_head { margin-bottom: 40px; } .privacy_list_item { padding: 30px 0; } .privacy_list_item_head { margin-bottom: 24px; } } @media only screen and (max-width: 768px) { @for $i from 30 through 70 { .flex_#{$i} { width: 100%; } } /*** common ***/ .mainview { height: 236px; } .mainview_wrapper { height: 100%; } .mainview_image { height: 100%; } .mainview_image img { width: 100%; height: 100%; object-fit: cover; object-position: center center; } .mainview_text { left: 5%; gap: 16px; } .mainview_titlesub { font-size: 60px; } .mainview_title { font-size: 24px; } .mainview_titlesub.mainview_titlesub_privacy { font-size: 44px; } .mainview_title.mainview_title_privacy { font-size: 24px; } .footer_contact { padding: 80px 0; background: url("../images/largetext_contact.webp") center top 24px / 44% no-repeat, url("../images/bg_contact.webp") center bottom / contain no-repeat, #f5f5f5; } .footer_contact_body { padding: 48px 24px; } .footer_contact_titlesub { margin-bottom: 18px; font-size: 30px; } .footer_contact_title { font-size: 30px; } .footer_contact_text { margin-top: 22px; font-size: 17px; } .footer_contact_mobile { margin-top: 16px; } .footer_contact_text br { display: none; } .footer_contact_link_title { font-size: 20px; margin-bottom: 24px; } .footer_contact_phone_heads { margin-right: 12px; font-size: 20px; } .footer_contact_number { font-size: 30px; } .footer_contact_mail_button { height: 82px; font-size: 24px; margin-top: 28px; } .footer_contact_mail_button::before { width: 32px; height: 24px; margin-right: 14px; } .footer { padding-bottom: 60px; } .footer_wrapper { padding-top: 50px; } .footer::before { height: 24px; } .footer_body { font-size: 18px; } .footer_logo { width: 260px; max-width: 100%; margin-bottom: 24px; } .footer_nav { display: block; } .footer_nav_link { display: block; padding: 0; border-left: none; font-size: 16px; line-height: 1.5; } .footer_nav_link + .footer_nav_link { margin-top: 14px; } /*** index ***/ .top_mainview_wrapper, .flexslider, .flexslider .slides > li { height: 560px; min-height: 560px; } .top_mainview_title { bottom: 54px; font-size: 40px; line-height: 1.5; letter-spacing: 0.05em; } .top_mainview_whitebox { margin-right: 8px; padding: 0 8px 3px; } .top_mainview_wrapper::after { right: 16px; bottom: 58px; font-size: 15px; } .top_mainview::after { right: 22px; height: 48px; } .top_about { padding-block: 50px; background: url("../images/largetext_about.webp") left -4px top 3.6vw / 96px auto no-repeat, #fff; } .top_about::after { width: 130px; height: 56px; } .top_about_titlesub { margin-bottom: 16px; font-size: 32px; } .top_about_title { font-size: 32px; line-height: 1.32; } .top_about_strong { margin-top: 26px; font-size: 20px; line-height: 1.5; } .top_about_text { margin-top: 18px; font-size: 16px; line-height: 1.75; } .top_about_text + .top_about_text { margin-top: 20px; } .top_about_linkbutton { height: 68px; font-size: 21px; } .top_about_linkbutton::after { right: 28px; width: 15px; height: 15px; } .top_about_image { height: 320px; margin-top: 42px; } .top_reasons { padding: 40px 0 50px; background: url("../images/largetext_reasons.webp") right -12px top 3.6vw / 92px auto no-repeat, #1b3e7f; } .top_reasons_titlesub { font-size: 32px; } .top_reasons_title { margin-top: 16px; line-height: 1.35; } .top_reasons_list { grid-template-columns: minmax(0, 430px); justify-content: center; gap: 24px; margin-top: 34px; } .top_reasons_listitem { padding: 24px 24px 32px; } .top_reasons_listitem_number { font-size: 40px; } .top_reasons_listitem_image { height: 108px; margin-top: 22px; } .top_reasons_listitem_image .blockimage { max-width: 150px; max-height: 100px; } .top_reasons_listitem_title { margin-top: 22px; font-size: 21px; } .top_reasons_listitem_text { font-size: 16px; line-height: 1.7; } .top_company { padding: 60px 0 40px; background: url("../images/largetext_company.webp") left -18px bottom 3.2vw / 92px auto no-repeat, url("../images/top_blur.webp") right center / cover no-repeat, #fff; } .top_company_wrapper { flex-direction: column; align-items: center; gap: 30px; padding: 0; } .top_company_body { position: relative; z-index: 2; flex: 0 0 auto; } .top_company_image { flex: 0 0 auto; width: 68%; min-width: 0; } .top_company_button { margin-right: auto; margin-left: auto; max-width: 360px; } .top_company_titlesub { font-size: 32px; margin-bottom: 16px; } .top_company_title { margin-bottom: 20px; } .top_company_text { margin-bottom: 30px; font-size: 16px; font-weight: 700; } .top_recruit_wrapper { padding: 50px 0 60px; } .footer_contact_mail_button { width: 360px; } .top_recruit { background: url("../images/largetext_recruit.webp") right -20px top 4.4vw / 92px auto no-repeat, url("../images/top_recruit_bg.webp") center top / cover no-repeat, #fff; } .top_recruit_body { width: 90%; max-width: auto; padding: 0; } .top_recruit_titlesub { font-size: 32px; } .top_recruit_title { margin-top: 16px; font-size: 40px; } .top_recruit_text { font-size: 16px; } .top_recruit_button { width: 360px; height: 82px; margin-top: 30px; } /*** about ***/ .about_body { padding: 30px 0 0; } .about_paragraph { margin-top: 20px; font-size: 16px; line-height: 1.6; } .about_title { gap: 16px; } .about_title_titlesub { font-size: 24px; padding-left: 18px; margin-bottom: 10px; } .about_title_number { font-size: 52px; padding-left: 26px; } .about_title_body { font-size: 28px; } .about_image { height: 320px; margin-top: 30px; } .about_02 .about_image { margin-top: 30px; } .about_01_wrapper, .about_02_wrapper, .about_03_wrapper { padding-bottom: 24px; } .about_03 { padding-bottom: 16px; } /*** recruit ***/ .recruit_message { padding-top: 50px; } .recruit_message_wrapper { padding: 50px 20px 58px; } .recruit_message_text { margin-top: 32px; font-size: 16px; } .recruit_flow { padding-top: 48px; } .recruit_flow_wrapper { padding: 30px 0 72px; } .recruit_flow_listitem { display: block; min-height: 0; padding-bottom: 44px; margin-bottom: 40px; text-align: center; } .recruit_flow_listitem_icon { width: 178px; margin-left: auto; margin-right: auto; } .recruit_flow_listitem_body { margin-top: 30px; } .recruit_flow_listitem_text { margin-top: 12px; font-size: 16px; line-height: 1.7; text-align: left; } .recruit_flow_infomation { margin-top: 50px; padding: 30px 20px; } .recruit_flow_infomation_body { padding-bottom: 24px; } .recruit_flow_infomation_title { font-size: 24px; } .recruit_flow_infomation_opening { margin-top: 8px; font-size: 16px; } .recruit_flow_infomation_phone { flex-wrap: wrap; margin-top: 28px; font-size: 20px; line-height: 1.35; } .recruit_flow_infomation_phone::before { width: 16px; height: 30px; margin-right: 10px; } .recruit_flow_infomation_number { font-size: 36px; } .recruit_flow_infomation_pic { width: 100%; margin-left: 0; font-size: 18px; } .recruit_flow_infomation_greeting { padding-top: 24px; font-size: 24px; } .recruit_requirements { padding: 56px 0 60px; } .recruit_requirements_category { margin-top: 40px; padding: 40px 24px 44px; } .recruit_requirements_category_title { font-size: 22px; } .recruit_requirements_category_list { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 28px; } .recruit_requirements_category_button { min-height: 68px; padding: 0 52px 0 22px; font-size: 16px; } .recruit_requirements_category_button::after { right: 24px; width: 12px; height: 12px; } #recruit_staff { background: url("../images/largetext_requirement01.webp") left -4px top 2vw / 92px auto no-repeat; } #recruit_assistant { background: url("../images/largetext_requirement02.webp") right -4px top / 92px auto no-repeat; } .recruit_requirements_list { margin-top: 56px; } .recruit_requirements_list + .recruit_requirements_list { margin-top: 60px; } .recruit_requirements_list_title { font-size: 25px; } .recruit_requirements_list_title::before { width: 10px; height: 52px; margin-right: 18px; } .recruit_requirements_listitem { display: block; font-size: 16px; } .recruit_requirements_listitem:first-of-type { margin-top: 30px; } .recruit_requirements_listitem_title { padding: 24px 10px 12px; font-size: 20px; } .recruit_requirements_listitem_text { padding: 0 10px 24px; } .recruit_requirements_entry { margin-top: 54px; } .recruit_requirements_entry_button { min-height: 68px; font-size: 18px; width: 320px; } .recruit_requirements_entry_button::after { right: 28px; width: 14px; height: 14px; } /*** company ***/ .company_message { padding-block: 50px; background: url(../images/largetext_message.webp) left -4px top 16px / 92px auto no-repeat; } .company_message_text { font-size: 16px; } .company_message_title { font-size: 22px; margin-bottom: 28px; } .company_message_sign { margin-top: 30px; } .company_message_sign_company { font-size: 24px; letter-spacing: 0.08em; width: fit-content; } .company_message_sign_position { font-size: 20px; } .company_message_sign_ceo { display: block; width: 120px; height: auto; } .company_message::after { width: 130px; height: 56px; } .company_profile { padding-block: 50px; background: url(../images/largetext_profile.webp) right -4px top 9.6vw / 92px auto no-repeat, url(../images/company_profile_bg.webp) left top / contain no-repeat, #1b3e7f; } .company_profile_listitem { font-size: 16px; } .company_profile_listitem_title { padding: 20px 0 20px 10px; } .company_profile_listitem_body { padding: 20px 10px 20px 20px; } .company_access { padding-top: 50px; } .company_access::after { width: 130px; height: 56px; } .company_access_wrapper { padding-top: 10px; background: url(../images/largetext_contact.webp) center top / 63% no-repeat; } .company_access_adress { font-size: 17px; } .company_access_map { aspect-ratio: 1 / 1 ; } /*** contact ***/ .contact_intro { padding-block: 50px 60px; } .contact_intro_wrapper { padding: 28px 20px 20px; } .contact_phone { flex-direction: column; gap: 8px; margin-top: 24px; } .contact_phone_tel, .contact_phone_mobile { font-size: 18px; } .contact_phone_number { font-size: 28px; margin-left: 12px; } .contact_phone_tel::before { margin-right: 5px; } .contact_phone_mobile::before { width: 13px; height: 24px; margin-right: 8px; } .contact_intro_text { margin-top: 24px; padding-top: 20px; font-size: 15px; } .contact_body { padding-block: 50px 50px; } .contact_body_titlesub { font-size: 30px; } .contact_body_title { font-size: 32px; margin-bottom: 30px; } .contact_mailform_listitem { flex-direction: column; align-items: flex-start; gap: 12px; padding: 20px 12px 20px 8px; } .contact_mailform_listitem_title { width: 100%; font-size: 18px; justify-content: flex-start; } .contact_mailform_listitem_inputs { width: 100%; } .contact_mailform_listitem_reqiredtag { padding: 2px 4px; margin-left: 16px; } .contact_mailform_listitem_address .wpcf7-form-control-wrap:first-of-type { margin-top: 0; } .privacy_check_title { font-size: 20px; margin-top: 20px; margin-bottom: 12px; } .privacy_wrap .wpcf7-list-item-label { font-size: 16px; } .privacy_wrap .wpcf7-list-item-label::before { margin-right: 16px; } .contact_mailform_submit { margin-top: 24px; } .contact_mailform_submitbutton { width: 320px; } /*** privacy ***/ .privacy_list { padding-block: 50px; } .privacy_list_head { margin-bottom: 24px; font-size: 16px; } .privacy_list_item { padding: 24px 0; font-size: 16px; } .privacy_list_item_head { margin-bottom: 20px; font-size: 22px; } } /* スマートフォン 縦(ポートレート) */ @media only screen and (max-width: 480px) { }