#main_contents .elp{--red:#e4007f; --red-dark:#b80066; --red-soft:#fde8f2; --ink:#333; --muted:#777; --line:#ddd; --bg:#fff; --bg-gray:#f5f5f5; --ph:#d9d9d9; --ph-ink:#666; --note:#fff7cc; --note-line:#e0b400; --f:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;} #main_contents .elp,#main_contents .elp *{box-sizing:border-box} html{scroll-behavior:smooth} #main_contents .elp{margin:0;background:var(--bg);color:var(--ink);font-size:14px;line-height:1.8;} #main_contents .elp a{color:inherit} #main_contents .elp img{max-width:100%} #main_contents .elp .inner{max-width:1024px;margin:0 auto;padding-inline:15px} #main_contents .elp h1,#main_contents .elp h2,#main_contents .elp h3,#main_contents .elp h4{line-height:1.5;margin:0} #main_contents .elp .ph{position:relative;background:var(--ph);width:100%;display:block} #main_contents .elp .ph>span{position:absolute;left:12px;top:12px;background:#fff;color:var(--ph-ink);font-size:12px;line-height:1.4;padding:5px 10px;border-radius:2px;max-width:calc(100% - 24px)} #main_contents .elp .note{outline:2px dashed var(--note-line);outline-offset:4px;position:relative} #main_contents .elp .note::before{content:"要検討：" attr(data-note);position:absolute;right:0;top:-30px;background:var(--note);border:1px solid var(--note-line);font-size:11px;line-height:1.4;padding:3px 8px;color:#6b5600;z-index:2;max-width:100%} #main_contents .elp .mv{overflow:hidden} #main_contents .elp .dots{display:flex;justify-content:center;gap:8px;padding:8px 0} #main_contents .elp .dots button{width:12px;height:12px;border-radius:50%;border:0;background:#ccc;padding:0;cursor:pointer} #main_contents .elp .dots button.on{background:var(--red)} #main_contents .elp .mv .ph{height:516px} #main_contents .elp .toc{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);background:#fff;margin:12px 15px 0} #main_contents .elp .toc a{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:44px;padding:6px 8px;text-decoration:none;font-size:12px;font-weight:700;line-height:1.3;border-right:1px solid var(--line);border-bottom:1px solid var(--line)} #main_contents .elp .toc a::after{content:"";flex:none;width:6px;height:6px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(45deg);margin-top:-3px} #main_contents .elp section{scroll-margin-top:64px} #main_contents .elp .sec{padding-block:24px 8px} #main_contents .elp .sec-title{font-size:22px;font-weight:700;text-align:center;padding:8px 15px 4px} #main_contents .elp .sec-title::after{content:"";display:block;width:40px;height:3px;background:var(--red);margin:10px auto 0} #main_contents .elp .sec-body{padding-top:20px} #main_contents .elp .about-lead{display:grid;gap:16px;margin-top:24px} #main_contents .elp .about-lead .q{font-weight:700;font-size:17px;color:var(--red-dark);margin:0} #main_contents .elp .about-lead .em{font-weight:700;font-size:17px;margin:0} #main_contents .elp .exp-link{display:inline-block;margin:20px 0 4px;font-size:14px;color:var(--red-dark)} #main_contents .elp .article{margin-top:28px;border-top:3px solid var(--red);padding-top:20px} #main_contents .elp .article .label{display:inline-block;font-size:11px;background:var(--red-soft);color:var(--red-dark);padding:2px 8px;border-radius:2px;margin-bottom:8px} #main_contents .elp .article h2{font-size:20px;border-left:5px solid var(--red);padding:4px 0 4px 12px;margin:40px 0 16px} #main_contents .elp .article h3{font-size:17px;border-bottom:2px solid var(--red-soft);padding-bottom:4px;margin:28px 0 12px} #main_contents .elp .article h4{font-size:15px;margin:20px 0 8px} #main_contents .elp .article p{margin:0 0 14px} #main_contents .elp .article strong{background:linear-gradient(transparent 60%,#ffe0ef 60%)} #main_contents .elp .btn{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-weight:700;padding:12px 28px;border-radius:99px;font-size:15px} #main_contents .elp .btn:hover{background:var(--red-dark)} #main_contents .elp .tbl{overflow-x:auto;margin:0 0 14px} #main_contents .elp table{border-collapse:collapse;width:100%;min-width:480px;font-size:14px} #main_contents .elp th,#main_contents .elp td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top} #main_contents .elp th{background:var(--bg-gray);white-space:nowrap} #main_contents .elp td.star{color:var(--red);letter-spacing:1px;white-space:nowrap} #main_contents .elp .case{border:1px solid var(--line);border-radius:6px;padding:16px} #main_contents .elp .case h4{margin:0 0 8px} #main_contents .elp .case .flow{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;background:var(--bg-gray);padding:10px;border-radius:4px;font-size:13px;margin-bottom:10px} #main_contents .elp .case .flow span{text-align:center;color:var(--red)} #main_contents .elp .case p{font-size:14px;margin:0 0 6px} #main_contents .elp .lp-block{display:grid;gap:8px;margin-top:32px} #main_contents .elp .lp-block>*,#main_contents .elp .prep>*{min-width:0} #main_contents .elp .blk{padding:28px 0;border-top:1px solid var(--line)} #main_contents .elp .blk-en{margin:0;font-size:12px;letter-spacing:.15em;color:var(--red);font-weight:700;text-align:center} #main_contents .elp .blk-title{font-size:20px;text-align:center;margin:4px 0 14px} #main_contents .elp .blk-lead{text-align:center;margin:0 0 16px} #main_contents .elp .stats{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px} #main_contents .elp .stats li{background:var(--red-soft);border-radius:8px;padding:14px 10px;text-align:center;display:grid;gap:4px} #main_contents .elp .stats b{font-size:30px;line-height:1.1;color:var(--red-dark);font-variant-numeric:tabular-nums} #main_contents .elp .stats small{font-size:15px;margin-left:2px} #main_contents .elp .stats span{font-size:12px;line-height:1.5} #main_contents .elp .src{font-size:11px;color:var(--muted);margin:8px 0 0;text-align:right} #main_contents .elp .steps{list-style:none;margin:0;padding:0;display:grid;gap:14px} #main_contents .elp .steps>li{border:1px solid var(--line);border-radius:8px;padding:16px} #main_contents .elp .steps .no{display:inline-block;background:var(--red);color:#fff;font-size:12px;font-weight:700;padding:2px 10px;border-radius:99px;margin-bottom:6px} #main_contents .elp .steps h3{font-size:16px;margin-bottom:6px} #main_contents .elp .steps p,#main_contents .elp .jobcards p,#main_contents .elp .points p,#main_contents .elp .prep p{margin:0;font-size:14px} #main_contents .elp .memo{background:var(--bg-gray);border-radius:6px;padding:12px 14px;font-size:14px;margin:14px 0 0} #main_contents .elp .jobcards{list-style:none;margin:0;padding:0;display:grid;gap:10px} #main_contents .elp .jobcards>li{border:1px solid var(--line);border-radius:8px;padding:14px} #main_contents .elp .jobcards h3{font-size:16px;margin-bottom:4px} #main_contents .elp .tag-ok{display:inline-block;font-size:11px;font-weight:700;color:var(--red-dark);border:1px solid var(--red);border-radius:99px;padding:0 8px;margin-bottom:6px} #main_contents .elp .checks{list-style:none;margin:0;padding:0;display:grid;gap:8px} #main_contents .elp .checks li{position:relative;padding:10px 12px 10px 40px;border:1px solid var(--line);border-radius:6px;font-size:14px} #main_contents .elp .checks li::before{content:"";position:absolute;left:12px;top:50%;width:16px;height:16px;margin-top:-9px;border:2px solid var(--red);border-radius:3px} #main_contents .elp .checks li::after{content:"";position:absolute;left:17px;top:50%;width:5px;height:9px;margin-top:-8px;border-right:2px solid var(--red);border-bottom:2px solid var(--red);transform:rotate(45deg)} #main_contents .elp .prep{display:grid;gap:18px} #main_contents .elp .prep h3{font-size:16px;margin-bottom:6px;padding-left:10px;border-left:4px solid var(--red)} #main_contents .elp .prep .tbl{margin-top:10px} #main_contents .elp table.lang{min-width:0} #main_contents .elp td.lv{white-space:nowrap;color:var(--red-dark);font-weight:700} #main_contents .elp .points{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:pt} #main_contents .elp .points>li{counter-increment:pt;border-radius:8px;background:var(--bg-gray);padding:16px 16px 16px 56px;position:relative} #main_contents .elp .points>li::before{content:counter(pt);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font-weight:700} #main_contents .elp .points h3{font-size:16px;margin-bottom:4px} @media (min-width:768px){ #main_contents .elp .lp-block{max-width:960px;margin-inline:auto} #main_contents .elp .blk-title{font-size:26px} #main_contents .elp .stats{grid-template-columns:repeat(4,1fr);gap:16px} #main_contents .elp .stats b{font-size:40px} #main_contents .elp .steps{grid-template-columns:repeat(3,1fr)} #main_contents .elp .jobcards{grid-template-columns:repeat(3,1fr)} #main_contents .elp .checks{grid-template-columns:1fr 1fr} #main_contents .elp .points{grid-template-columns:repeat(3,1fr)} #main_contents .elp .points>li{padding:56px 18px 18px} } #main_contents .elp .jl{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px} #main_contents .elp .jl a{display:inline-block;font-size:13px;line-height:1.4;padding:5px 12px 5px 10px;border:1px solid var(--red);border-radius:99px;color:var(--red-dark);text-decoration:none;background:#fff} #main_contents .elp .jl a::before{content:"› ";font-weight:700} #main_contents .elp .jl a:hover{background:var(--red-soft)} #main_contents .elp .more{display:block;margin-top:8px;font-size:13px;font-weight:700;color:var(--red-dark);text-decoration:none} #main_contents .elp .more+.more{margin-top:4px} #main_contents .elp .more:hover{text-decoration:underline} #main_contents .elp .stats a{display:grid;gap:4px;text-decoration:none;color:inherit;height:100%} #main_contents .elp .stats em{font-style:normal;font-size:11px;font-weight:700;color:var(--red-dark)} #main_contents .elp .stats li:hover{background:#fbd7e8} #main_contents .elp .fit{display:grid;gap:10px;margin-top:14px} #main_contents .elp .fit>div{background:var(--bg-gray);border-radius:8px;padding:14px} #main_contents .elp .fit h3{font-size:15px;margin-bottom:4px} #main_contents .elp .fit p{margin:0;font-size:14px} @media (min-width:768px){ #main_contents .elp .fit{grid-template-columns:1fr 1fr} } #main_contents .elp .hero{position:relative;overflow:hidden} #main_contents .elp .card .jl{margin-top:12px} #main_contents .elp .jobcards .jl{display:block;margin-top:8px;font-size:12px;line-height:1.7;color:#888} #main_contents .elp .jobcards .jl::before{content:"求人を見る：";color:#888} #main_contents .elp .jobcards .jl li{display:inline} #main_contents .elp .jobcards .jl li+li::before{content:" ／ ";color:#bbb} #main_contents .elp .jobcards .jl a{display:inline;padding:0;border:0;border-radius:0;background:none;font-size:12px;color:#666;text-decoration:underline;text-underline-offset:2px} #main_contents .elp .jobcards .jl a::before{content:none} #main_contents .elp .jobcards .jl a:hover{background:none;color:var(--red-dark)} #main_contents .elp .pic{display:block;height:auto;overflow:hidden} #main_contents .elp .point-illust{border:1px solid var(--line);border-radius:8px;background:#fff} #main_contents .elp .point-no{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;color:#fff;background:linear-gradient(90deg,#cfe38a,#6cd1b9);padding:2px 12px;border-radius:2px;margin-bottom:6px} #main_contents .elp .card-body mark{background:linear-gradient(transparent 55%,#fff35c 55%);color:inherit;padding:0 1px} @media (min-width:768px){ #main_contents .elp .about .inner{display:grid;grid-template-columns:400px minmax(0,1fr);column-gap:48px;align-items:start} #main_contents .elp .about .sec-title{grid-column:1 / -1} #main_contents .elp .about .about-lead{margin-top:24px;gap:12px} #main_contents .elp .about-lead .q,#main_contents .elp .about-lead .em{font-size:18px} } #main_contents .elp .pic img{display:block;width:100%;height:auto} #main_contents .elp .sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} @media (min-width:768px){ #main_contents .elp .hero .pic{max-width:1280px;margin:0 auto} } #main_contents .elp .col-card .card-body h3{font-size:15px;line-height:1.6;margin:0} #main_contents .elp .col-photo img{aspect-ratio:297/185;object-fit:cover} @media (max-width:767px){ #main_contents .elp #reasons.cards,#main_contents .elp #voices.cards{display:grid;gap:16px;overflow:visible} #main_contents .elp #reasons.cards>.card,#main_contents .elp #voices.cards>.card{flex:none} #main_contents .elp .dots[data-for="reasons"],#main_contents .elp .dots[data-for="voices"]{display:none} #main_contents .elp #reasons .card{border:1px solid var(--line);border-radius:8px;overflow:hidden} #main_contents .elp #voices .card{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:start;border:1px solid var(--line);border-radius:8px;padding:14px} #main_contents .elp #voices .card .pic{width:72px;border-radius:6px} #main_contents .elp #voices .card .card-body{padding:0} #main_contents .elp #voices .card-body h3{font-size:14px;margin-bottom:4px} #main_contents .elp #voices .card-body p{font-size:13px;line-height:1.75} } @media (min-width:768px){ #main_contents .elp #voices.cards.two{grid-template-columns:1fr 1fr;gap:20px 28px} #main_contents .elp #voices .card{display:grid;grid-template-columns:130px minmax(0,1fr);gap:18px;align-items:start;border:1px solid var(--line);border-radius:8px;padding:18px} #main_contents .elp #voices .card .pic{width:130px} #main_contents .elp #voices .card .card-body{padding:0} #main_contents .elp #voices .card-body h3{font-size:15px;margin-bottom:6px} #main_contents .elp #voices .card-body p{font-size:13.5px;line-height:1.8} } @media (min-width:768px){ #main_contents .elp #columns.cards.two{grid-template-columns:repeat(4,1fr);gap:20px} #main_contents .elp #columns .col-card .card-body{padding:12px 0} #main_contents .elp #columns .col-card .card-body h3{font-size:14px} } #main_contents .elp #columns .col-card .card-body{padding:12px 0} #main_contents .elp .shindan .checks li{padding:0;border:0} #main_contents .elp .shindan .checks label{display:block;position:relative;padding:12px 12px 12px 44px;border:1px solid var(--line);border-radius:6px;font-size:14px;cursor:pointer;background:#fff;transition:background .15s,border-color .15s} #main_contents .elp .shindan .checks input{position:absolute;opacity:0;width:1px;height:1px} #main_contents .elp .shindan .checks label::before{content:"";position:absolute;left:12px;top:50%;width:18px;height:18px;margin-top:-10px;border:2px solid #bbb;border-radius:4px;background:#fff} #main_contents .elp .shindan .checks label:has(input:checked){background:var(--red-soft);border-color:var(--red)} #main_contents .elp .shindan .checks label:has(input:checked)::before{border-color:var(--red);background:var(--red)} #main_contents .elp .shindan .checks label:has(input:checked)::after{content:"";position:absolute;left:18px;top:50%;width:6px;height:10px;margin-top:-8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg)} #main_contents .elp .shindan .checks label:has(input:focus-visible){outline:2px solid var(--red);outline-offset:2px} #main_contents .elp .shindan .checks li::before,#main_contents .elp .shindan .checks li::after{content:none} #main_contents .elp .shindan-btn{text-align:center;margin:16px 0 0} #main_contents .elp .shindan-btn .btn{border:0;cursor:pointer;font-family:inherit} #main_contents .elp .shindan-result{margin-top:20px;border:2px solid var(--red);border-radius:10px;padding:20px 18px;text-align:center;background:#fff} #main_contents .elp .res-label{margin:0;font-size:12px;letter-spacing:.15em;color:var(--red);font-weight:700} #main_contents .elp .res-title{font-size:18px;margin:6px 0 8px} #main_contents .elp .res-text{font-size:14px;margin:0 0 12px;text-align:left} #main_contents .elp .shindan-result .jl{justify-content:center} #main_contents .elp .res-fit{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line);text-align:left} #main_contents .elp .res-fit-label{margin:0 0 8px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.08em;text-align:center} #main_contents .elp .res-fit .fit{margin-top:0} #main_contents .elp .jobs .exp{flex:none;margin-left:6px;font-size:11px;font-weight:700;color:#666;border:1px solid #bbb;border-radius:99px;padding:0 7px;line-height:1.6;white-space:nowrap} #main_contents .elp .cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:0;scrollbar-width:none} #main_contents .elp .cards::-webkit-scrollbar{display:none} #main_contents .elp .cards>.card{flex:0 0 100%;scroll-snap-align:start} #main_contents .elp .card .ph{height:180px} #main_contents .elp .card .card-body{padding:14px 15px} #main_contents .elp .card .card-body h3{font-size:16px;margin-bottom:6px} #main_contents .elp .card .card-body p{margin:0;font-size:14px} #main_contents .elp .card a.whole{text-decoration:none;display:block} #main_contents .elp .search{display:grid;gap:16px} #main_contents .elp .search input{width:100%;height:50px;border:1px solid #bbb;border-radius:4px;padding:0 14px;font-size:15px} #main_contents .elp .tag-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0} #main_contents .elp .tag-list a{display:inline-block;border:1px solid var(--line);border-radius:99px;padding:5px 14px;text-decoration:none;font-size:14px;background:#fff} #main_contents .elp .tag-list a:hover{border-color:var(--red);color:var(--red-dark)} #main_contents .elp .jobs{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)} #main_contents .elp .jobs a{display:flex;justify-content:space-between;align-items:center;min-height:50px;border-bottom:1px solid var(--line);padding:8px 15px;text-decoration:none;font-size:14px} #main_contents .elp .jobs a::after{content:"";width:8px;height:8px;border-right:2px solid var(--red);border-top:2px solid var(--red);transform:rotate(45deg);flex:none;margin-left:10px} #main_contents .elp .banners{display:grid;gap:16px;list-style:none;margin:0;padding:0} #main_contents .elp .banners .ph{height:180px} #main_contents .elp .banners .d{display:none} @media (min-width:768px){ #main_contents .elp{font-size:13px} #main_contents .elp .sp-only{display:none} #main_contents .elp .mv .dots{display:none} #main_contents .elp .toc{grid-template-columns:repeat(6,1fr);max-width:1024px;margin:20px auto 0} #main_contents .elp .toc a{min-height:52px;padding:8px 12px;font-size:14px} #main_contents .elp .sec{padding-block:48px 16px} #main_contents .elp .sec-title{font-size:26px;padding-top:0;position:relative} #main_contents .elp .sec-title::after{content:"";display:block;width:48px;height:3px;background:var(--red);margin:10px auto 0} #main_contents .elp .about-lead .q,#main_contents .elp .about-lead .em{font-size:20px} #main_contents .elp .article h2{font-size:24px} #main_contents .elp .article{max-width:860px;margin-inline:auto} #main_contents .elp .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;overflow:visible} #main_contents .elp .cards.two{grid-template-columns:repeat(2,1fr)} #main_contents .elp .cards>.card{flex:none} #main_contents .elp .cards+.dots{display:none} #main_contents .elp .card .ph{height:120px} #main_contents .elp .search input{max-width:520px} #main_contents .elp .jobs{display:grid;grid-template-columns:1fr 1fr;column-gap:24px;border:0} #main_contents .elp .jobs a{border-top:0;padding-inline:4px;font-size:15px} #main_contents .elp .banners .ph{height:120px} #main_contents .elp .banners .d{display:block;padding:10px 0 0;margin:0;font-size:14px;color:var(--muted)} } @media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} } #main_contents .elp .nm-mv{font-family:var(--nm-f);font-size:15px;line-height:2;letter-spacing:.06em;color:var(--nm-ink)} #main_contents .elp :where(.nm-mv, #main_contents .elp .nm-about) :where(p, #main_contents .elp h1, #main_contents .elp h2){margin:0} #main_contents .elp .nm-mv,#main_contents .elp .nm-about{--nm-teal:#3cc3bd; --nm-teal-dark:#1d8f95; --nm-navy:#1f3a4d; --nm-pink:#f0566a; --nm-pink-dark:#d93f55; --nm-ink:#333; --nm-ph:#dfe6e8; --nm-ph-ink:#5f6b70; --nm-f:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;} #main_contents .elp .nm-ph{position:relative;background:var(--nm-ph);overflow:hidden} #main_contents .elp .nm-ph>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px;line-height:1.6;letter-spacing:.04em;color:var(--nm-ph-ink);background:rgba(255,255,255,.85);padding:6px 12px;border-radius:4px;text-align:center;white-space:nowrap} #main_contents .elp .nm-mv{position:relative;overflow:hidden;background: radial-gradient(circle at 8% 30%,#fdf7c8 0 18%,transparent 19%), radial-gradient(circle at 46% 8%,#fbf3b5 0 7%,transparent 7.5%), linear-gradient(120deg,#f2fbf8 0%,#ffffff 40%,#eaf6f7 100%)} #main_contents .elp .nm-mv::before{content:"";position:absolute;left:2%;top:58%;width:220px;height:220px; background:radial-gradient(#c9eae6 1.6px,transparent 1.8px) 0 0/12px 12px;opacity:.8;border-radius:50%;pointer-events:none} #main_contents .elp .nm-mv-in{position:relative;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr;padding:32px 20px 90px} #main_contents .elp .nm-mv-txt{position:relative;z-index:2;text-align:center} #main_contents .elp .nm-mv-head{width:fit-content;margin:0 auto} #main_contents .elp .nm-mv-hand{display:block;width:220px;height:auto} #main_contents .elp .nm-mv-title{margin-top:4px;font-weight:700;color:var(--nm-navy);font-size:40px;line-height:1.36;letter-spacing:.05em} #main_contents .elp .nm-mv-title .nm-it{color:var(--nm-teal)} #main_contents .elp .nm-mv-title .nm-sm{font-size:.75em} #main_contents .elp .nm-mv-sub{margin-top:14px;font-size:12px;font-weight:700;color:#55656d;letter-spacing:.06em} #main_contents .elp .nm-stats{display:flex;justify-content:center;gap:10px;margin-top:22px} #main_contents .elp .nm-stat{flex:1;aspect-ratio:1;max-width:150px;border-radius:50%;background:rgba(255,255,255,.92);border:1.5px solid #e9e2a6; display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 6px 18px rgba(80,140,140,.08);position:relative} #main_contents .elp .nm-stat svg{width:22px;height:16px;margin-bottom:2px} #main_contents .elp .nm-stat-label{font-size:10.5px;font-weight:700;line-height:1.5;letter-spacing:.06em;color:var(--nm-navy)} #main_contents .elp .nm-stat-num{font-weight:900;color:var(--nm-pink);font-size:28px;line-height:1.25;letter-spacing:.02em} #main_contents .elp .nm-stat-num small{font-size:.42em;letter-spacing:0} #main_contents .elp .nm-cta{margin:26px auto 0;text-align:center;max-width:470px} #main_contents .elp .nm-btn{display:flex;align-items:center;justify-content:center;gap:18px;height:60px;border-radius:999px;text-decoration:none; background:linear-gradient(90deg,#f46b7c,var(--nm-pink));color:#fff;font-weight:700;font-size:17px;letter-spacing:.14em; box-shadow:0 6px 0 var(--nm-pink-dark),0 12px 24px rgba(240,86,106,.25);transition:transform .15s,box-shadow .15s} #main_contents .elp .nm-btn::after{content:"";width:8px;height:8px;border-top:2px solid #fff;border-right:2px solid #fff;transform:rotate(45deg)} #main_contents .elp .nm-btn:hover{transform:translateY(3px);box-shadow:0 3px 0 var(--nm-pink-dark),0 8px 16px rgba(240,86,106,.2)} #main_contents .elp .nm-mv-photo{position:relative;margin:28px -20px 0;aspect-ratio:16/9} #main_contents .elp .nm-mv-img{position:absolute;top:0;right:0;width:100%;height:100%;object-fit:cover;object-position:100% 20%;display:block; -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%),linear-gradient(90deg,transparent 0,#000 20%);-webkit-mask-composite:source-in; mask-image:linear-gradient(180deg,transparent 0,#000 14%),linear-gradient(90deg,transparent 0,#000 20%);mask-composite:intersect} #main_contents .elp .nm-mv-copy{position:absolute;left:6px;top:8px;width:170px;height:auto;z-index:2} #main_contents .elp .nm-bubble-wrap{position:absolute;right:8px;bottom:-56px;display:flex;align-items:center;z-index:3} #main_contents .elp .nm-bubble{flex-shrink:0;width:140px;height:88px;display:flex;align-items:center;justify-content:center; background:url(img/mv_bubble.png) center/100% 100% no-repeat; font-size:11.5px;font-weight:700;line-height:1.75;letter-spacing:.08em;color:#3f5059;text-align:center; filter:drop-shadow(0 6px 9px rgba(79,140,140,.1))} #main_contents .elp .nm-bubble span{display:block;transform:rotate(-4.4deg)} #main_contents .elp .nm-wave{position:absolute;left:0;right:0;bottom:-1px;width:100%;height:70px;display:block;z-index:4} #main_contents .elp #about.nm-about{position:relative;overflow:hidden;padding:56px 20px 64px;color:#333;letter-spacing:.02em; font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif; background:#fff url(img/bg_sp_02.png) bottom/100% auto no-repeat} #main_contents .elp .nm-about-in{position:relative;z-index:1;max-width:1232px;margin:0 auto} #main_contents .elp .nm-sec-title{display:table;margin:0 auto;font-size:20px;font-weight:700;line-height:1.5;letter-spacing:.06em;text-align:center} #main_contents .elp .nm-sec-title::after{content:"";display:block;width:calc(100% + 24px);height:10px;margin:14px 0 0 -12px;border-radius:6px; background:linear-gradient(90deg,rgba(237,233,117,.6),rgba(68,193,191,.6))} #main_contents .elp .nm-about-body{display:grid;grid-template-columns:1fr 1fr;gap:28px 16px;margin-top:32px;justify-items:center} #main_contents .elp .nm-about-photo{width:150px;height:150px;border-radius:50%;object-fit:cover;border:6px solid #fff;box-shadow:0 8px 24px rgba(60,120,120,.12);display:block} #main_contents .elp .nm-about-lead{grid-column:1 / -1;grid-row:2;display:grid;gap:14px;text-align:left;max-width:520px} #main_contents .elp .nm-about-lead p{margin:0;letter-spacing:.03em} #main_contents .elp .nm-about-lead .nm-q{font-size:16px;font-weight:700;line-height:1.7;color:#138d8b} #main_contents .elp .nm-about-lead .nm-txt{font-size:15px;line-height:1.95} #main_contents .elp .nm-about-lead .nm-em{font-size:17px;font-weight:700;line-height:1.7} #main_contents .elp .nm-about .nm-side{position:relative} #main_contents .elp .nm-about-bubble{position:absolute;top:-24px;left:-30px;width:100px;height:100px;border-radius:50%;background:#fff;border:1.5px solid #cfeae4; display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;z-index:2; box-shadow:0 6px 18px rgba(79,140,140,.1)} #main_contents .elp .nm-about-bubble img{display:block;width:5.9em;height:auto} @media (min-width:900px){ #main_contents .elp .nm-mv{height:800px} #main_contents .elp .nm-mv-in{position:relative;max-width:1920px;grid-template-columns:620px 1fr;align-items:center;height:100%;padding:24px 40px 96px max(40px, calc(min(100%, 1920px) / 2 - 600px))} #main_contents .elp .nm-mv-hand{width:306px} #main_contents .elp .nm-mv-title{font-size:59px;line-height:80px;margin-top:2px} #main_contents .elp .nm-mv-title .nm-it{letter-spacing:.1em} #main_contents .elp .nm-mv-sub{font-size:15px;margin-top:20px;letter-spacing:.14em} #main_contents .elp .nm-stats{gap:14px;margin-top:20px} #main_contents .elp .nm-stat{flex:0 0 150px;max-width:none;height:150px} #main_contents .elp .nm-stat-label{font-size:12px} #main_contents .elp .nm-stat-num{font-size:32px} #main_contents .elp .nm-stat svg{width:28px;height:20px;margin-bottom:4px} #main_contents .elp .nm-cta{margin-top:20px} #main_contents .elp .nm-btn{height:62px;font-size:18px} #main_contents .elp .nm-mv-photo{position:absolute;left:calc(50% - 782px);right:auto;top:0;bottom:0;width:1422px;height:auto;margin:0;aspect-ratio:auto} #main_contents .elp .nm-mv-img{right:0;-webkit-mask-image:linear-gradient(90deg,transparent 0,transparent 40.6%,#000 53.7%);mask-image:linear-gradient(90deg,transparent 0,transparent 40.6%,#000 53.7%)} #main_contents .elp .nm-mv-copy{left:auto;right:10px;top:215px;width:230px} #main_contents .elp .nm-bubble-wrap{left:auto;right:100px;top:520px;bottom:auto} #main_contents .elp .nm-bubble{width:200px;height:125px;font-size:15px;line-height:28.5px} #main_contents .elp .nm-wave{height:110px} #main_contents .elp #about.nm-about{padding:72px 24px 130px;background-image:url(img/bg_pc_02.png)} #main_contents .elp .nm-sec-title{font-size:26px} #main_contents .elp .nm-sec-title::after{height:11px} #main_contents .elp .nm-about-body{grid-template-columns:250px 499px 250px;justify-content:center;column-gap:30px;margin-top:30px;align-items:start} #main_contents .elp .nm-about-photo{width:250px;height:250px;border-width:8px} #main_contents .elp .nm-about-photo{margin-top:-15px} #main_contents .elp .nm-about-lead{grid-column:auto;grid-row:auto;gap:17px;max-width:none} #main_contents .elp .nm-about-lead .nm-q{font-size:18px} #main_contents .elp .nm-about-lead .nm-txt{font-size:16px} #main_contents .elp .nm-about-lead .nm-em{font-size:20px} #main_contents .elp .nm-about .nm-side{margin-top:-15px} #main_contents .elp .nm-about-bubble{width:140px;height:140px;font-size:14px;left:-40px;top:-30px} } @media (max-width:767px){ #main_contents .elp section,#main_contents .elp [id]{scroll-margin-top:92px} } #main_contents .elp .toc-rail{position:fixed;right:4px;top:50%;z-index:35;transform:translateY(-50%);display:flex;flex-direction:column;gap:2px;opacity:0;pointer-events:none;transition:opacity .2s} #main_contents .elp .toc-rail.show{opacity:1;pointer-events:auto} #main_contents .elp .toc-rail a{position:relative;display:grid;place-items:center;width:24px;height:22px;text-decoration:none} #main_contents .elp .toc-rail a::before{content:"";width:7px;height:7px;border-radius:50%;background:rgba(0,0,0,.25);transition:.15s} #main_contents .elp .toc-rail a.cur::before{width:12px;height:12px;background:var(--red);box-shadow:0 0 0 3px rgba(228,0,127,.18)} #main_contents .elp .toc-rail .bubble{position:absolute;right:21px;top:50%;display:flex;align-items:center;gap:8px;padding:7px 14px 7px 8px;border-radius:99px;background:rgba(51,51,51,.92);color:#fff;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.25);opacity:0;pointer-events:none;transform:translate(8px,-50%);transition:opacity .18s,transform .18s} #main_contents .elp .toc-rail .bubble::after{content:"";position:absolute;right:-5px;top:50%;margin-top:-6px;border:6px solid transparent;border-right:0;border-left:7px solid rgba(51,51,51,.92)} #main_contents .elp .toc-rail .bubble b{background:var(--red);border-radius:99px;padding:2px 9px;font-size:11px;font-weight:700} #main_contents .elp .toc-rail a.tip .bubble{opacity:1;transform:translate(0,-50%)} #main_contents .elp .toc-rail a.cur .bubble{right:23px} @media (min-width:768px){ #main_contents .elp section,#main_contents .elp [id]{scroll-margin-top:24px} #main_contents .elp .toc-rail{right:16px;gap:4px} #main_contents .elp .toc-rail a{width:28px;height:24px} #main_contents .elp .toc-rail a::before{width:8px;height:8px} #main_contents .elp .toc-rail a.cur::before{width:14px;height:14px} #main_contents .elp .toc-rail .bubble{right:23px;font-size:14px} #main_contents .elp .toc-rail a.cur .bubble{right:26px} } @media (hover:hover){ #main_contents .elp .toc-rail a:hover .bubble,#main_contents .elp .toc-rail a:focus-visible .bubble{opacity:1;transform:translate(0,-50%)} #main_contents .elp .toc-rail a:hover::before{background:var(--red-dark)} } @media (prefers-reduced-motion:reduce){ #main_contents .elp .toc-rail,#main_contents .elp .toc-rail .bubble{transition:none} } #main_contents .elp .stats i[data-stat],#main_contents .elp .src i[data-stat]{font-style:normal} #main_contents .elp .jobs a{justify-content:flex-start} #main_contents .elp .jobs a::after{margin-left:auto} #main_contents .elp .jobs .cnt{margin-left:6px;margin-right:8px;font-size:.9em;color:var(--muted);font-weight:400;white-space:nowrap} /* ===== 基本 ===== */ #main_contents .elp{--red:#49c0be; --red-dark:#138d8b; --red-soft:#e3f5f4; --old-grad:linear-gradient(to right,rgba(237,233,117,.6),rgba(68,193,191,.6)); --old-wash:linear-gradient(to right bottom,rgba(237,233,117,.4),rgba(68,193,191,.4)); --old-cream:#fffceb; --old-shadow:0 2px 8px rgba(0,0,0,.12);} #main_contents .elp .sec-title,#main_contents .elp .blk-title{display:table;margin-left:auto;margin-right:auto;padding-inline:0} #main_contents .elp .sec-title::after,#main_contents .elp .blk-title::after{content:"";display:block;width:calc(100% + 24px);margin:12px 0 0 -12px;height:10px;border-radius:6px;background:var(--old-grad)} #main_contents .elp .blk-title{margin-bottom:22px} #main_contents .elp .blk-en{color:#49c0be} #main_contents .elp .blk{border-top:0} #main_contents .elp #about{background:url(img/bg_sp_01.png) top/100% no-repeat,url(img/bg_sp_02.png) bottom/100% no-repeat;padding-bottom:32px} #main_contents .elp #reasons-sec{background:var(--old-wash);padding-bottom:32px} #main_contents .elp #voices-sec{background:url(img/bg_sp_03.png) center/cover no-repeat;padding-bottom:32px} #main_contents .elp section:has(#guide){background:#fff} #main_contents .elp section:has(#guide) .blk:nth-child(even){position:relative} #main_contents .elp section:has(#guide) .blk:nth-child(even)::before{content:"";position:absolute;inset:0 calc(50% - 50vw);background:var(--old-cream);z-index:-1} #main_contents .elp section:has(#guide) .lp-block{position:relative;z-index:0} #main_contents .elp #job,#main_contents .elp #jobs{background:var(--old-cream)} #main_contents .elp #job{padding-bottom:24px} #main_contents .elp #jobs{padding-top:8px;padding-bottom:32px} #main_contents .elp #wt{background:var(--old-wash);padding-bottom:32px} #main_contents .elp section:has(#prepare){background:url(img/bg_sp_01.png) top/100% no-repeat,url(img/bg_sp_02.png) bottom/100% no-repeat} @media (min-width:768px){ #main_contents .elp #about,#main_contents .elp section:has(#prepare){background-image:url(img/bg_pc_01.png),url(img/bg_pc_02.png)} #main_contents .elp #voices-sec{background-image:url(img/bg_pc_03.png)} #main_contents .elp .sec-title::after,#main_contents .elp .blk-title::after{height:11px} } #main_contents .elp #reasons .card,#main_contents .elp #voices .card,#main_contents .elp .jobcards>li,#main_contents .elp .steps>li,#main_contents .elp .shindan .checks label,#main_contents .elp .col-card,#main_contents .elp .prep>div,#main_contents .elp .stats li{border:0;box-shadow:var(--old-shadow);background:#fff} #main_contents .elp #reasons .card{border-radius:0} #main_contents .elp .points>li{background:#fff;box-shadow:var(--old-shadow)} #main_contents .elp .stats li{background:#fff} #main_contents .elp .stats li:hover{background:var(--red-soft)} #main_contents .elp .stats b{color:#138d8b} #main_contents .elp .point-no{background:linear-gradient(90deg,#cfe38a,#6cd1b9);clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);padding:4px 26px 4px 14px;border-radius:0} #main_contents .elp #reasons .card-body h3{color:#49c0be;text-align:center} #main_contents .elp #voices .card-body h3{color:#49c0be} #main_contents .elp .tag-list a{background:#49c0be;border-color:#49c0be;color:#fff;border-radius:17px} #main_contents .elp .tag-list a:hover{background:#138d8b;border-color:#138d8b;color:#fff} #main_contents .elp .jobs{border-top:0;display:grid;gap:10px} #main_contents .elp .jobs a{background:#fff;border:0;box-shadow:var(--old-shadow);font-weight:700} @media (min-width:768px){ #main_contents .elp .jobs{column-gap:44px;row-gap:12px;max-width:920px;margin:0 auto} } #main_contents .elp .jl a{border-color:#49c0be;color:#138d8b} #main_contents .elp .jl a:hover{background:var(--red-soft)} #main_contents .elp .btn{background:#49c0be} #main_contents .elp .btn:hover{background:#138d8b} #main_contents .elp .memo{background:#fff;box-shadow:var(--old-shadow)} #main_contents .elp .tag-ok{color:#138d8b;border-color:#49c0be} #main_contents .elp .steps .no{background:#49c0be} #main_contents .elp .points>li::before{background:#49c0be} #main_contents .elp .prep h3{border-left-color:#49c0be} #main_contents .elp td.lv{color:#138d8b} #main_contents .elp .shindan-result{border-color:#49c0be} #main_contents .elp .res-label{color:#49c0be} #main_contents .elp .fit>div{background:var(--old-cream)} #main_contents .elp .toc-rail a.cur::before{box-shadow:0 0 0 3px rgba(73,192,190,.25)} #main_contents .elp .exp-link{color:#333;font-weight:700;text-decoration:none;display:block;text-align:center} /* ===== 見た目の調整 ===== */ #main_contents .elp{--tidy-w:960px;--tidy-pad:20px;--tidy-sec:48px;--tidy-head:28px;--tidy-r:16px; --tidy-shadow:0 2px 4px rgba(19,141,139,.06),0 6px 18px rgba(19,141,139,.08)} @media (min-width:768px){ #main_contents .elp{--tidy-sec:80px;--tidy-head:40px} } #main_contents .elp{line-height:1.85;letter-spacing:.02em} #main_contents .elp .inner{max-width:calc(var(--tidy-w) + var(--tidy-pad) * 2);padding-inline:var(--tidy-pad)} #main_contents .elp .lp-block{max-width:none;margin-top:0;gap:0} #main_contents .elp .sec{padding-block:var(--tidy-sec)} #main_contents .elp #reasons-sec,#main_contents .elp #voices-sec,#main_contents .elp #about,#main_contents .elp #job,#main_contents .elp #wt{padding-bottom:var(--tidy-sec)} #main_contents .elp #jobs{padding-top:0;padding-bottom:var(--tidy-sec)} #main_contents .elp .blk{padding-block:var(--tidy-sec);border-top:0} #main_contents .elp section:has(#guide),#main_contents .elp section:has(#check),#main_contents .elp section:has(#prepare){padding-block:0} #main_contents .elp section:has(#guide) .blk:nth-child(even)::before{inset:0 calc(50% - 50vw)} #main_contents .elp .blk-en{display:none} #main_contents .elp .sec-title,#main_contents .elp .blk-title{font-size:20px;line-height:1.5;letter-spacing:.06em;padding:0;margin:0 auto var(--tidy-head);text-align:center} #main_contents .elp .sec-title::after,#main_contents .elp .blk-title::after{margin-top:14px} #main_contents .elp .sec-body{padding-top:0} #main_contents .elp .blk-lead{max-width:40em;margin:calc(var(--tidy-head) * -0.4) auto var(--tidy-head);text-align:center;font-size:14px;color:#666} @media (min-width:768px){ #main_contents .elp .sec-title,#main_contents .elp .blk-title{font-size:26px} } #main_contents .elp .about-lead{gap:14px} #main_contents .elp .about-lead .q{color:#138d8b;font-size:16px;line-height:1.7} #main_contents .elp .about-lead .em{font-size:17px;line-height:1.7} @media (min-width:768px){ #main_contents .elp .about .inner{grid-template-columns:400px minmax(0,1fr);column-gap:56px;align-items:center} #main_contents .elp .about .about-lead{margin-top:0} #main_contents .elp .about-lead .q{font-size:18px} #main_contents .elp .about-lead .em{font-size:19px} } #main_contents .elp #reasons .card,#main_contents .elp #voices .card,#main_contents .elp .jobcards>li,#main_contents .elp .steps>li,#main_contents .elp .points>li,#main_contents .elp .col-card,#main_contents .elp .stats li,#main_contents .elp .memo,#main_contents .elp .prep>div{border:0;border-radius:var(--tidy-r);box-shadow:var(--tidy-shadow);background:#fff} #main_contents .elp #reasons .card{overflow:hidden;display:flex;flex-direction:column} #main_contents .elp #reasons .card .point-illust{border:0;border-radius:0;background:#f7f7f7} #main_contents .elp #reasons .card-body{padding:18px 20px 22px} #main_contents .elp #reasons .card-body h3{font-size:16px;margin:4px 0 8px} #main_contents .elp #reasons .card-body p{font-size:14px;line-height:1.85} #main_contents .elp .point-no{font-size:11px;letter-spacing:.12em} @media (min-width:768px){ #main_contents .elp .cards{gap:28px} } #main_contents .elp #voices .card{padding:20px} #main_contents .elp #voices .card .pic{border-radius:8px;overflow:hidden} #main_contents .elp #voices .card-body h3{font-size:14px;line-height:1.6} #main_contents .elp #voices .card-body p{color:#555} #main_contents .elp #voices-sec .jl,#main_contents .elp #voices-sec .sec-body>.jl{justify-content:center;margin-top:28px} @media (min-width:768px){ #main_contents .elp #voices.cards.two{gap:28px} } #main_contents .elp .shindan .checks{gap:10px} #main_contents .elp .shindan .checks label{border:0;border-radius:10px;box-shadow:var(--tidy-shadow);padding:14px 14px 14px 48px} #main_contents .elp .shindan .checks label:has(input:checked){box-shadow:0 0 0 2px #49c0be,var(--tidy-shadow)} #main_contents .elp .shindan-btn{margin-top:28px} #main_contents .elp .shindan-result{border-radius:var(--tidy-r);border-width:0;box-shadow:0 0 0 2px #49c0be,var(--tidy-shadow);padding:28px 24px} #main_contents .elp .fit{gap:14px} #main_contents .elp .fit>div{border-radius:10px;padding:16px 18px} #main_contents .elp .jobcards,#main_contents .elp .steps,#main_contents .elp .points{gap:16px} #main_contents .elp .jobcards>li,#main_contents .elp .steps>li{padding:20px;display:flex;flex-direction:column} #main_contents .elp .points>li{padding:20px 20px 20px 60px} #main_contents .elp .points>li::before{left:18px;top:20px} #main_contents .elp .jobcards>li>.jl,#main_contents .elp .steps>li>.jl,#main_contents .elp .points>li>.jl{margin-top:auto;padding-top:14px} #main_contents .elp .jobcards h3,#main_contents .elp .steps h3,#main_contents .elp .points h3{font-size:16px;margin-bottom:6px} #main_contents .elp .jobcards p,#main_contents .elp .steps p,#main_contents .elp .points p,#main_contents .elp #reasons .card-body p,#main_contents .elp .prep p{color:#555;line-height:1.8} @media (min-width:768px){ #main_contents .elp .jobcards,#main_contents .elp .steps,#main_contents .elp .points{gap:24px} #main_contents .elp .points>li{padding:60px 22px 22px;display:flex;flex-direction:column} #main_contents .elp .points>li::before{left:22px;top:22px} } #main_contents .elp .memo{padding:16px 20px;margin-top:24px;color:#555;line-height:1.8} #main_contents .elp .stats{gap:12px} #main_contents .elp .stats li{padding:18px 12px} #main_contents .elp .stats b{font-size:32px} @media (min-width:768px){ #main_contents .elp .stats{gap:24px} #main_contents .elp .stats b{font-size:40px} #main_contents .elp .stats li{padding:24px 14px} } #main_contents .elp .src{margin-top:14px} #main_contents .elp .jl{gap:8px} #main_contents .elp .jl a{font-size:12px;padding:5px 14px 5px 12px;border-radius:99px;background:#fff;border:1px solid #9edcdb;color:#138d8b;transition:background .15s,border-color .15s} #main_contents .elp .jl a:hover{background:#e3f5f4;border-color:#49c0be} #main_contents .elp section .lp-block>.blk>.jl,#main_contents .elp .blk>.jl{justify-content:center;margin-top:24px} #main_contents .elp .search{gap:20px} #main_contents .elp .search input{border-radius:10px;border:1px solid #d9d9d9;box-shadow:inset 0 1px 2px rgba(0,0,0,.04)} #main_contents .elp .tag-list{justify-content:flex-start;gap:10px} #main_contents .elp .tag-list a{font-size:13px;padding:6px 16px} #main_contents .elp .jobs{gap:10px} #main_contents .elp .jobs a{border-radius:10px;box-shadow:var(--tidy-shadow);min-height:52px;padding:10px 18px;font-size:14px} @media (min-width:768px){ #main_contents .elp .jobs{column-gap:24px;row-gap:12px;max-width:none} #main_contents .elp .search input{max-width:none} } #main_contents .elp .prep{gap:20px} #main_contents .elp .prep>div{padding:22px 20px} #main_contents .elp .prep h3{font-size:16px} #main_contents .elp .prep table{font-size:13px} #main_contents .elp .prep th{background:#f3fbfb} #main_contents .elp #columns .col-card{overflow:hidden} #main_contents .elp #columns .col-card .card-body{padding:14px 16px 18px} #main_contents .elp #columns .col-card .card-body h3{font-size:14px;line-height:1.7} #main_contents .elp #columns .col-card a.whole:hover h3{color:#138d8b} #main_contents .elp .banners{max-width:760px;margin:0 auto;gap:20px} #main_contents .elp .banners img{border-radius:8px} #main_contents .elp .exp-link{margin:0 0 24px;font-size:14px} #main_contents .elp .exp-link:hover{color:#138d8b} #main_contents .elp .steps .no,#main_contents .elp .jobcards .tag-ok,#main_contents .elp .points>li .no{align-self:flex-start} #main_contents .elp{--tidy-pad:24px;--tidy-sec:64px;--tidy-head:36px;--tidy-card:24px;--tidy-gap:20px} @media (min-width:768px){ #main_contents .elp{--tidy-sec:112px;--tidy-head:56px;--tidy-card:28px;--tidy-gap:32px} } #main_contents .elp{line-height:1.95} #main_contents .elp .sec-title::after,#main_contents .elp .blk-title::after{margin-top:18px} #main_contents .elp .blk-lead{margin-top:calc(var(--tidy-head) * -0.3);line-height:1.9} #main_contents .elp .about-lead{gap:18px} @media (min-width:768px){ #main_contents .elp .about .inner{column-gap:72px} } #main_contents .elp .cards,#main_contents .elp .jobcards,#main_contents .elp .steps,#main_contents .elp .points,#main_contents .elp .stats,#main_contents .elp .fit,#main_contents .elp .prep,#main_contents .elp .shindan .checks{gap:var(--tidy-gap)} #main_contents .elp .jobcards>li,#main_contents .elp .steps>li{padding:var(--tidy-card)} #main_contents .elp .points>li{padding:var(--tidy-card) var(--tidy-card) var(--tidy-card) 64px} #main_contents .elp .points>li::before{top:var(--tidy-card)} @media (min-width:768px){ #main_contents .elp .points>li{padding:68px var(--tidy-card) var(--tidy-card)} #main_contents .elp .points>li::before{left:var(--tidy-card);top:var(--tidy-card)} } #main_contents .elp #reasons .card-body{padding:var(--tidy-card)} #main_contents .elp #voices .card{padding:var(--tidy-card);gap:16px} @media (min-width:768px){ #main_contents .elp #voices .card{gap:24px} } #main_contents .elp .jobcards h3,#main_contents .elp .steps h3,#main_contents .elp .points h3,#main_contents .elp #reasons .card-body h3{margin-bottom:10px} #main_contents .elp .steps .no,#main_contents .elp .jobcards .tag-ok{margin-bottom:12px} #main_contents .elp .jobcards>li>.jl,#main_contents .elp .steps>li>.jl,#main_contents .elp .points>li>.jl{padding-top:20px} #main_contents .elp .jl{gap:8px} #main_contents .elp .memo{margin-top:var(--tidy-gap);padding:22px var(--tidy-card)} #main_contents .elp section .lp-block>.blk>.jl,#main_contents .elp .blk>.jl,#main_contents .elp #voices-sec .jl{margin-top:32px} #main_contents .elp .shindan .checks label{padding:16px 18px 16px 50px} #main_contents .elp .shindan-btn{margin-top:36px} #main_contents .elp .shindan-result{margin-top:32px;padding:32px var(--tidy-card)} #main_contents .elp .stats li{padding:24px 14px} @media (min-width:768px){ #main_contents .elp .stats li{padding:32px 16px} } #main_contents .elp .src{margin-top:20px} #main_contents .elp .search{gap:28px} #main_contents .elp .tag-list{gap:12px} #main_contents .elp .jobs{gap:12px} #main_contents .elp .jobs a{min-height:58px;padding:12px 20px} @media (min-width:768px){ #main_contents .elp .jobs{column-gap:32px;row-gap:14px} } #main_contents .elp #jobs .sec-title{margin-top:24px} #main_contents .elp .prep>div{padding:var(--tidy-card)} #main_contents .elp .prep h3{margin-bottom:12px} #main_contents .elp .prep .tbl{margin-top:16px} #main_contents .elp .prep th,#main_contents .elp .prep td{padding:10px 12px} #main_contents .elp #columns .col-card .card-body{padding:16px 18px 22px} #main_contents .elp .banners{gap:28px} #main_contents .elp .exp-link{margin-bottom:32px} #main_contents .elp .prep table,#main_contents .elp table.lang{min-width:0;table-layout:auto} #main_contents .elp .prep th{white-space:normal} #main_contents .elp .prep th,#main_contents .elp .prep td{padding:14px 16px} @media (max-width:767px){ #main_contents .elp .prep th,#main_contents .elp .prep td{padding:12px 12px} #main_contents .elp .prep table{font-size:12px} } #main_contents .elp .jl a{padding:8px 18px 8px 16px;line-height:1.5} #main_contents .elp .steps .no,#main_contents .elp .jobcards .tag-ok{padding:4px 14px} #main_contents .elp .tag-list a{padding:8px 18px} #main_contents .elp .stats li{padding-inline:18px} @media (min-width:768px){ #main_contents .elp .stats li{padding-inline:20px} } #main_contents .elp .btn{padding:16px 40px} #main_contents .elp #job{padding-bottom:0} #main_contents .elp #jobs{padding-top:var(--tidy-head)} #main_contents .elp #jobs .sec-title{margin-top:0} #main_contents .elp h1,#main_contents .elp h2,#main_contents .elp h3,#main_contents .elp h4{font-weight:700} @media (min-width:768px){#main_contents .elp{font-size:13px}} /* ===== LPの外側 ===== */ .footer-line{border:1px solid #535353} .nm-mode-sp .footer-line{height:0;border:0} .breadcrumb ul{margin:0 auto;padding:13px 2px 23px;letter-spacing:.6px;line-height:1.9;word-break:break-all;list-style:none} .breadcrumb ul li{display:inline} .breadcrumb li::after{content:'>';color:#222;padding:0 3px} .breadcrumb li:last-child::after{content:''} .breadcrumb li .gradation{color:#49c0be} #contents-page-top{position:fixed;bottom:17%;right:12px;z-index:999} #contents-page-top a{display:block;position:relative;width:48px;height:48px;text-decoration:none;background-color:#1cb0ae;opacity:.6;border:1px solid #fff;border-radius:50%} #contents-page-top a:before{content:'';position:absolute;top:20px;right:17px;width:12px;height:12px;border:0;border-top:solid 2px #fff;border-right:solid 2px #fff;transform:rotate(-45deg)} @media (max-width:767px){ .pc_content,.pc-only{display:none} .breadcrumb{padding:0 4%} } @media (min-width:768px){ .sp_content,.sp-only{display:none} .breadcrumb ul{width:1024px;max-width:100%;padding:13px 2px} #contents-page-top{bottom:110px;right:calc((100vw - 1140px)/2)} } /* ===== 目次 ===== */ #main_contents .elp .nm-index{position:relative;z-index:5;max-width:1180px;margin:-24px auto 0;padding:0 16px;text-align:center; font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif} #main_contents .elp .nm-index-label{margin:0 0 12px;font-size:12px;font-weight:700;line-height:1;letter-spacing:.28em;color:#3cc3bd} #main_contents .elp .nm-index ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px} #main_contents .elp .nm-index li{margin:0;padding:0} #main_contents .elp .nm-index a{display:flex;align-items:center;justify-content:center;gap:8px;height:100%;min-height:46px;padding:8px 10px; border:1.5px solid #cdeeea;border-radius:999px;background:#fff;color:#1f3a4d;font-size:13px;font-weight:700;line-height:1.4;letter-spacing:.04em; text-decoration:none;box-shadow:0 4px 14px rgba(79,140,140,.08);transition:background .15s,border-color .15s} #main_contents .elp .nm-index a::after{content:"";flex-shrink:0;width:6px;height:6px;margin-top:-3px;border-right:2px solid #3cc3bd;border-bottom:2px solid #3cc3bd;transform:rotate(45deg)} #main_contents .elp .nm-index a:hover{background:#eefaf8;border-color:#3cc3bd} @media (min-width:900px){ #main_contents .elp .nm-index{margin-top:-58px} #main_contents .elp .nm-index ul{grid-template-columns:repeat(8,1fr);gap:10px} #main_contents .elp .nm-index a{min-height:50px;padding:8px 6px;font-size:13px;letter-spacing:.02em} #main_contents .elp .nm-index-label{font-size:13px;margin-bottom:14px} } #contents-page-top{opacity:0;visibility:hidden;transform:translateY(12px);pointer-events:none; transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s} #contents-page-top.is-show{opacity:1;visibility:visible;transform:none;pointer-events:auto; transition:opacity .45s ease,transform .45s ease,visibility 0s} #main_contents .elp .nm-side .nm-about-photo{margin-top:0} #main_contents .elp #job input[type="search"]{background-color:#fff} #main_contents .elp .nm-jobs{margin-top:32px} #main_contents .elp .uki-jobs{--uki-accent:#138d8b} /* ===== 表「プログラミング言語」 ===== */ #main_contents .elp .prep .tbl{padding:4px 4px 18px;margin-bottom:6px} #main_contents .elp table.lang{width:100%;border-collapse:separate;border-spacing:0;border:0;border-radius:14px;overflow:hidden;background:#fff; box-shadow:0 6px 22px rgba(79,140,140,.12)} #main_contents .elp table.lang th,#main_contents .elp table.lang td{border:0;border-bottom:1px solid #edf3f3;padding:15px 18px;background:#fff; font-size:13px;line-height:1.7;letter-spacing:.04em;vertical-align:middle} #main_contents .elp table.lang tbody tr:last-child th,#main_contents .elp table.lang tbody tr:last-child td{border-bottom:0} #main_contents .elp table.lang thead th{background:#f6f8f8;color:#7a8a8f;font-size:12px;font-weight:700;text-align:center;letter-spacing:.12em;padding:13px 12px} #main_contents .elp table.lang thead th:first-child{background:#eaf7f4;color:#9fcfc6} #main_contents .elp table.lang thead th:last-child{background:#f6f8f8;color:#7a8a8f} #main_contents .elp table.lang tbody th{background:#f1faf8;color:#1f3a4d;font-weight:700;white-space:nowrap} #main_contents .elp table.lang td{color:#4a5a62} #main_contents .elp table.lang td.lv{text-align:center;white-space:nowrap;color:#1d8f95;font-weight:700;font-size:12px} #main_contents .elp table.lang tr.is-easy td.lv{color:#fff} #main_contents .elp table.lang tr.is-easy td.lv span{background:#3cc3bd;border-radius:999px;padding:6px 14px;flex-direction:row;gap:6px} #main_contents .elp table.lang td.lv span{display:inline-flex;flex-direction:column;align-items:center;gap:4px} #main_contents .elp table.lang td.lv span::before{content:"";display:block;width:16px;height:16px;box-sizing:border-box} #main_contents .elp table.lang td.lv-easy span::before{border:2px solid #fff;border-radius:50%;width:16px;height:16px;box-shadow:inset 0 0 0 2px #3cc3bd,inset 0 0 0 4px #fff} #main_contents .elp table.lang td.lv-mid span::before{border:2.5px solid #3cc3bd;border-radius:50%} #main_contents .elp table.lang td.lv-hard{color:#7a8a8f} #main_contents .elp table.lang td.lv-hard span::before{width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-bottom:15px solid #b8c4c6} @media (max-width:767px){ #main_contents .elp table.lang th,#main_contents .elp table.lang td{padding:12px 10px;font-size:12.5px} #main_contents .elp table.lang tbody th{white-space:normal} } /* ===== 転職者の声 ===== */ #main_contents .elp #voices.cards {padding-top:22px;row-gap:44px} #main_contents .elp #voices.cards .card{position:relative;overflow:visible;background:#fff;border-radius:16px; box-shadow:var(--tidy-shadow);padding:46px 18px 20px;grid-template-columns:96px minmax(0,1fr);gap:14px} #main_contents .elp #voices.cards .card .pic{width:96px;border-radius:12px;overflow:hidden} #main_contents .elp #voices.cards .card .card-body{padding:0} #main_contents .elp #voices.cards .nm-voice-case{margin:0 0 4px;font-size:11px;font-weight:700;letter-spacing:.16em;color:#3cc3bd} #main_contents .elp #voices.cards .card-body h3{color:#1f3a4d;font-size:15px;line-height:1.65;letter-spacing:.06em;margin:0 0 8px} #main_contents .elp #voices.cards .card-body p{font-size:12.5px;line-height:1.9;color:#6b7b85} #main_contents .elp #voices.cards .card-body p.nm-voice-meta{margin-top:10px;padding-top:10px;border-top:1px dashed #d5ebe7;font-size:12px;color:#1d8f95;font-weight:700;letter-spacing:.06em} @media (min-width:768px){ #main_contents .elp #voices.cards .card{grid-template-columns:150px minmax(0,1fr);gap:22px;padding:34px 26px 22px} #main_contents .elp #voices.cards .card .pic{width:150px} #main_contents .elp #voices.cards .card-body h3{font-size:17px} #main_contents .elp #voices.cards .card-body p{font-size:13px} } /* ===== 3ステップ ===== */ #main_contents .elp .steps{gap:44px} #main_contents .elp .steps>li{position:relative;overflow:visible;background:#fff;border:0;border-radius:16px;box-shadow:var(--tidy-shadow)} #main_contents .elp .steps .no{display:flex;flex-direction:column;align-items:center;justify-content:center;width:58px;height:58px;padding:0;border-radius:50%; background:#e3f6f2;color:#1d9aa0;font-size:20px;font-weight:700;line-height:1;letter-spacing:.02em;font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN",sans-serif} #main_contents .elp .steps .no small{display:block;font-size:9px;letter-spacing:.14em;margin-bottom:3px;color:#3cc3bd} #main_contents .elp .steps h3{color:#1f3a4d} #main_contents .elp .steps>li:not(:last-child)::after{content:"";position:absolute;left:50%;bottom:-30px;width:14px;height:14px;margin-left:-7px; border-top:3px solid #3cc3bd;border-right:3px solid #3cc3bd;border-radius:2px;transform:rotate(135deg)} @media (min-width:768px){ #main_contents .elp .steps{gap:46px} #main_contents .elp .steps>li:not(:last-child)::after{left:auto;right:-30px;bottom:auto;top:50%;margin:-7px 0 0;transform:rotate(45deg)} } /* ===== MVの間隔 ===== */ #main_contents .elp .nm-mv-title{margin-top:8px;line-height:1.3} #main_contents .elp .nm-mv-sub{margin-top:16px;line-height:1.6} #main_contents .elp .nm-stats{margin-top:20px} #main_contents .elp .nm-stat{justify-content:center;gap:0} #main_contents .elp .nm-stat svg{display:block;margin:0 0 4px} #main_contents .elp .nm-stat-label{display:flex;align-items:center;justify-content:center;min-height:3em;line-height:1.5} #main_contents .elp .nm-stat-num{margin-top:4px;line-height:1.1} #main_contents .elp .nm-cta{margin-top:24px} @media (min-width:900px){ #main_contents .elp .nm-mv-title{margin-top:8px;line-height:1.3} #main_contents .elp .nm-mv-sub{margin-top:24px} #main_contents .elp .nm-stats{margin-top:24px} #main_contents .elp .nm-stat svg{margin-bottom:6px} #main_contents .elp .nm-stat-num{margin-top:6px} #main_contents .elp .nm-cta{margin-top:32px} } /* ===== 行間・余白 ===== */ #main_contents .elp :is(#reasons-sec, #voices-sec, section.sec) :is(p, li):not(.blk-en):not(.blk-lead):not(.src):not(.nm-voice-tag):not(.nm-voice-case):not(.nm-voice-meta){line-height:1.9} #main_contents .elp :is(#reasons-sec, #voices-sec, #wt, section.sec) h3,#main_contents .elp #voices.cards .card-body h3,#main_contents .elp #columns .col-card .card-body h3{line-height:1.6} #main_contents .elp .nm-about-lead .nm-txt{line-height:1.9} #main_contents .elp #about.nm-about{padding-top:64px;padding-bottom:64px} #main_contents .elp .nm-about-body{margin-top:36px} @media (min-width:900px){ #main_contents .elp #about.nm-about{padding-top:112px;padding-bottom:112px} #main_contents .elp .nm-about-body{margin-top:56px} } @media (min-width:900px) and (max-width:1279px){ #main_contents .elp .nm-mv-photo{left:auto;right:0} } /* ===== 最大幅1920px ===== */ #main_contents .elp .nm-mv::before{left:max(2%, calc(50% - 960px + 38px))} @media (min-width:1921px){ #main_contents .elp .nm-mv{background: radial-gradient(circle 320px at calc(50% - 806px) 30%,#fdf7c8 0 99%,transparent 100%), radial-gradient(circle 80px at calc(50% - 77px) 8%,#fbf3b5 0 98%,transparent 100%), linear-gradient(120deg,#f2fbf8 0%,#ffffff 40%,#eaf6f7 100%)} #main_contents .elp #about.nm-about{background-size:1920px auto;background-position:center bottom} #main_contents .elp section:has(#prepare){background-size:1920px auto,1920px auto;background-position:center top,center bottom} } @media (min-width:1360px){ #main_contents .elp .nm-mv-img{-webkit-mask-image:linear-gradient(90deg,transparent 0,transparent 40.6%,#000 53.7%,#000 90%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,transparent 40.6%,#000 53.7%,#000 90%,transparent 100%)} } /* ===== かんたん診断 ===== */ #main_contents .elp section:has(> .inner #check){position:relative;overflow:hidden;background:#fff} #main_contents .elp section:has(> .inner #check) > .inner{max-width:1008px;width:auto} #main_contents .elp section:has(> .inner #check) .lp-block{grid-template-columns:minmax(0,1fr)} #main_contents .elp .nm-check .nm-ck-txt{min-width:0} #main_contents .elp .nm-check{min-width:0} #main_contents .elp .nm-check .shindan .checks{gap:12px} #main_contents .elp .nm-check .shindan .checks label{display:flex;align-items:center;gap:14px;min-height:78px;padding:14px 18px 14px 54px;border-radius:12px;background:#fff; border:1.5px solid transparent;box-shadow:0 6px 20px rgba(79,140,140,.10);font-size:14px;line-height:1.75;letter-spacing:.06em;color:#3f5059} #main_contents .elp .nm-check .shindan .checks label::before{left:18px;width:22px;height:22px;margin-top:-11px;border:1.5px solid #c3cdd0;border-radius:4px} #main_contents .elp .nm-check .shindan .checks label:has(input:checked){background:#f2fbf9;border-color:#3cc3bd!important;box-shadow:0 6px 20px rgba(79,140,140,.12)} #main_contents .elp .nm-check .shindan .checks label:has(input:checked)::before{background:#3cc3bd;border-color:#3cc3bd} #main_contents .elp .nm-check .shindan .checks label:has(input:checked)::after{left:26px;margin-top:-8px} #main_contents .elp .nm-check .shindan .checks label:has(input:checked) .nm-ck-txt{color:#1f3a4d;font-weight:700} #main_contents .elp .nm-ico{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:50px;height:50px;border-radius:50%} #main_contents .elp .nm-ico svg{width:28px;height:28px;fill:none;stroke:#3f5059;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round} #main_contents .elp .nm-ico-y{background:#fdf6d8} #main_contents .elp .nm-ico-b{background:#e5f4f7} #main_contents .elp .nm-ico-p{background:#fde9ea} #main_contents .elp .nm-ico-g{background:#edf6e6} #main_contents .elp .nm-ck-txt br{display:none} #main_contents .elp .nm-check .shindan-result{margin-top:28px;padding:32px 20px 28px;border:0;border-radius:20px;text-align:center; background:#f6fbfa;box-shadow:0 8px 28px rgba(79,140,140,.08)} #main_contents .elp .nm-res-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px} #main_contents .elp .nm-check .res-label{display:inline-block;padding:4px 20px;border-radius:999px;background:#d3efe9;color:#1d8f95;font-size:12px;letter-spacing:.14em} #main_contents .elp .nm-check .res-title{margin:0;font-size:19px;letter-spacing:.1em;color:#1f3a4d} #main_contents .elp .nm-check .res-text{max-width:660px;margin:14px auto 0;text-align:center;font-size:13.5px;line-height:1.9;color:#5b6b73} #main_contents .elp .nm-check .res-fit{margin-top:22px;padding-top:0;border-top:0} #main_contents .elp .nm-check .res-fit-label{display:flex;align-items:center;gap:14px;margin:0 0 16px;color:#1f3a4d;font-size:13px} #main_contents .elp .nm-check .res-fit-label::before,#main_contents .elp .nm-check .res-fit-label::after{content:"";flex:1;height:1px;background:#cfe4df} #main_contents .elp .nm-check .fit{gap:14px} #main_contents .elp .nm-check .fit>div{display:flex;align-items:center;gap:14px;padding:18px 18px 0;border-radius:14px;text-align:left;overflow:hidden} #main_contents .elp .nm-check .fit>div.nm-fit-y{background:#fdf8e4} #main_contents .elp .nm-check .fit>div.nm-fit-g{background:#e6f5f1} #main_contents .elp .nm-fit-illust{flex-shrink:0;display:block;width:96px;height:auto;margin-bottom:18px} #main_contents .elp .nm-fit-body{flex:1;padding-bottom:18px} #main_contents .elp .nm-check .fit h3{margin:0 0 6px;font-size:15px;color:#1f3a4d} #main_contents .elp .nm-check .fit p{font-size:13px;line-height:1.85;color:#5b6b73} #main_contents .elp .nm-check .fit .more{display:block;margin-top:6px;font-size:13px;font-weight:700;color:#1d9aa0;text-decoration:none} #main_contents .elp .nm-check .fit .more::after{content:"→";display:inline-block;margin-left:10px} @media (max-width:767px){ #main_contents .elp .nm-check .res-title{font-size:17px} #main_contents .elp .nm-check .shindan-result{padding:28px 16px 24px} #main_contents .elp .nm-check .fit>div{padding:16px 14px 0 10px;gap:10px} #main_contents .elp .nm-fit-illust{width:72px} #main_contents .elp .nm-fit-body{padding-bottom:16px} } @media (min-width:768px){ #main_contents .elp .nm-ck-txt br{display:inline} #main_contents .elp .nm-check .shindan .checks{gap:16px 20px} #main_contents .elp .nm-check .shindan-result{padding:36px 40px 32px} #main_contents .elp .nm-check .res-title{font-size:22px} #main_contents .elp .nm-check .fit{gap:20px} #main_contents .elp .nm-check .fit>div{padding:22px 26px 0 18px;gap:20px} #main_contents .elp .nm-fit-illust{width:140px} #main_contents .elp .nm-fit-body{padding-bottom:22px} #main_contents .elp .nm-check .fit h3{font-size:16px} } /* ===== 仕事ざっくり早わかり ===== */ #main_contents .elp #guide .jobcards>li{border-radius:16px} #main_contents .elp .nm-jc-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:10px} #main_contents .elp .nm-jc-head .nm-ico{width:56px;height:56px} #main_contents .elp .nm-jc-head .nm-ico svg{width:30px;height:30px} #main_contents .elp .nm-jc-head>div{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start} #main_contents .elp #guide .jobcards h3{margin:0;font-size:18px;line-height:1.5;color:#1f3a4d} #main_contents .elp #guide .jobcards .nm-jc-head>div>h3:only-child{margin-top:14px} #main_contents .elp #guide .jobcards .tag-ok{display:inline-flex;align-items:center;gap:5px;margin:0 0 6px;padding:3px 12px 3px 8px;background:#fff;font-size:11px;letter-spacing:.04em} #main_contents .elp #guide .jobcards .tag-ok::before{content:"";width:11px;height:13px;flex-shrink:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 13'%3E%3Cpath d='M5.5 3 L1 .5 V9 L5.5 12.5Z' fill='%23f2c230'/%3E%3Cpath d='M5.5 3 L10 .5 V9 L5.5 12.5Z' fill='%2349c0be'/%3E%3C/svg%3E") center/contain no-repeat} #main_contents .elp #guide .jobcards>li>.jl{position:relative;margin-top:auto;padding:14px 32px 0 0;border-top:1px solid #edf3f3} #main_contents .elp #guide .jobcards>li>.jl::after{content:"›";position:absolute;right:0;top:50%;margin-top:-4px;width:22px;height:22px;border-radius:50%;background:#49c0be;color:#fff; font-size:15px;line-height:20px;text-align:center} #main_contents .elp #guide .jobcards .jl::before{color:#3f5059} #main_contents .elp #guide .jobcards .jl a{color:#138d8b} #main_contents .elp .nm-jc-memo{display:flex;flex-direction:column;align-items:center;gap:16px;border:1.5px solid #bfe6e1;border-radius:16px;box-shadow:none} #main_contents .elp .nm-jc-memo p{margin:0} #main_contents .elp .nm-jc-memo .btn{flex-shrink:0} @media (min-width:768px){ #main_contents .elp .nm-jc-memo{flex-direction:row;justify-content:space-between;gap:28px;padding:24px 28px} } /* ===== 3ステップ ===== */ #main_contents .elp #step .steps h3{font-size:18px;line-height:1.6;margin-top:4px} #main_contents .elp #step .steps>li>.jl{flex-direction:column;align-items:flex-start;gap:8px} #main_contents .elp .nm-step-memo{display:flex;flex-direction:column;align-items:center;gap:12px;background:#f6fbfa;box-shadow:none} #main_contents .elp .nm-step-memo p{margin:0} #main_contents .elp .nm-step-memo .nm-ico{width:52px;height:52px} #main_contents .elp .nm-step-memo .nm-ico svg{width:30px;height:30px} @media (min-width:768px){ #main_contents .elp .nm-step-memo{flex-direction:row;gap:22px;padding:22px 32px} } /* ===== 丸いリンクボタン ===== */ #main_contents .elp .jl a{display:inline-flex;align-items:center;gap:12px;padding-left:18px;padding-right:16px} #main_contents .elp .jl a::before{content:none} #main_contents .elp .jl a::after{content:"›";flex-shrink:0;margin-left:auto;font-weight:700;font-size:1.25em;line-height:1} #main_contents .elp .jobcards .jl a{display:inline;padding:0} #main_contents .elp .jobcards .jl a::after{content:none} /* ===== イラストを入れる ===== */ #main_contents .elp .nm-step-top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px;border-bottom:1px solid #edf3f3} #main_contents .elp .nm-step-top .no{align-self:center;margin-bottom:0} #main_contents .elp .nm-step-illust{display:block;width:auto;height:110px;margin-right:4px} #main_contents .elp .nm-jc-memo-illust{display:block;flex-shrink:0;width:72px;height:auto} @media (min-width:768px){ #main_contents .elp .nm-step-illust{height:120px} #main_contents .elp .nm-jc-memo-illust{width:84px;margin:-6px 0 -24px} } /* ===== 3つのポイント ===== */ #main_contents .elp .points>li{padding:var(--tidy-card);border-radius:16px} #main_contents .elp .points>li::before{content:"POINT";left:var(--tidy-card);top:var(--tidy-card);width:58px;height:58px;box-sizing:border-box;padding-top:12px; display:block;text-align:center;border-radius:50%;background:#e3f6f2;color:#3cc3bd; font-size:9px;font-weight:700;line-height:1;letter-spacing:.14em} #main_contents .elp .points>li::after{content:counter(pt, decimal-leading-zero);position:absolute;left:var(--tidy-card);top:calc(var(--tidy-card) + 23px);width:58px;text-align:center; color:#1d9aa0;font-size:20px;font-weight:700;line-height:1;letter-spacing:.02em} #main_contents .elp .points h3{font-size:18px;line-height:1.6;color:#1f3a4d;margin-bottom:18px; min-height:58px;padding-left:76px;display:flex;flex-wrap:wrap;align-content:center} #main_contents .elp .points h3 em{font-style:normal;color:#1d9aa0} #main_contents .elp .points>li>.jl{flex-direction:column;align-items:stretch;gap:8px} #main_contents .elp .points>li>.jl a{display:flex;width:100%} /* ===== 求人を探す・職種から探す ===== */ #main_contents .elp .nm-search{position:relative;display:flex;align-items:center;max-width:960px;margin:0 auto;padding:6px;border-radius:999px;background:#fff;box-shadow:0 6px 20px rgba(79,140,140,.12)} #main_contents .elp .nm-search-ico{position:absolute;left:22px;top:50%;width:22px;height:22px;margin-top:-11px;fill:none;stroke:#3cc3bd;stroke-width:2;stroke-linecap:round} #main_contents .elp #job .nm-search input[type="search"]{flex:1;min-width:0;height:48px;max-width:none;border:0;box-shadow:none;border-radius:999px;padding:0 12px 0 48px;font-size:14px;background:transparent} #main_contents .elp #job .nm-search input[type="search"]:focus{outline:none} #main_contents .elp #job .nm-search input[type="search"]::-webkit-search-cancel-button{cursor:pointer} #main_contents .elp .nm-search:focus-within{box-shadow:0 0 0 2px #49c0be,0 6px 20px rgba(79,140,140,.12)} #main_contents .elp .nm-search .btn{flex-shrink:0;border:0;cursor:pointer;font-family:inherit;min-height:48px;padding:0 22px} #main_contents .elp .nm-tags{display:flex;flex-direction:column;gap:10px;max-width:960px;margin:0 auto;width:100%} #main_contents .elp .nm-tags-label{margin:0;font-size:13px;font-weight:700;color:#1f3a4d;letter-spacing:.06em;white-space:nowrap} #main_contents .elp #job .tag-list a{background:#fff;border:1px solid #9edcdb;color:#138d8b;font-weight:700} #main_contents .elp #job .tag-list a:hover{background:#eefaf8!important} #main_contents .elp #jobs .jobs a{gap:14px;padding:10px 16px 10px 10px;border-radius:12px} #main_contents .elp #jobs .jobs .nm-ico{width:44px;height:44px} #main_contents .elp #jobs .jobs .nm-ico svg{width:24px;height:24px} #main_contents .elp #jobs .jobs a::after{border-color:#49c0be} @media (min-width:768px){ #main_contents .elp .nm-search{padding:7px 7px 7px 6px} #main_contents .elp #job .nm-search input[type="search"]{height:52px;font-size:15px;padding-left:54px} #main_contents .elp .nm-search .btn{min-height:52px;padding:0 34px} #main_contents .elp .nm-tags{flex-direction:row;align-items:flex-start;gap:20px} #main_contents .elp .nm-tags-label{padding-top:9px} } @media (max-width:767px){ #main_contents .elp .nm-search .btn{padding:0 16px;font-size:13px} #main_contents .elp #job .nm-search input[type="search"]{font-size:13px} } #main_contents .elp .nm-search{width:100%;box-sizing:border-box} #main_contents .elp #job .search{justify-items:stretch} @media (max-width:767px){ #main_contents .elp #jobs .jobs a{flex-wrap:wrap;row-gap:0} #main_contents .elp #jobs .jobs a{display:grid;grid-template-columns:44px minmax(0,1fr) 12px;column-gap:12px;align-items:center} #main_contents .elp #jobs .jobs .nm-ico{grid-row:1 / span 2} #main_contents .elp #jobs .jobs .cnt{grid-column:2;margin:0;font-size:12px} #main_contents .elp #jobs .jobs a::after{grid-column:3;grid-row:1 / span 2;margin-left:0} } #main_contents .elp #jobs .jobs li.nm-zero,#main_contents .elp #jobs .jobs li:not(:has(.cnt)){display:none} /* ===== 数字で見る・応募前の準備・コラム ===== */ #main_contents .elp .stats li{border-radius:16px;padding:22px 16px 18px} #main_contents .elp .stats a{grid-template-columns:auto auto;justify-content:center;align-items:center;column-gap:12px;row-gap:8px} #main_contents .elp .stats .nm-stat-ico{width:52px;height:52px} #main_contents .elp .stats .nm-stat-ico svg{width:28px;height:28px} #main_contents .elp .stats b{color:#138d8b;text-align:left} #main_contents .elp .stats span{grid-column:1 / -1;color:#3f5059} #main_contents .elp .stats em{grid-column:1 / -1;margin-top:4px;padding:9px 12px;border-radius:999px;background:#e8f7f4;color:#138d8b;font-size:12px} #main_contents .elp .nm-jobs-box{margin-top:32px;padding:20px 16px 18px;border-radius:20px;background:#fff;box-shadow:0 6px 22px rgba(79,140,140,.10)} #main_contents .elp .nm-jobs-box .nm-jobs{margin-top:0} #main_contents .elp .nm-prep-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:12px} #main_contents .elp .nm-prep-no{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:#e3f6f2;color:#1d9aa0;font-size:20px;font-weight:700;letter-spacing:.02em} #main_contents .elp .nm-prep-lead{margin:2px 0 2px!important;font-size:12px!important;font-weight:700;color:#1d9aa0!important;letter-spacing:.08em} #main_contents .elp .prep .nm-prep-head h3{margin:0;font-size:18px;line-height:1.6;color:#1f3a4d} #main_contents .elp .prep>div{border-radius:16px} #main_contents .elp .nm-prep-words{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:12px} #main_contents .elp .nm-prep-words li{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:700;color:#3f5059;letter-spacing:.04em} #main_contents .elp .nm-prep-words .nm-ico{width:56px;height:56px} #main_contents .elp #columns .col-card{border-radius:16px} #main_contents .elp #columns .col-card .card-body{position:relative;padding:16px 18px 54px} #main_contents .elp #columns .col-card .card-body h3{font-size:15px!important;color:#1f3a4d} #main_contents .elp #columns .col-card .card-body p{margin:8px 0 0;font-size:12.5px;line-height:1.8;color:#6b7b85} #main_contents .elp #columns .col-card .card-body::after{content:"›";position:absolute;right:16px;bottom:14px;width:30px;height:30px;border-radius:50%;background:#e8f7f4;color:#1d9aa0; font-size:18px;font-weight:700;line-height:28px;text-align:center} #main_contents .elp #columns .col-card a.whole:hover .card-body::after{background:#49c0be;color:#fff} @media (min-width:768px){ #main_contents .elp .nm-jobs-box{padding:28px 28px 24px} #main_contents .elp .prep>div:first-child{position:relative;padding-right:290px} #main_contents .elp .prep>div:first-child .nm-prep-words{position:absolute;right:28px;top:50%;width:240px;transform:translateY(-50%);margin:0;justify-content:center;gap:16px 20px} #main_contents .elp .nm-prep-head{gap:20px} } #main_contents .elp .stats li>a{display:grid;grid-template-columns:auto auto} #main_contents .elp .stats .nm-stat-ico{grid-column:1;grid-row:1} #main_contents .elp .stats li>a>b{grid-column:2;grid-row:1} #main_contents .elp .prep .nm-prep-head h3{border-left:0;padding-left:0} #main_contents .elp .prep .nm-prep-head h3::before{content:none} @media (min-width:768px){ #main_contents .elp .prep>div:first-child .nm-prep-words{display:grid;grid-template-columns:repeat(2,auto);justify-content:center;gap:14px 28px} } #main_contents .elp .stats li>a>b{font-weight:700;white-space:nowrap} @media (max-width:767px){ #main_contents .elp .stats li{padding:16px 10px 14px} #main_contents .elp .stats li>a{grid-template-columns:1fr;justify-items:center} #main_contents .elp .stats .nm-stat-ico{grid-column:1;grid-row:1;width:40px;height:40px} #main_contents .elp .stats .nm-stat-ico svg{width:22px;height:22px} #main_contents .elp .stats li>a>b{grid-column:1;grid-row:2;text-align:center;font-size:30px} #main_contents .elp .stats em{font-size:11px;padding:8px 6px;line-height:1.5} } /* ===== 目次・ITエンジニアとは・3つの理由 ===== */ #main_contents .elp .nm-index{max-width:1060px} #main_contents .elp .nm-index ul{background:#fff;border-radius:20px;box-shadow:0 8px 26px rgba(79,140,140,.12);padding:22px 10px 16px;grid-template-columns:repeat(4,1fr);gap:14px 0} #main_contents .elp .nm-index-label{position:relative;z-index:1;margin-bottom:-8px} #main_contents .elp .nm-index li{display:flex} #main_contents .elp .nm-index a{flex:1;flex-direction:column;justify-content:flex-start;gap:6px;min-height:0;padding:4px 6px;border:0;border-radius:0;box-shadow:none;background:none;font-size:12px} #main_contents .elp .nm-index a::after{margin-top:2px} #main_contents .elp .nm-index a:hover .nm-ico{box-shadow:0 0 0 2px #bfe6e1} #main_contents .elp .nm-index .nm-ico{width:40px;height:40px} #main_contents .elp .nm-index .nm-ico svg{width:22px;height:22px} @media (min-width:900px){ #main_contents .elp .nm-index ul{grid-template-columns:repeat(8,1fr);padding:24px 10px 18px} #main_contents .elp .nm-index li+li{border-left:1px solid #e7f1ef} #main_contents .elp .nm-index a{font-size:13px} } #main_contents .elp .nm-about-lead{text-align:center;justify-items:center} #main_contents .elp .nm-about-lead .nm-q{display:inline-block;padding:10px 24px;border-radius:999px;background:#fff;box-shadow:0 4px 16px rgba(79,140,140,.12);font-size:15px} #main_contents .elp .nm-about-lead .nm-txt{margin-top:6px;font-size:14px;color:#5b6b73} #main_contents .elp .nm-em-box{display:flex;align-items:center;gap:16px;margin-top:6px;padding:18px 22px;border-radius:18px;background:#fff;box-shadow:0 6px 22px rgba(79,140,140,.12);text-align:left} #main_contents .elp .nm-em-box .nm-ico{width:52px;height:52px} #main_contents .elp .nm-em-box .nm-ico svg{width:30px;height:30px} #main_contents .elp .nm-em-box .nm-em{margin:0} #main_contents .elp .nm-mark{color:#138d8b;background:linear-gradient(transparent 62%,#fdf0a8 62%)} @media (min-width:900px){ #main_contents .elp .nm-about-lead .nm-q{font-size:17px;padding:12px 30px} #main_contents .elp .nm-em-box{padding:22px 32px;gap:22px} } #main_contents .elp #reasons .card{position:relative;border-radius:16px} #main_contents .elp #reasons .point-no{position:absolute;left:14px;top:14px;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;width:58px;height:58px;padding:0; border-radius:50%;clip-path:none;background:#e3f6f2;color:#1d9aa0;font-size:0;letter-spacing:0} #main_contents .elp #reasons .point-no::before{content:"POINT";font-size:9px;letter-spacing:.14em;color:#3cc3bd;line-height:1} #main_contents .elp #reasons .point-no::after{content:attr(data-no);font-size:20px;line-height:1.1;margin-top:3px} #main_contents .elp #reasons .card-body h3{color:#1f3a4d;text-align:left;font-size:18px} #main_contents .elp .nm-em-box{width:100%;box-sizing:border-box} #main_contents .elp #reasons .card .point-illust{padding-top:30px} #main_contents .elp .nm-about-lead .nm-em-box{justify-self:stretch} @media (max-width:899px){ #main_contents .elp .nm-index a{font-size:11px;letter-spacing:0;padding:4px 2px;word-break:keep-all;overflow-wrap:anywhere} } #main_contents .elp .nm-step-illust{max-width:calc(100% - 76px);object-fit:contain;object-position:right bottom} #main_contents .elp .nm-check .nm-fit-illust{width:96px;height:96px;object-fit:contain;object-position:center bottom;align-self:center;margin-bottom:16px} @media (min-width:768px){ #main_contents .elp .nm-check .nm-fit-illust{width:140px;height:140px;margin-bottom:22px} } #main_contents .elp #voices.cards{padding-top:0} #main_contents .elp #voices.cards .card{padding-top:22px} @media (min-width:768px){ #main_contents .elp #voices.cards .card{padding-top:26px} } #main_contents .elp .nm-step-illust{width:150px;height:110px;max-width:none;object-fit:contain;object-position:center bottom} @media (min-width:768px){ #main_contents .elp .nm-step-illust{width:160px;height:120px} } #main_contents .elp .nm-jobs-box{padding:0;background:none;box-shadow:none;border-radius:0} /* ===== 人気のキーワード ===== */ #main_contents .elp #job .tag-list a{border-radius:999px} /* ===== 本文の最大幅1280px ===== */ @media (min-width:900px){ #main_contents .elp .inner,#main_contents .elp section:has(> .inner #check) > .inner{max-width:1280px;width:auto;padding-inline:24px} #main_contents .elp .lp-block,#main_contents .elp .nm-search,#main_contents .elp .nm-tags{max-width:none} #main_contents .elp .nm-about-in{max-width:1232px} #main_contents .elp .nm-index{max-width:1280px;padding:0 24px} #main_contents .elp .jobs{max-width:none} #main_contents .elp .nm-about-body{grid-template-columns:280px minmax(0,1fr) 280px;column-gap:48px} #main_contents .elp .nm-about-photo{width:280px;height:280px} #main_contents .elp .nm-about-lead{max-width:none} #main_contents .elp .nm-step-memo,#main_contents .elp .nm-jc-memo{padding:26px 36px} } /* ===== かんたん診断 ===== */ #main_contents .elp .nm-res-empty{display:none} @media (min-width:900px){ #main_contents .elp .nm-check-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start} #main_contents .elp .nm-check .shindan{padding:12px 32px 32px;border-radius:20px;background:#fff;box-shadow:0 6px 22px rgba(79,140,140,.10)} #main_contents .elp .nm-check .shindan .checks{grid-template-columns:1fr;gap:0} #main_contents .elp .nm-check .shindan .checks label{min-height:0;padding:18px 8px 18px 46px;border:0;border-bottom:1px solid #e7efee;border-radius:0;box-shadow:none!important;background:none!important} #main_contents .elp .nm-check .shindan .checks label::before{left:8px} #main_contents .elp .nm-check .shindan .checks label:has(input:checked)::after{left:16px} #main_contents .elp .nm-check .shindan .checks label .nm-ico{display:none} #main_contents .elp .nm-check .nm-ck-txt br{display:none} #main_contents .elp .nm-check .shindan-btn{margin-top:28px} #main_contents .elp .nm-check .shindan-btn .btn{width:100%;max-width:none} #main_contents .elp .nm-res-col{position:sticky;top:90px} #main_contents .elp .nm-res-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:420px;padding:32px;border:2px dashed #cfe4df;border-radius:20px;text-align:center; color:#6b7b85;font-size:14px;line-height:1.9;letter-spacing:.06em} #main_contents .elp .nm-res-empty p{margin:0} #main_contents .elp .nm-res-empty .nm-ico{width:60px;height:60px} #main_contents .elp .nm-res-empty .nm-ico svg{width:32px;height:32px} #main_contents .elp .nm-res-col:has(.shindan-result:not([hidden])) .nm-res-empty{display:none} #main_contents .elp .nm-check .shindan-result{margin-top:0;padding:28px 26px 26px} #main_contents .elp .nm-check .fit{grid-template-columns:1fr;gap:14px} #main_contents .elp .nm-check .fit>div{padding:16px 20px 0 12px} #main_contents .elp .nm-check .nm-fit-illust{width:110px;height:110px;margin-bottom:16px} #main_contents .elp .nm-check .nm-fit-body{padding-bottom:16px} } /* ===== 転職者の声 ===== */ #main_contents .elp #voices.cards .card{display:flex;flex-direction:column;gap:0;padding:var(--tidy-card)} #main_contents .elp #voices.cards .card .pic{width:100%;aspect-ratio:4/3;border-radius:12px;overflow:hidden} #main_contents .elp #voices.cards .card .pic img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block} #main_contents .elp #voices.cards .card .card-body{padding:14px 2px 0;display:flex;flex-direction:column;flex:1} #main_contents .elp #voices.cards .card-body h3{font-size:16px;line-height:1.6;margin-bottom:6px} #main_contents .elp #voices.cards .card-body p.nm-voice-meta{margin-top:auto;padding-top:10px} @media (min-width:768px){ #main_contents .elp #voices.cards.two{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px} } @media (max-width:767px){ #main_contents .elp #voices.cards{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:-16px;padding:4px 16px 14px} #main_contents .elp #voices.cards::-webkit-scrollbar{display:none} #main_contents .elp #voices.cards>.card{flex:0 0 78%;scroll-snap-align:center} #main_contents .elp .dots[data-for="voices"]{display:flex} #main_contents .elp .dots[data-for="voices"] button.on{background:#49c0be} } #main_contents .elp #columns .col-card .card-body::after{content:none} #main_contents .elp #columns .col-card .card-body{padding-bottom:20px} #main_contents .elp .nm-check-lead{margin:0 0 12px;font-size:14px;font-weight:700;color:#1f3a4d;letter-spacing:.06em;text-align:center} @media (min-width:900px){ #main_contents .elp .nm-check .shindan{padding-top:26px} #main_contents .elp .nm-check-lead{margin:0 0 6px;padding:0 8px 14px;text-align:left;border-bottom:1px solid #e7efee} } #main_contents .elp #voices.cards .card-body p:not([class]){margin:0;font-size:12.5px;line-height:1.85!important} #main_contents .elp #voices.cards .card-body p.nm-voice-meta{margin-top:auto} /* ===== 仕事早わかり ===== */ #main_contents .elp #guide .jobcards>li{border:0;box-shadow:var(--tidy-shadow);border-radius:16px} #main_contents .elp #guide .nm-jc-head .nm-ico{background:#f3f7cf} #main_contents .elp #guide .jobcards>li>.jl{padding:12px 0 0;border-top:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px} #main_contents .elp #guide .jobcards>li>.jl::before{content:none} #main_contents .elp #guide .jobcards>li>.jl::after{content:none} #main_contents .elp #guide .jobcards .jl li{display:block} #main_contents .elp #guide .jobcards .jl li+li::before{content:none} #main_contents .elp #guide .jobcards .jl a{display:inline-block;color:#1d9aa0;font-size:13px;font-weight:700;text-decoration:none;line-height:1.6} #main_contents .elp #guide .jobcards .jl a::after{content:"›";display:inline-block;margin-left:10px;font-size:1.2em;line-height:1;vertical-align:-.06em;text-decoration:none} #main_contents .elp #guide .jobcards .jl a:hover{text-decoration:underline;text-underline-offset:3px} /* ===== 3ステップ ===== */ #main_contents .elp .nm-steps2-side{padding:28px 24px;border-radius:24px;background:linear-gradient(160deg,#e8f7f2 0%,#f4f9e4 100%);margin-bottom:24px} #main_contents .elp .nm-steps2-illust{display:block;width:220px;max-width:100%;height:auto;margin:20px auto 0} #main_contents .elp .nm-steps2-side .jl{margin-top:20px} #main_contents .elp .nm-steps2-side .jl li{width:100%} #main_contents .elp .nm-steps2-side .jl a{width:100%;background:#fff} #main_contents .elp .nm-steps2 .steps{grid-template-columns:1fr;gap:20px} #main_contents .elp .nm-steps2 .steps>li::after{content:none} #main_contents .elp .nm-steps2 .nm-step-illust{display:none} #main_contents .elp .nm-steps2 .nm-step-top{border-bottom:0;margin-bottom:0} #main_contents .elp .nm-steps2 .steps>li>.jl{flex-direction:row!important;flex-wrap:wrap;gap:8px;padding-top:14px} @media (min-width:900px){ #main_contents .elp .nm-steps2{display:grid;grid-template-columns:400px minmax(0,1fr);gap:40px;align-items:stretch} #main_contents .elp .nm-steps2-side{margin-bottom:0;padding:44px 40px;display:flex;flex-direction:column} #main_contents .elp .nm-steps2-illust{width:280px;margin:auto auto 0;padding-top:24px} #main_contents .elp .nm-steps2-side .jl{margin-top:28px} #main_contents .elp .nm-steps2 .steps>li{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:32px;padding:var(--tidy-card)} #main_contents .elp .nm-steps2 .steps>li>*{grid-column:2} #main_contents .elp .nm-steps2 .steps>li>.nm-step-top{grid-column:1;grid-row:1 / span 3;align-self:start} #main_contents .elp .nm-steps2 .steps h3{margin-top:0!important} #main_contents .elp .nm-steps2 .steps .no{width:72px;height:72px;font-size:26px} } #main_contents .elp .points>li>.jl{display:grid;grid-template-columns:1fr 1fr;gap:8px} #main_contents .elp .points>li>.jl li{min-width:0} #main_contents .elp .points>li>.jl a{width:100%;padding:8px 10px 8px 12px;gap:6px;letter-spacing:0;white-space:nowrap} #main_contents .elp .nm-prep2 .prep{grid-template-columns:1fr;margin:0} #main_contents .elp .nm-prep2 .prep>div:first-child{padding-right:var(--tidy-card)} #main_contents .elp .nm-prep2 .prep>div:first-child .nm-prep-words{position:static!important;transform:none!important;width:auto!important;display:flex!important;flex-wrap:wrap;justify-content:flex-start!important;margin-top:16px!important} #main_contents .elp .nm-res-empty-illust{display:block;width:260px;max-width:80%;height:auto} #main_contents .elp .nm-steps2-side .nm-step-memo{flex-direction:column;align-items:flex-start;gap:10px;margin:20px 0 0;padding:18px;background:rgba(255,255,255,.75);border-radius:16px} #main_contents .elp .nm-steps2-side .nm-step-memo p{font-size:13px;line-height:1.9} #main_contents .elp .nm-steps2-side .nm-step-memo .nm-ico{width:40px;height:40px} #main_contents .elp .nm-steps2-side .nm-side-links{display:flex;flex-direction:column;gap:8px;margin-top:16px;justify-content:flex-start} #main_contents .elp .nm-steps2-side .nm-side-links li{width:100%} #main_contents .elp .nm-steps2-side .nm-side-links a{width:100%;background:#fff} @media (min-width:900px){ #main_contents .elp .nm-steps2-side .nm-steps2-illust{margin:24px auto 0;padding-top:0} } @media (min-width:900px){ #main_contents .elp .nm-check-grid{align-items:stretch} #main_contents .elp .nm-res-col{position:static;display:flex;flex-direction:column} #main_contents .elp .nm-res-empty{flex:1;min-height:0} #main_contents .elp .nm-res-col .shindan-result{flex:1} #main_contents .elp .nm-check .shindan{display:flex;flex-direction:column} #main_contents .elp .nm-check .shindan-btn{margin-top:auto;padding-top:24px} } #main_contents .elp .nm-prep-2col .nm-prep-words{display:grid!important;grid-template-columns:repeat(2,auto);justify-content:start;gap:14px 24px!important;margin-top:16px!important} @media (min-width:900px){ #main_contents .elp .nm-prep-2col{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center} #main_contents .elp .nm-prep-2col .nm-prep-words{margin-top:0!important} } #main_contents .elp .nm-prep2 .prep>div:first-child .nm-prep-2col .nm-prep-words{display:grid!important;grid-template-columns:repeat(2,auto)!important;flex-wrap:nowrap} #main_contents .elp .nm-steps2-side .nm-side-title{display:block;margin:0;text-align:left;font-size:22px;line-height:1.5} #main_contents .elp .nm-steps2-side .nm-side-title::after{width:100%;margin-left:0} #main_contents .elp .nm-steps2-side .nm-side-title br{display:none} @media (min-width:900px){ #main_contents .elp .nm-steps2-side .nm-side-title{font-size:26px} } #main_contents .elp .nm-steps2-side .nm-side-title br{display:inline} #main_contents .elp .nm-steps2-side .nm-side-title{word-break:keep-all;overflow-wrap:anywhere} @media (min-width:900px){ #main_contents .elp .nm-steps2-side .nm-side-title{font-size:23px;letter-spacing:.04em} } @media (min-width:768px){ #contents-page-top{right:max(24px, calc((100% - 1280px) / 2 + 24px))} } #main_contents .elp .nm-about-lead{text-align:left;justify-items:start} #main_contents .elp .nm-about-lead .nm-q{display:block;padding:0;border-radius:0;background:none;box-shadow:none} #main_contents .elp #jobs .jobs .nm-ico{background:#f3f7cf} #main_contents .elp #jobs .jobs a{border:1.5px solid #dcefeb;box-shadow:none;border-radius:16px;background:#fff} #main_contents .elp #jobs .jobs a::after{border-color:#1d9aa0} #main_contents .elp #reasons .card .point-illust{background:#fff} #main_contents .elp #reasons .card .point-illust{padding-top:0} #main_contents .elp .nm-prep-words-img{display:block;width:200px;height:auto;margin:16px auto 0} @media (min-width:768px){#main_contents .elp .nm-prep-2col .nm-prep-words-img{margin:0}} #main_contents .elp .nm-bubble-img{display:block;width:230px;height:auto} @media (min-width:768px){#main_contents .elp .nm-bubble-img{width:384px}} #main_contents .elp .nm-stat i{font-style:normal} #main_contents .elp .nm-stat-label{min-height:0} #main_contents .elp .nm-stat-num{margin-top:6px} #main_contents .elp .nm-stats-note{margin:8px 0 0;text-align:right;font-size:10px;line-height:1.5;color:#8a979c;letter-spacing:.04em} #main_contents .elp .nm-stats-note i{font-style:normal} @media (min-width:768px){#main_contents .elp .nm-stats-note{max-width:478px;margin-left:auto;margin-right:auto}} #main_contents .elp .nm-mv-sub span{display:inline-block} #main_contents .elp .nm-wave{display:none} #main_contents .elp .nm-index{margin-top:-121px} @media (min-width:768px){#main_contents .elp .nm-index{margin-top:-66px}} @media (max-width:767px){#main_contents .elp .nm-bubble-wrap{left:auto;right:4px;bottom:30px}#main_contents .elp .nm-bubble-img{width:200px}} #main_contents .elp .stats{grid-template-columns:1fr 1fr} #main_contents .elp .stats li.nm-stat-all{grid-column:1 / -1} #main_contents .elp .stats li.nm-stat-all>a{grid-template-columns:1fr;justify-items:center;align-content:center} #main_contents .elp .stats li.nm-stat-all .nm-stat-ico{grid-row:auto;grid-column:1} #main_contents .elp .stats li.nm-stat-all>a>b{grid-column:1;grid-row:auto;text-align:center;font-size:44px} #main_contents .elp .stats li.nm-stat-all>a>span{font-size:15px;font-weight:700} @media (min-width:768px){ #main_contents .elp .stats{grid-template-columns:1.1fr 1fr 1fr} #main_contents .elp .stats li.nm-stat-all{grid-column:1;grid-row:1 / span 2;background:linear-gradient(160deg,#f3f9e6,#e3f5f1)} #main_contents .elp .stats li.nm-stat-all .nm-stat-ico{width:72px;height:72px;background:#fff} #main_contents .elp .stats li.nm-stat-all .nm-stat-ico svg{width:38px;height:38px} #main_contents .elp .stats li.nm-stat-all>a>b{font-size:72px} #main_contents .elp .stats li.nm-stat-all>a>b small{font-size:24px} #main_contents .elp .stats li.nm-stat-all>a>span{font-size:18px} #main_contents .elp .stats li.nm-stat-all em{background:#fff} } #main_contents .elp .nm-jc-memo-illust{width:120px} @media (min-width:768px){#main_contents .elp .nm-jc-memo-illust{width:204px;margin:-6px 0 -24px}} /* ===== スマホのMV ===== */ #main_contents .elp .nm-sp-br{display:none} @media (max-width:899px){ #main_contents .elp .nm-sp-br{display:inline} #main_contents .elp .nm-mv-in{display:block;padding:58px 20px 150px} #main_contents .elp .nm-mv-txt{text-align:left} #main_contents .elp .nm-mv-head{margin:0} #main_contents .elp .nm-mv-hand{width:200px;margin-left:-8px} #main_contents .elp .nm-mv-title{font-size:38px;line-height:1.3;margin-top:10px} #main_contents .elp .nm-mv-sub{margin-top:18px;font-size:14px;font-weight:500;line-height:1.7!important;letter-spacing:.08em!important} #main_contents .elp .nm-mv-sub span{display:block} #main_contents .elp .nm-mv-photo{position:absolute;left:0;right:0;top:0;height:480px;width:auto;margin:0;aspect-ratio:auto;z-index:0} #main_contents .elp .nm-mv-img{object-position:66% 20%;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.15) 0,rgba(0,0,0,.55) 30%,#000 55%),linear-gradient(180deg,#000 75%,transparent 100%);mask-image:linear-gradient(90deg,rgba(0,0,0,.15) 0,rgba(0,0,0,.55) 30%,#000 55%);-webkit-mask-composite:source-in;mask-composite:intersect} #main_contents .elp .nm-mv-copy{display:none} #main_contents .elp .nm-bubble-wrap{left:auto;right:8px;bottom:auto;z-index:1} #main_contents .elp .nm-bubble-img{width:240px} #main_contents .elp .nm-stats{position:relative;z-index:4} #main_contents .elp .nm-stat{background:#fff} #main_contents .elp .nm-stats{margin-top:140px;gap:8px} #main_contents .elp .nm-stats-note{text-align:right} } /* ===== 数字で見る ===== */ #main_contents .elp .stats li{--band:#e8f6f4} #main_contents .elp .stats li:nth-child(2),#main_contents .elp .stats li:nth-child(5){--band:#fdf0f2} #main_contents .elp .stats li:nth-child(3){--band:#fdf7e3} #main_contents .elp .stats li:nth-child(4){--band:#eaf5fa} #main_contents .elp .stats li:not(.nm-stat-all){padding:0;overflow:hidden;background:linear-gradient(180deg,var(--band) 0,var(--band) 96px,#fff 96px)} #main_contents .elp .stats li:not(.nm-stat-all)>a{padding:16px 22px 20px} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.7)} #main_contents .elp .stats li:not(.nm-stat-all)>a>span:not(.nm-stat-ico){color:#1f3a4d;font-size:16px;font-weight:700;letter-spacing:.06em;line-height:1.5} #main_contents .elp .stats li>a>b{color:#138d8b;font-weight:800} #main_contents .elp .stats li>a>b small{color:#138d8b} #main_contents .elp .stats li:not(.nm-stat-all) em{background:#e6f6f5;color:#138d8b} #main_contents .elp .stats li.nm-stat-all>a>span:not(.nm-stat-ico){display:inline-block;padding:8px 40px;border-radius:999px;background:rgba(201,236,229,.75);color:#1f3a4d;font-weight:700;letter-spacing:.08em;line-height:1.5} #main_contents .elp .stats li.nm-stat-all em{background:#fff;color:#138d8b;padding:12px 32px;font-size:14px;box-shadow:0 6px 16px rgba(79,140,140,.12)} @media (min-width:768px){ #main_contents .elp .stats li:not(.nm-stat-all)>a{grid-template-columns:72px 1fr;grid-template-areas:"ico label" "num num" "btn btn";grid-template-rows:1fr auto 1fr;column-gap:18px;row-gap:8px;align-items:center;justify-content:stretch} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico{grid-area:ico;align-self:end;width:64px;height:64px} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico svg{width:30px;height:30px} #main_contents .elp .stats li:not(.nm-stat-all)>a>span:not(.nm-stat-ico){grid-area:label;align-self:end;min-height:64px;display:flex;align-items:center;justify-self:start;text-align:left;font-size:17px} #main_contents .elp .stats li:not(.nm-stat-all)>a>b{grid-area:num;text-align:center;font-size:50px;line-height:1.1} #main_contents .elp .stats li:not(.nm-stat-all) em{grid-area:btn;align-self:start;justify-self:center;margin-top:6px;padding:10px 32px;font-size:13px} #main_contents .elp .stats li.nm-stat-all>a>span:not(.nm-stat-ico){font-size:20px;margin-top:8px} #main_contents .elp .stats li.nm-stat-all>a>b{font-size:84px;line-height:1.05} #main_contents .elp .stats li.nm-stat-all .nm-stat-ico{width:88px;height:88px;background:#fff;box-shadow:0 6px 18px rgba(79,140,140,.12)} } @media (max-width:767px){ #main_contents .elp .stats li:not(.nm-stat-all){background:linear-gradient(180deg,var(--band) 0,var(--band) 98px,#fff 98px)} #main_contents .elp .stats li:not(.nm-stat-all)>a{grid-template-areas:"ico" "label" "num" "btn";grid-template-rows:1fr auto auto 1fr;row-gap:6px;padding:14px 10px 16px} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico{grid-area:ico;align-self:end} #main_contents .elp .stats li:not(.nm-stat-all) em{align-self:start} #main_contents .elp .stats li:not(.nm-stat-all)>a>span:not(.nm-stat-ico){grid-area:label;font-size:12.5px;white-space:nowrap;letter-spacing:.02em} #main_contents .elp .stats li:not(.nm-stat-all)>a>b{grid-area:num;margin-top:6px} #main_contents .elp .stats li:not(.nm-stat-all) em{grid-area:btn;font-size:10.5px!important;padding:8px 4px;white-space:nowrap;letter-spacing:0} } #main_contents .elp #reasons .card-body{display:grid;grid-template-columns:auto 1fr;column-gap:14px;align-items:center} #main_contents .elp #reasons .card-body>*{grid-column:1 / -1} #main_contents .elp #reasons .card-body .point-no{grid-column:1;grid-row:1;position:static;margin:0} #main_contents .elp #reasons .card-body h3{grid-column:2;grid-row:1;margin:0} #main_contents .elp #reasons .card-body h3+*{margin-top:14px} @media (min-width:768px){ #main_contents .elp .nm-jc-memo{position:relative;overflow:visible;padding-left:236px;min-height:157px;box-sizing:border-box} #main_contents .elp .nm-jc-memo .nm-jc-memo-illust{position:absolute;left:14px;bottom:6px;margin:0} } /* ===== 数字で見る ===== */ #main_contents .elp .stats li:not(.nm-stat-all){background:#fff;border:1.5px solid #dcefeb;box-shadow:none;border-radius:20px} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico{box-shadow:none} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico.nm-ico-p{background:#fde9ea} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico.nm-ico-y{background:#fdf6d8} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico.nm-ico-b{background:#e5f4f7} #main_contents .elp .stats li em{display:flex;align-items:center;justify-content:center;position:relative;background:#fff;border:1px solid #9edcdb;border-radius:99px;color:#138d8b;font-weight:700;box-shadow:none;padding:9px 34px 9px 22px} #main_contents .elp .stats li em::after{content:"›";position:absolute;right:16px;top:50%;transform:translateY(-52%);font-size:1.25em;line-height:1} #main_contents .elp .stats li.nm-stat-all{background:linear-gradient(160deg,#e8f7f2 0%,#f4f9e4 100%);border:0;box-shadow:none;border-radius:24px} #main_contents .elp .stats li.nm-stat-all>a>span:not(.nm-stat-ico){background:none;padding:0} #main_contents .elp .stats li.nm-stat-all .nm-stat-ico{box-shadow:none} @media (min-width:768px){ #main_contents .elp .stats li.nm-stat-all em{padding:12px 44px 12px 30px} } #main_contents .elp .stats li:not(.nm-stat-all) em{background:#fff!important} @media (max-width:767px){#main_contents .elp .stats li:not(.nm-stat-all) em{padding:8px 22px 8px 10px}#main_contents .elp .stats li em::after{right:10px}} #main_contents .elp .stats li,#main_contents .elp #jobs .jobs a{transition:background-color .2s,border-color .2s,box-shadow .2s} #main_contents .elp .stats li:not(.nm-stat-all):hover{background:#f2fbf9!important;border-color:#3cc3bd!important;box-shadow:0 6px 20px rgba(79,140,140,.12)!important} #main_contents .elp .stats li.nm-stat-all:hover{box-shadow:0 0 0 2px #3cc3bd!important} #main_contents .elp .stats li:hover em{background:#e6f6f5!important} #main_contents .elp #jobs .jobs a:hover{background:#f2fbf9!important;border-color:#3cc3bd!important;box-shadow:0 6px 20px rgba(79,140,140,.12)!important} @media (max-width:899px){ #main_contents .elp .nm-mv-title,#main_contents .elp .nm-mv-title .nm-it{letter-spacing:-.05em} #main_contents .elp .nm-mv-title{font-size:36px} } @media (max-width:899px){ #main_contents .elp .nm-mv-img{-webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.2) 38%,#000 66%),linear-gradient(180deg,#000 75%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.2) 38%,#000 66%)} #main_contents .elp .nm-mv-title{text-shadow:0 0 2px #fff,0 0 6px #fff,0 0 12px #fff,0 0 20px #fff,0 0 30px rgba(255,255,255,.95),0 0 44px rgba(255,255,255,.85)} #main_contents .elp .nm-mv-sub{text-shadow:0 0 2px #fff,0 0 4px #fff,0 0 8px #fff,0 0 12px #fff,0 0 18px #fff,0 0 26px rgba(255,255,255,.95),0 0 38px rgba(255,255,255,.9),0 0 54px rgba(255,255,255,.8)} #main_contents .elp .nm-mv-hand,#main_contents .elp .nm-mv-copy{filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 6px #fff) drop-shadow(0 0 12px rgba(255,255,255,.95))} } /* ===== 文字の大きさ・字間 ===== */ #main_contents .elp section p:not(.nm-mv-title):not([class*="uki-jobs"]),#main_contents .elp section li:not([class*="uki-jobs"]){letter-spacing:.04em} #main_contents .elp [class*="uki-jobs"] p,#main_contents .elp [class*="uki-jobs"] li{letter-spacing:revert-layer} #main_contents .elp #voices.cards .card-body p:not([class]){font-size:13px} @media (max-width:767px){ #main_contents .elp #voices.cards .card-body p:not([class]){font-size:14px} #main_contents .elp .nm-check .res-text,#main_contents .elp .nm-check .fit p,#main_contents .elp .nm-step-memo p{font-size:14px!important} } #main_contents .elp .nm-stat-label{min-height:3em;display:flex;align-items:center;justify-content:center} #main_contents .elp .nm-check .fit .more::after{content:"›";font-size:1.2em} /* ===== ITエンジニアとは ===== */ #main_contents .elp .nm-about2{display:grid;grid-template-columns:1fr;gap:32px;justify-items:stretch} #main_contents .elp .nm-about2 .nm-about-lead{grid-column:auto;grid-row:auto;max-width:none} #main_contents .elp .nm-about-visual{position:relative;width:280px;height:280px;margin:0 auto 40px} #main_contents .elp .nm-about-big{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;border:6px solid #fff;box-shadow:0 8px 24px rgba(60,120,120,.12);box-sizing:border-box} #main_contents .elp .nm-about-visual .nm-side{position:absolute;right:-12px;bottom:-40px;margin:0} #main_contents .elp .nm-about-visual .nm-side .nm-about-photo{width:130px;height:130px;border-width:5px;margin:0} #main_contents .elp .nm-about-visual .nm-about-bubble{left:auto;right:110px;top:auto;bottom:70px;width:104px;height:104px;font-size:12px} @media (min-width:768px){ #main_contents .elp .nm-about2{grid-template-columns:minmax(0,1fr) 440px;column-gap:56px;align-items:center} #main_contents .elp .nm-about-visual{width:320px;height:320px;margin:0 0 40px auto} #main_contents .elp .nm-about-visual .nm-side{right:-24px;bottom:-48px} #main_contents .elp .nm-about-visual .nm-side .nm-about-photo{width:170px;height:170px;border-width:6px} #main_contents .elp .nm-about-visual .nm-about-bubble{right:auto;left:-150px;bottom:20px;width:130px;height:130px;font-size:13px} } @media (min-width:768px){#main_contents .elp .nm-about2{max-width:1080px;margin-left:auto;margin-right:auto}} /* ===== 動き ===== */ @keyframes nmUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}} @keyframes nmShine{0%,70%{left:-40%}100%{left:130%}} @keyframes nmFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}} .nm-anim #main_contents .elp :is(.sec-title,.blk-title,.nm-sec-title)::after{transform:scaleX(0);transform-origin:left center;transition:transform .9s cubic-bezier(.2,.7,.3,1) .15s} .nm-anim #main_contents .elp :is(.sec-title,.blk-title,.nm-sec-title).nm-in::after{transform:scaleX(1)} .nm-anim #main_contents .elp .nm-btn{position:relative;overflow:hidden} .nm-anim #main_contents .elp .nm-btn::before{content:"";position:absolute;top:0;left:-40%;width:30%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:nmShine 4s ease-in-out 1.6s infinite;pointer-events:none} .nm-anim #main_contents .elp .nm-bubble-img{animation:nmFloat 4.5s ease-in-out infinite} .nm-anim #main_contents .elp .nm-steps2-illust{animation-delay:-1.5s} #main_contents .elp .dots{align-items:center} #main_contents .elp .dots .nm-car-prev,#main_contents .elp .dots .nm-car-next{position:relative;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid #9edcdb;margin:0 10px;flex-shrink:0;transition:background-color .2s,border-color .2s} #main_contents .elp .dots .nm-car-prev::before,#main_contents .elp .dots .nm-car-next::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-top:2px solid #138d8b;border-right:2px solid #138d8b;transform:translate(-65%,-50%) rotate(45deg)} #main_contents .elp .dots .nm-car-prev::before{transform:translate(-35%,-50%) rotate(-135deg)} #main_contents .elp .dots .nm-car-prev:hover,#main_contents .elp .dots .nm-car-next:hover{background:#f2fbf9!important;border-color:#3cc3bd!important} /* ===== スマホ ===== */ @media (max-width:767px){ #main_contents .elp section :is(p,li,dd):not([class*="uki-jobs"]):not(.nm-mv-title){line-height:1.9} #main_contents .elp #voices.cards .card-body p:not([class]),#main_contents .elp .nm-check .shindan .checks label .nm-ck-txt,#main_contents .elp .nm-about-lead .nm-txt{font-size:14px;line-height:1.9!important} #main_contents .elp section h3:not(.res-title),#main_contents .elp .nm-about-lead .nm-q,#main_contents .elp .nm-em-box .nm-em,#main_contents .elp .nm-check .res-title{font-size:16px!important;line-height:1.6!important} #main_contents .elp :is(.nm-voice-case,.nm-voice-meta,.src,.nm-stats-note,.res-label,.res-fit-label,.nm-prep-lead,.tag-ok){font-size:12px!important;line-height:1.6!important} #main_contents .elp :is(.jl a,.nm-side-links a,.more,.stats em){font-size:13px;line-height:1.6} #main_contents .elp .blk-title+*,#main_contents .elp .sec-title+*,#main_contents .elp .nm-sec-title+*{margin-top:36px} #main_contents .elp .blk-title+.blk-lead{margin-top:36px} #main_contents .elp .nm-steps2-side .nm-side-title+*{margin-top:24px} } @media (max-width:767px){ #main_contents .elp #reasons .card-body h3,#main_contents .elp #wt .card-body h3,#main_contents .elp .col-card h3{font-size:16px;line-height:1.6} #main_contents .elp .nm-tags a,#main_contents .elp .nm-tags-label{line-height:1.6!important} } #main_contents .elp .nm-stat .nm-stat-label{line-height:1.45!important;min-height:2.9em} #main_contents .elp .nm-stat .nm-stat-num{margin-top:2px;line-height:1.15!important} @media (max-width:899px){ #main_contents .elp .nm-stat{flex:0 0 auto;width:min(31%,112px);height:auto;aspect-ratio:1/1;padding:0;justify-content:center;box-sizing:border-box} #main_contents .elp .nm-stat .nm-stat-label{font-size:10.5px} } #main_contents .elp .nm-about-visual .nm-about-bubble{right:auto;bottom:auto;left:-178px;top:18px;transform:rotate(-8deg);z-index:3} @media (min-width:768px){ #main_contents .elp .nm-about-visual .nm-about-bubble{left:-200px;top:28px} } /* ===== 見出しの改行・STEP・数字で見るのボタン ===== */ #main_contents .elp .nm-phr{display:inline-block} @media (max-width:767px){ #main_contents .elp .nm-steps2-side .nm-side-title{font-size:20px} } #main_contents .elp :is(h1,h2,h3) :is(em,mark,strong,span,i){font-weight:inherit} @media (max-width:767px){ #main_contents .elp .nm-steps2 .steps>li{display:grid;grid-template-columns:56px minmax(0,1fr);column-gap:14px;row-gap:0;align-items:center} #main_contents .elp .nm-steps2 .steps>li>*{grid-column:1 / -1} #main_contents .elp .nm-steps2 .steps>li>.nm-step-top{grid-column:1;grid-row:1;margin:0} #main_contents .elp .nm-steps2 .steps>li>h3{grid-column:2;grid-row:1;margin:0!important} #main_contents .elp .nm-steps2 .steps .no{width:56px;height:56px} #main_contents .elp .nm-steps2 .steps>li>h3+*{margin-top:14px} } #main_contents .elp .stats li em{background:none;border:0;box-shadow:none;padding:4px 18px 4px 0;width:auto;justify-self:center;color:#138d8b;font-size:13px} #main_contents .elp .stats li em::after{right:2px} #main_contents .elp .stats li:hover em{background:none!important;text-decoration:underline;text-underline-offset:3px} #main_contents .elp .stats li.nm-stat-all em{padding:4px 18px 4px 0;font-size:14px} @media (min-width:768px){#main_contents .elp .stats li.nm-stat-all em{font-size:15px}} #main_contents .elp .stats li em,#main_contents .elp .stats li.nm-stat-all em{display:inline-flex;width:auto;justify-self:center;background:none;box-shadow:none;border:0} #main_contents .elp .stats li.nm-stat-all:hover em{background:none!important} #main_contents .elp .stats li:not(.nm-stat-all) em{padding:4px 18px 4px 0;margin-top:4px} @media (min-width:768px){#main_contents .elp .stats li:not(.nm-stat-all) em{padding:4px 18px 4px 0}} @media (max-width:767px){#main_contents .elp .nm-check .fit .more{white-space:nowrap;font-size:12.5px}} #main_contents .elp .nm-stat .nm-stat-label{align-items:flex-end} #main_contents .elp .nm-stat{display:flex;flex-direction:column;justify-content:center;align-items:center} #main_contents .elp .nm-stat .nm-stat-label{min-height:0;align-items:center} @media (max-width:767px){ #main_contents .elp .nm-check .fit>div{flex-direction:column;align-items:stretch;padding:20px 18px 18px} #main_contents .elp .nm-check .fit .nm-fit-illust{width:96px;height:96px;margin:0 auto 12px} #main_contents .elp .nm-check .fit .nm-fit-body{min-width:0;width:100%} #main_contents .elp .nm-check .fit .more{white-space:normal;font-size:13px} } #main_contents .elp .nm-em .nm-mark{font-weight:700} @media (max-width:767px){ #main_contents .elp .nm-steps2-side .nm-side-title{text-align:center} #main_contents .elp .nm-steps2-side>.steps{margin:20px 0 0;padding:0} #main_contents .elp .nm-steps2-side>.steps+.nm-step-memo{margin-top:20px} } @media (max-width:767px){ #main_contents .elp .nm-steps2-side{padding-left:16px;padding-right:16px} #main_contents .elp .nm-steps2-side>.steps>li{padding:var(--tidy-card);grid-template-columns:48px minmax(0,1fr);column-gap:12px} #main_contents .elp .nm-steps2-side>.steps .no{width:48px;height:48px;font-size:18px} } #main_contents .elp .cards[id]{cursor:grab} #main_contents .elp #reasons[id],#main_contents .elp #voices[id]{cursor:auto} #main_contents .elp .cards[id] img{-webkit-user-drag:none;user-select:none} @media (max-width:767px){ #main_contents .elp .nm-steps2-side{background:none;padding:0;border-radius:0} } @media (max-width:767px){ #main_contents .elp .nm-prep2 .nm-steps2-side{background:none;padding:0;border-radius:0;box-shadow:none} #main_contents .elp .nm-steps2-side>.prep{margin:20px 0 0} #main_contents .elp .nm-steps2-side>.prep+.nm-step-memo{margin-top:20px} } /* ===== 幅900〜1199px（狭いPC） ===== */ @media (min-width:900px) and (max-width:1199px){ #main_contents .elp .nm-mv-in{grid-template-columns:480px 1fr;padding-left:32px;padding-right:24px} #main_contents .elp .nm-mv-txt{max-width:480px} #main_contents .elp .nm-mv-hand{width:250px} #main_contents .elp .nm-mv-title{font-size:46px;line-height:64px} #main_contents .elp .nm-mv-sub{font-size:13px;letter-spacing:.08em!important} #main_contents .elp .nm-mv-sub span{display:block} #main_contents .elp .nm-stats{gap:10px} #main_contents .elp .nm-stat{flex:0 0 130px;width:130px;height:130px} #main_contents .elp .nm-stat .nm-stat-num{font-size:28px} #main_contents .elp .nm-stats-note{max-width:410px} #main_contents .elp .nm-cta{max-width:400px} #main_contents .elp .nm-mv-copy{width:190px;top:150px;right:10px} #main_contents .elp .nm-bubble-wrap{right:16px;top:auto;bottom:110px} #main_contents .elp .nm-bubble-img{width:280px} } @media (min-width:768px) and (max-width:1199px){ #main_contents .elp .nm-about2{grid-template-columns:minmax(0,1fr) 340px;column-gap:32px} #main_contents .elp .nm-about-visual{width:260px;height:260px;margin:0 40px 40px auto} #main_contents .elp .nm-about-visual .nm-side{right:-30px;bottom:-36px} #main_contents .elp .nm-about-visual .nm-side .nm-about-photo{width:130px;height:130px} #main_contents .elp .nm-about-visual .nm-about-bubble{left:-70px;top:150px;width:110px;height:110px;font-size:12px} #main_contents .elp .points>li>.jl{flex-direction:column;align-items:stretch} #main_contents .elp .points>li>.jl li{width:100%} #main_contents .elp .points>li>.jl a{white-space:nowrap} #main_contents .elp .stats li:not(.nm-stat-all)>a>span:not(.nm-stat-ico){font-size:14px;white-space:nowrap;letter-spacing:.02em} #main_contents .elp .stats li:not(.nm-stat-all) .nm-stat-ico{width:52px;height:52px} #main_contents .elp .stats li:not(.nm-stat-all)>a{grid-template-columns:52px 1fr;column-gap:12px} #main_contents .elp #voices .card-body h3{font-size:14px;letter-spacing:.02em} } @media (min-width:768px) and (max-width:1199px){ #main_contents .elp .points>li>.jl{grid-template-columns:1fr} #main_contents .elp #voices.cards .card .card-body h3{font-size:14px;letter-spacing:.02em} #main_contents .elp .nm-about-visual .nm-about-bubble{left:-64px;top:136px;bottom:auto;right:auto} } @media (min-width:768px) and (max-width:1199px){ #main_contents .elp .nm-about-visual .nm-about-bubble{left:-170px;top:10px} } #main_contents .elp #wt .col-card img,#main_contents .elp #columns .col-card img{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover} html.nm-pc-fixed body{min-width:1024px} @media (max-width:767px){ #main_contents .elp .points>li>.jl{grid-template-columns:1fr} } @media (max-width:767px){ #main_contents .elp table.lang thead{display:none} #main_contents .elp table.lang,#main_contents .elp table.lang tbody{display:block;width:100%} #main_contents .elp table.lang tr{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:10px;row-gap:4px;padding:12px 14px;border-bottom:1px solid #e7efee} #main_contents .elp table.lang tr>*{display:block;padding:0!important;border:0;background:none!important;text-align:left} #main_contents .elp table.lang tbody th{grid-column:1;grid-row:1;font-size:14px;white-space:nowrap} #main_contents .elp table.lang td.lv{grid-column:2;grid-row:1;text-align:right} #main_contents .elp table.lang td.lv span{flex-direction:row;gap:6px} #main_contents .elp table.lang tr.is-easy td.lv span{padding:4px 12px} #main_contents .elp table.lang td:not(.lv){grid-column:1 / -1;grid-row:2;font-size:13px;line-height:1.7} #main_contents .elp table.lang tr.is-easy{background:#f2fbf9} } @media (max-width:767px){ #main_contents .elp .nm-steps2-side .nm-step-memo{background:#fdf8e4;box-shadow:none} #main_contents .elp .nm-steps2-side .nm-step-memo .nm-ico{background:#fff} } @media (max-width:767px){ #main_contents .elp .nm-search .btn{padding-left:16px;padding-right:16px;min-width:0} #main_contents .elp .nm-search input{padding-left:42px!important;padding-right:8px!important} #main_contents .elp .nm-search input::placeholder{letter-spacing:.02em} } @media (max-width:767px){ #main_contents .elp .nm-check .shindan .checks{gap:8px} #main_contents .elp .nm-check .shindan .checks label{padding:10px 14px 10px 46px;min-height:0;gap:0} #main_contents .elp .nm-check .shindan .checks label .nm-ico{display:none} #main_contents .elp .nm-check .shindan .checks label::before{left:14px} #main_contents .elp .nm-check .shindan .checks label:has(input:checked)::after{left:21px!important} #main_contents .elp .nm-check .shindan .checks label .nm-ck-txt{line-height:1.6!important} #main_contents .elp .nm-check-lead{margin-bottom:10px} #main_contents .elp .nm-check .shindan{padding-top:0} } @media (max-width:767px){ #main_contents .elp .nm-index a{font-size:10.5px;letter-spacing:-.04em;white-space:nowrap} #main_contents .elp .nm-about-lead .nm-q{font-size:15px!important;letter-spacing:.02em!important} } /* ===== アクセントの書体 ===== */ #main_contents .elp :is(.sec-title,.blk-title,.nm-sec-title,.nm-side-title,.blk-en, .card-body h3,.jobcards h3,.steps h3,.points h3,.prep h3,.fit h3,.res-title,.col-card h3,.nm-check-lead,.res-fit-label, .nm-q,.nm-em,.nm-about-bubble, .stats b,.stats li>a>span:not(.nm-stat-ico),.stats em,.nm-stat-label,.nm-stat-num, .point-no,.steps .no,.nm-prep-no,.nm-prep-lead,.nm-voice-case, .nm-end-lead,.btn,.nm-btn,.jl a,.more,.tag-ok,.nm-tags a,.nm-tags-label,.nm-index a,.nm-index-label, .uki-jobs__head,.uki-jobs__more){font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif} @media (max-width:359px){#main_contents .elp .nm-stats-note{font-size:9.5px!important;letter-spacing:0!important;white-space:nowrap}} #main_contents .elp .nm-index-label{display:table;margin:0 auto -14px;padding:5px 18px;border-radius:999px;background:#fff;box-shadow:0 2px 10px rgba(79,140,140,.12);color:#1d9aa0;font-size:12px;letter-spacing:.24em;line-height:1.4;z-index:2} /* ===== ページ末尾の会員登録 ===== */ #main_contents .elp .nm-end{--nm-pink:#f0566a;--nm-pink-dark:#d93f55;--nm-navy:#1f3a4d;padding:56px 0 72px;background:#fff5f6;text-align:center} #main_contents .elp .nm-end .inner{padding-left:20px;padding-right:20px} #main_contents .elp .nm-end-lead{margin:0;color:var(--nm-navy);font-size:17px;font-weight:700;line-height:1.9;letter-spacing:.08em} #main_contents .elp .nm-end .nm-cta{margin-top:28px} @media (min-width:900px){#main_contents .elp .nm-end{padding:72px 0 88px}#main_contents .elp .nm-end-lead{font-size:22px}#main_contents .elp .nm-end .nm-cta{margin-top:36px}} #main_contents .elp #voices-sec .jl.nm-voice-links{justify-content:center;margin-top:16px} #main_contents .elp .nm-sr{position:absolute;left:-9999px}