/* line 13, page_recruit-recruit.scss */ #recruit.recruit .titleWrap { height: 720px; } /* line 14, page_recruit-recruit.scss */ #recruit.recruit .titleWrap::before { display: none; } /* line 15, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit { align-items: flex-start; text-align: left; padding-left: 5%; } /* line 16, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em { font-size: 22px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; padding-left: .35em; } /* line 17, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em::after { display: none; } /* line 19, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em b { letter-spacing: .15em; } /* line 20, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em strong { padding: 0 1em; margin-left: 1em; letter-spacing: .25em; } /* line 22, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit span { font-size: 84px; line-height: 1.15; } /* line 23, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit span b { letter-spacing: .025em; } /* line 25, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit::after { width: 330px; height: 330px; opacity: .45; margin: 0; right: auto; left: 6%; } /* line 28, page_recruit-recruit.scss */ #recruit.recruit .titleWrap::before { background-image: linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%), linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%); mix-blend-mode: soft-light; } @media only screen and (max-width: 750px) { /* line 34, page_recruit-recruit.scss */ #recruit.recruit .titleWrap { height: 400px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; } /* line 35, page_recruit-recruit.scss */ #recruit.recruit .titleWrap::before { display: none; } /* line 36, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit { padding-left: 0%; box-sizing: border-box; position: relative; top: auto; left: auto; bottom: auto; right: auto; transform: none; width: 310px; position: absolute; left: 0; right: 0; margin: auto; z-index: 10; bottom: 80px; } /* line 37, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em, #recruit.recruit .titleWrap .cmnTit span { white-space: nowrap; } /* line 38, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em { font-size: 17.5px; padding-left: .25em; margin-bottom: .75em; } /* line 39, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em::after { display: none; } /* line 42, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit em strong { padding: 0 1em; margin-left: .75em; } /* line 44, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit span { font-size: 40px; } /* line 47, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .cmnTit::after { width: 220px; height: 220px; position: absolute; top: 50%; transform: translateY(-50%); left: -50%; right: -50%; margin: auto; z-index: 10; z-index: 0; opacity: .35; } /* line 49, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .ph { background: #002f49; } /* line 50, page_recruit-recruit.scss */ #recruit.recruit .titleWrap .ph img { opacity: .85; } /* line 52, page_recruit-recruit.scss */ #recruit.recruit .titleWrap::before { background-image: linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%), linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%); mix-blend-mode: soft-light; } } /* line 61, page_recruit-recruit.scss */ #recruit.recruit #intro .inner { position: relative; } /* line 62, page_recruit-recruit.scss */ #recruit.recruit #intro .inner .catch { margin-bottom: 1.25em; } /* line 63, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap { width: 100%; } /* line 64, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li { position: absolute; } /* line 66, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li .ph span { display: block; width: 100%; height: 0; } /* line 67, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li .ph span img { position: absolute; top: 50%; transform: translateY(-50%); left: -50%; right: -50%; margin: auto; z-index: 10; } /* line 71, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 { width: 240px; top: 90px; left: -70px; } /* line 72, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 .ph.ph01 { width: 100%; } /* line 73, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 .ph.ph01 span { padding-top: 140.5%; } /* line 76, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 { width: 350px; top: 180px; right: -150px; display: flex; justify-content: space-between; flex-wrap: wrap; } /* line 77, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph02 { width: 49.5%; margin-top: 110px; } /* line 78, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph02 span { padding-top: 140.5%; } /* line 80, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph03 { width: 45%; } /* line 81, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph03 span { padding-top: 140.5%; } @media only screen and (max-width: 750px) { /* line 93, page_recruit-recruit.scss */ #recruit.recruit #intro .inner { display: flex; flex-direction: column; flex-wrap: wrap; } /* line 94, page_recruit-recruit.scss */ #recruit.recruit #intro .inner .catch { margin-bottom: 1.25em; text-align: center; order: 0; } /* line 95, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap { width: 100%; order: 2; } /* line 99, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li .ph span::before { right: auto; left: .75em; filter: drop-shadow(0px 0px 3px black); } /* line 103, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 { width: 200px; /*margin-bottom: 18px;*/ position: relative; top: auto; left: auto; bottom: auto; right: auto; transform: none; } /* line 104, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 .ph.ph01 { width: 100%; } /* line 105, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list01 .ph.ph01 span { padding-top: 140.5%; } /* line 108, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 { /*width: 92%;*/ width: 345px; margin: -45px auto 0; position: relative; top: auto; left: auto; bottom: auto; right: auto; transform: none; } /* line 109, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph02 { width: 49.5%; margin-top: 80px; } /* line 110, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph02 span { padding-top: 140.5%; } /* line 112, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph03 { width: 45%; } /* line 113, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph03 span { padding-top: 140.5%; } /* line 114, page_recruit-recruit.scss */ #recruit.recruit #intro .inner ul.phWrap li.list02 .ph.ph03 span::before { left: auto; right: .75em; } /* line 119, page_recruit-recruit.scss */ #recruit.recruit #intro .inner .read { padding: 0 5%; margin-bottom: 1.5em; order: 1; } } /* line 127, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents { margin-top: 80px; padding-bottom: 0; } /* line 128, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner { padding: 0 50px; display: flex; justify-content: space-between; flex-wrap: wrap; } /* line 134, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .read { line-height: 2.5; width: 700px; } /* line 135, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap { width: calc(100% - 700px); display: flex; flex-direction: column; flex-wrap: wrap; align-items: flex-end; } /* line 136, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap .ph { width: 76%; } /* line 137, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap .name { width: 92%; margin-top: 1.25em; margin-right: -1.5em; } /* line 143, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 70px; } /* line 144, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li { width: 50%; height: 500px; } /* line 145, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a { position: relative; color: #fff; width: 100%; height: 100%; } /* line 146, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit { position: absolute; top: 50%; transform: translateY(-50%); left: -50%; right: -50%; margin: auto; z-index: 10; width: 300px; height: 300px; filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.25)); display: flex; flex-direction: column; flex-wrap: wrap; justify-content: space-around; } @media only screen and (max-width: 750px) { /* line 146, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit { filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.15)); } } /* line 147, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit * { position: relative; z-index: 10; } /* line 148, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i.cmnT { font-size: 8px; } /* line 149, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i.cmnT::after { width: 42px; height: 42px; background: url("../img/cmn/logoMarkW.webp") no-repeat center; } /* line 151, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit em { font-size: 26px; font-weight: 600; } /* line 152, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i:not(.cmnT) { font-size: 26px; line-height: 1; position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; right: 1.75em; transition: .4s all; } /* line 153, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit span { font-family: "Montserrat", sans-serif; font-size: 15px; font-weight: 600; margin-bottom: .5em; } /* line 154, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit::after { content: ""; width: 100%; height: 100%; background: rgba(241, 136, 60, 0.85); clip-path: polygon(50px 0%, 100% 0, 100% calc(100% - 50px), calc(100% - 50px) 100%, 0 100%, 0 50px); position: absolute; top: 0; left: 0; z-index: 0; } /* line 156, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .ph { background: #000; width: 100%; height: 100%; } /* line 157, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .ph img { opacity: .9; } /* line 159, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a::before { content: ""; width: 100%; height: 100%; background-image: linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%), linear-gradient(45deg, #0091df 25%, transparent 25%, transparent 75%, #0091df 75%); background-position: 10px 10px, 12px 12px; background-size: 4px 4px; position: absolute; top: 0; left: 0; z-index: 1; mix-blend-mode: soft-light; } /* line 161, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a:hover i:not(.cmnT) { right: 1.5em; } @media only screen and (max-width: 750px) { /* line 173, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents { margin-top: 60px; padding-bottom: 0; } /* line 174, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner { padding: 0 0%; } /* line 176, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .recruitTitle i.cmnT { margin-bottom: 1em; } /* line 180, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .read { line-height: 2.2; width: 100%; padding: 0 6.5%; } /* line 181, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap { width: 90%; display: flex; flex-direction: column; flex-wrap: wrap; align-items: center; margin: 1em auto 0; } /* line 182, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap .ph { width: 190px; } /* line 183, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents .inner .phWrap .name { width: 240px; margin: 1.5em auto 0; position: relative; left: -2.5%; } /* line 189, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap { margin-top: 60px; } /* line 190, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li { width: 100%; height: 250px; } /* line 192, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit { width: 180px; height: 180px; } /* line 194, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i.cmnT { font-size: 6px; } /* line 195, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i.cmnT::after { width: 30px; height: 30px; } /* line 197, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit em { font-size: 20px; } /* line 198, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit i:not(.cmnT) { font-size: 18px; right: .5em; margin-top: -.1em; } /* line 199, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit span { font-size: 11px; margin-bottom: .5em; } /* line 200, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a .tit::after { clip-path: polygon(20px 0%, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%, 0 20px); } /* line 205, page_recruit-recruit.scss */ #recruit.recruit .message.recruitContents ul.listWrap li a:hover i:not(.cmnT) { right: .5em; } }