@charset "UTF-8";
/* 日本語 */
/**********************************************/
.mv { background-color: #17ACB7; height: 840px; position: relative; padding: 20px 0 0; }
.mv:before { position: absolute; content: ""; display: block; width: 55%; border-radius: 0 30px 30px 0; background-color: #fff; height: calc(100% + 70px); left: 0; top: -45px; }
.mv .mv_flex { position: relative; max-width: 1500px; width: calc(100% - 100px); margin: 0 auto 30px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
.mv .txt { background: url("../img/mv02.svg") center center no-repeat; background-size: contain; aspect-ratio: 477/784; max-width: 100%; height: auto; width: 477px; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.mv .movie { margin: 25px 0 0 0; position: relative; width: calc(100% - 540px); border-radius: 20px; padding: 30px; max-width: 910px; height: 684px; position: relative; }
.mv .movie:before { position: absolute; content: ""; aspect-ratio: 437/118; width: 100%; max-width: 437px; height: auto; bottom: -50px; left: -80px; background: url("../img/mv01.svg") center center no-repeat; background-size: contain; z-index: 5; }
.mv .movie video { border-radius: 20px; width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); object-fit: cover; }

@media (max-width: 1280px) { .mv { height: 800px; }
  .mv .txt { width: 400px; }
  .mv .movie { width: calc(100% - 450px); } }
/*max-width:1280px*/
@media (max-width: 1024px) { .mv { height: 580px; }
  .mv:before { width: 65%; height: calc(100% + 80px); top: 0; }
  .mv .mv_flex { width: 100%; padding: 0 20px 0 40px; }
  .mv .txt { width: 330px; }
  .mv .movie { width: calc(100% - 350px); height: 530px; position: relative; }
  .mv .movie:before { left: -40px; max-width: 380px; } }
/*max-width:1024px*/
@media (max-width: 768px) { .mv { height: 720px; position: relative; padding: 0; }
  .mv:before { display: none; }
  .mv .mv_flex { height: 720px; padding: 0; position: relative; max-width: 768px; width: 100%; margin: 0 auto; display: block; padding: 40px 0 0; }
  .mv .txt { background: url("../img/mv03.svg") center center no-repeat; background-size: contain; aspect-ratio: 322/623; max-width: 100%; width: auto; height: 620px; margin: 0 auto; z-index: 10; position: relative; }
  .mv .movie { margin: 0; position: absolute; width: 100%; border-radius: 20px 20px 0 0; padding: 0; max-width: 910px; height: 720px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); /* Safari用 */ transform: translate(-50%, -50%); z-index: 1; }
  .mv .movie:before { display: none; }
  .mv .movie:after { position: absolute; width: 100%; height: 100%; border-radius: 20px 20px 0 0; background-color: #fff; content: ""; display: block; opacity: 0.8; left: 0; top: 0; z-index: 5; } }
/*max-width:768px*/
/*max-width:480px*/
/**********************************************/
.about { background-color: #17ACB7; padding: 100px 0 80px; }
.about h1 { background: url("../img/about_ttl.svg") center center no-repeat; background-size: contain; aspect-ratio: 571/296; max-width: 100%; height: auto; width: 477px; overflow: hidden; text-indent: 100%; white-space: nowrap; margin: 0 0 35px; }
.about p { text-align: justify; text-justify: inter-ideograph; color: #fff; font: 2rem/2.2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; margin: 0 0 40px; }
.about p span { color: #000; }
.about p strong { font: 2.5rem/2.2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }
.about h2 { background-color: #FFE33F; border-radius: 50px; width: 380px; height: 60px; display: block; margin: 0 0 10px; color: #000; font: 2rem/58px "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; text-align: center; }

.about_box { max-width: 1500px; width: calc(100% - 100px); margin: 0 auto; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }
.about_box .txt { width: 51%; max-width: 750px; }
.about_box .img { width: 46%; max-width: 640px; border-radius: 15px; overflow: hidden; }
.about_box .img img { width: 100%; height: 100%; object-fit: cover; }

/*max-width:1280px*/
@media (max-width: 1024px) { .about { padding: 150px 0 60px; }
  .about_box { max-width: 768px; width: calc(100% - 80px); margin: 0 auto; display: block; }
  .about_box .txt { width: 100%; max-width: 750px; }
  .about_box .img { margin: 0 auto; width: 100%; max-width: 480px; } }
/*max-width:1024px*/
@media (max-width: 768px) { .about { background-color: #17ACB7; padding: 60px 0 60px; }
  .about h1 { width: 100%; height: auto; max-width: 480px; margin: 0 0 35px; }
  .about p { font: 1.8rem/2.2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }
  .about p span { color: #000; }
  .about p strong { font: 2.5rem/2.2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }
  .about h2 { width: 360px; height: 50px; color: #000; font: 1.8rem/48px "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }
  .about_box { max-width: 480px; width: calc(100% - 80px); } }
/*max-width:768px*/
@media (max-width: 480px) { .about { padding: 60px 0 30px; }
  .about h1 { width: 100%; height: auto; max-width: 330px; margin: 0 0 35px; }
  .about h2 { max-width: 360px; width: 100%; }
  .about_box { max-width: 330px; width: calc(100% - 40px); margin: 0 auto; } }
/*max-width:480px*/
/**********************************************/
.schedule { background-color: #FFE33F; padding: 90px 0 280px; background-color: #FFE33F; position: relative; z-index: 5; }
.schedule h1 { display: block; margin: 0 auto 45px; aspect-ratio: 792/88; width: 100%; max-width: 792px; height: auto; background: url("../img/schedule_ttl.svg") center center no-repeat; background-size: contain; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.schedule .midashi { width: fit-content; margin: 0 auto 23px; background-color: #fff; border: 2px solid #000; font: 1.8rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; padding: 0px 20px 0; }
.schedule .midashi span.big { font: 3rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }

.schedule_dat { max-width: 1500px; background-color: #fff; width: calc(100% - 100px); border-radius: 20px; padding: 50px 30px; margin: 0 auto 40px; }
.schedule_dat dl { max-width: 1300px; margin: 0 auto; }
.schedule_dat dt { font: 2rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; position: relative; padding: 0 0 0 60px; }
.schedule_dat dt.blue { margin: 30px 0 0 0; }
.schedule_dat dt.blue:before { background: url("../img/icon_international.svg") center center no-repeat; background-size: contain; }
.schedule_dat dt.pink:before { background: url("../img/icon_permanent.svg") center center no-repeat; background-size: contain; }
.schedule_dat dt:before { position: absolute; content: ""; display: block; width: 30px; height: 30px; left: 15px; top: 3px; }
.schedule_dat dd { font: 1.7rem/2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; padding: 0 0 0 60px; }

.schedule_flex { margin: 0 auto; max-width: 1500px; width: calc(100% - 100px); display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: stretch; }

.schedule_box { background-color: #fff; max-width: 720px; width: calc((100% - 60px)/2); margin: 0; overflow: hidden; border-radius: 20px; padding: 0 0 50px; }
.schedule_box .head { height: 120px; background-color: #17ACB7; color: #fff; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 0 30px 0 8%; }
.schedule_box .head .schedule_head { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
.schedule_box .head .schedule_head p:nth-of-type(1) { letter-spacing: 0.03em; font: 5rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; }
.schedule_box .head .schedule_head p:nth-of-type(1) span { font: 8rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
.schedule_box .head .schedule_head p:nth-of-type(2) { padding: 0 0 0 10px; font: 2.8rem/1.2em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
.schedule_box .endmark { padding: 5px 0; display: none; width: 180px; border: 1px solid #fff; text-align: center; font: 2.2rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; }
.schedule_box .endmark span { font: 2rem/1.5em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; display: block; }
.schedule_box.end .head { background-color: #767676; }
.schedule_box.end .endmark { display: block; }

.schedule_item { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 35px 40px; border-bottom: 1px solid #9DCED3; }
.schedule_item .time { width: 100%; max-width: 640px; margin: 0 auto 8px; font: 3.6rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
.schedule_item .time time { color: #952306; }
.schedule_item .time .day { display: none; }
.schedule_item .time .job { display: inline-block; margin: 0 0 0 20px; border: 1px solid #A6A7A7; width: fit-content; font: 1.5rem/1.6em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; padding: 3px 10px; }
.schedule_item h2 { font: 2rem/1.7em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; width: 100%; max-width: 640px; margin: 0 auto 15px; color: #17ACB7; padding: 0 0 0 35px; }
.schedule_item h2 a { color: #17ACB7; text-decoration: underline; position: relative; }
.schedule_item h2 a:before { position: absolute; content: ""; display: block; background: url("../img/ico_schedule_arrow.svg") center center no-repeat; background-size: contain; aspect-ratio: 1/1; width: 100%; max-width: 24px; height: auto; left: -35px; top: 4px; }
.schedule_item ul { max-width: 640px; margin: 0 auto; width: 100%; padding: 0 0 0 35px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; }
.schedule_item .subject { display: block; aspect-ratio: 1/1; width: 100%; max-width: 30px; height: auto; margin: 0 5px 0 0; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.schedule_item .subject.permanent { background: url("../img/icon_permanent.svg") center center no-repeat; background-size: contain; }
.schedule_item .subject.international { background: url("../img/icon_international.svg") center center no-repeat; background-size: contain; }

@media (max-width: 1280px) { .schedule_box { background-color: #fff; max-width: 720px; width: calc((100% - 30px)/2); }
  .schedule_box .head { padding: 0 20px; }
  .schedule_box .head .schedule_head p:nth-of-type(1) { letter-spacing: 0.03em; font: 4.8rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(1) span { font: 7.5rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(2) { font: 2.3rem/1.2em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
  .schedule_box .endmark { width: 140px; font: 1.8rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; }
  .schedule_box .endmark span { font: 1.8rem/1.5em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; display: block; }
  .schedule_item .time { display: block; }
  .schedule_item .time .job { display: block; margin: 10px 0 0 0; } }
/*max-width:1280px*/
@media (max-width: 1024px) { .schedule { padding: 90px 0 180px; }
  .schedule h1 { width: calc(100% - 80px); max-width: 768px; }
  .schedule .midashi { width: calc(100% - 80px); max-width: 768px; }
  .schedule_dat { width: calc(100% - 80px); max-width: 768px; }
  .schedule_flex { width: calc(100% - 80px); max-width: 768px; display: block; margin: 0 auto; }
  .schedule_box { width: 100%; margin: 0 auto; max-width: 768px; }
  .schedule_box.left { margin-bottom: 40px; }
  .schedule_box .endmark { padding: 20px 20px; display: none; width: fit-content; font: 1.8rem/1em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; }
  .schedule_box .endmark span { font: 1.8rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; display: block; padding: 2px 0 0  10px; }
  .schedule_box.end .endmark { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: flex-start; } }
/*max-width:1024px*/
@media (max-width: 768px) { .schedule { padding: 60px 0 110px; }
  .schedule h1 { display: block; margin: 0 auto 45px; aspect-ratio: 324/106; width: calc(100% - 80px); max-width: 480px; height: auto; background: url("../img/schedule_ttl_sp.svg") center center no-repeat; background-size: contain; }
  .schedule .midashi { width: calc(100% - 80px); max-width: 480px; margin: 0 auto 23px; padding: 15px 20px; }
  .schedule_dat { max-width: 480px; width: calc(100% - 80px); }
  .schedule_dat dt { padding: 40px 0 0 0; }
  .schedule_dat dt:before { left: 0; top: 0px; }
  .schedule_dat dd { padding: 0; }
  .schedule_flex { width: calc(100% - 40px); max-width: 480px; display: block; margin: 0 auto; }
  .schedule_box { width: 100%; }
  .schedule_box.left { margin-bottom: 40px; }
  .schedule_box .head { height: auto; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: flex-start; padding: 20px 35px; }
  .schedule_box .head .schedule_head p:nth-of-type(1) { letter-spacing: 0.03em; font: 4.5rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(1) span { font: 7rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(2) { padding: 0 0 0 10px; font: 2.2rem/1.2em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
  .schedule_box .endmark { margin: 5px 0 0; padding: 5px 20px; }
  .schedule_item { padding: 30px 30px; }
  .schedule_item .time { width: 100%; max-width: 640px; margin: 0 auto 8px; font: 3rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; display: block; }
  .schedule_item .time time { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; }
  .schedule_item .time .day { display: inline-block; padding: 0 15px 0 0; } }
/*max-width:768px*/
@media (max-width: 480px) { .schedule { padding: 40px 0 110px; }
  .schedule h1 { margin: 0 auto 35px; aspect-ratio: 324/106; width: calc(100% - 60px); max-width: 350px; }
  .schedule .midashi { font: 1.6rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; width: calc(100% - 40px); max-width: 350px; }
  .schedule_dat { max-width: 350px; width: calc(100% - 40px); padding: 30px 20px; }
  .schedule_dat dt { font: 1.7rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; }
  .schedule_dat dd { font: 1.6rem/2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; }
  .schedule_flex { width: 100%; max-width: 480px; display: block; margin: 0 auto; }
  .schedule_box { width: 100%; }
  .schedule_box .head { padding: 20px 20px; }
  .schedule_box .head .schedule_head p:nth-of-type(1) { font: 3.3rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(1) span { font: 5.6rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; }
  .schedule_box .head .schedule_head p:nth-of-type(2) { font: 1.8rem/1.2em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
  .schedule_box .endmark { padding: 5px 15px; }
  .schedule_item { padding: 20px 20px; }
  .schedule_item .time { font: 2.4rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
  .schedule_item h2 { font: 1.8rem/1.7em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; margin: 0 0 10px; }
  .schedule_item h2 a:before { top: 4px; } }
/*max-width:480px*/
/**********************************************/
.participation { background: url("../img/melod.svg") top -80px center no-repeat; padding: 140px 0 0; }

.step h1 { display: block; margin: 0 auto 45px; aspect-ratio: 243/89; width: 100%; max-width: 243px; height: auto; background: url("../img/step_ttl.svg") center center no-repeat; background-size: contain; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.step ul { max-width: 1500px; width: calc(100% - 100px); margin: 0 auto 90px; }
.step li { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0 0 20px; width: 100%; padding: 15px 45px 15px 150px; border: 5px solid #FFE33F; background-color: #fff; position: relative; min-height: 140px; }
.step li span { position: absolute; top: 58%; left: 0; -webkit-transform: translate(0%, -50%); /* Safari用 */ transform: translate(0%, -50%); width: 150px; display: block; text-align: center; font: 10rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; color: #17ACB7; padding: 5px 0 0; }
.step li span:before { font: 2rem/0em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; position: absolute; content: "STEP"; display: block; width: 100%; text-align: center; top: 0; left: 0; height: fit-content; }
.step li p { color: #17ACB7; width: 100%; font: 2.7rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; position: relative; padding: 0 0 0 130px; text-align: justify; text-justify: inter-ideograph; }
.step li p:before { position: absolute; content: ""; display: block; width: 95px; height: 85px; top: 50%; left: 0%; -webkit-transform: translate(0%, -50%); /* Safari用 */ transform: translate(0%, -50%); }
.step li.step01 p:before { background: url("../img/step01.svg") center center no-repeat; background-size: contain; }
.step li.step02 p:before { background: url("../img/step02.svg") center center no-repeat; background-size: contain; }
.step li.step03 p:before { background: url("../img/step03.svg") center center no-repeat; background-size: contain; }
.step li.step04 p:before { background: url("../img/step04.svg") center center no-repeat; background-size: contain; }
.step li a { color: #B71717; text-decoration: underline; display: inline-block; }
.step .btn { display: block; width: calc(100% - 100px); max-width: 760px; height: 120px; margin: 0 auto; background-color: #444AA3; color: #fff; border-radius: 100px; text-align: center; font: 2.4rem/118px "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; position: relative; }
.step .btn br { display: none; }
.step .btn:before { position: absolute; content: ""; display: block; background: url("../img/icon_btn.svg") center center no-repeat; background-size: contain; width: 35px; height: 35px; top: 50%; left: auto; right: 50px; -webkit-transform: translate(0%, -50%); /* Safari用 */ transform: translate(0%, -50%); }

@media (hover: hover) { .step li a:hover { opacity: 0.5; }
  .step .btn:hover { background-color: #96DEEC; } }
@media (max-width: 768px) { .participation { background: url("../img/melod.svg") top -80px center no-repeat; padding: 100px 0 0; }
  .step h1 { aspect-ratio: 243/89; width: 100%; max-width: 100%; height: 73px; }
  .step ul { max-width: 480px; width: calc(100% - 40px); margin: 0 auto 90px; }
  .step li { min-height: auto; display: block; position: relative; padding: 25px; }
  .step li span { width: 70px; position: relative; top: 0; left: 0; -webkit-transform: translate(0%, 0%); /* Safari用 */ transform: translate(0%, 0%); font: 9rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 500; color: #17ACB7; padding: 15px 0 0; }
  .step li span:before { font: 1.8rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; }
  .step li p { color: #17ACB7; width: 100%; font: 2.4rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; position: relative; padding: 0 5px; }
  .step li p:before { width: 95px; height: 85px; top: -100px; left: 90px; -webkit-transform: translate(0%, 0%); /* Safari用 */ transform: translate(0%, 0%); }
  .step .btn { width: calc(100% - 120px); max-width: 480px; height: auto; font: 2.2rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; border-radius: 15px; padding: 20px 30px; text-align: left; }
  .step .btn br { display: block; }
  .step .btn:before { right: 20px; } }
/*max-width:768px*/
@media (max-width: 480px) { .participation { background: none; padding: 60px 0 0; }
  .step h1 { height: 65px; }
  .step ul { max-width: 480px; width: calc(100% - 40px); margin: 0 auto 30px; }
  .step li { padding: 15px; }
  .step li p { font: 2rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; padding: 0 5px; }
  .step .btn { width: calc(100% - 40px); max-width: 480px; height: auto; font: 2rem/1.6em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; border-radius: 15px; padding: 15px 20px; text-align: left; }
  .step .btn br { display: block; }
  .step .btn:before { width: 24px; right: 20px; } }
/*max-width:480px*/
/**********************************************/
.company { padding: 230px 0 0; }
.company h1 { display: block; margin: 0 auto 45px; aspect-ratio: 243/89; width: 100%; max-width: 243px; height: auto; background: url("../img/company_list_ttl.svg") center center no-repeat; background-size: contain; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.company h2 { display: block; background: url("../img/search_sub_ttl.svg") center left no-repeat; background-size: contain; width: 152px; height: 60px; margin: 0 0 45px; overflow: hidden; text-indent: 100%; white-space: nowrap; }

.company-wrapper { border-radius: 75px; position: relative; z-index: 10; background-color: #fff; }
.company-wrapper h1 { font: 6rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; letter-spacing: 0.03em; font-weight: 700; text-align: center; margin: 0 auto 20px; color: #17ACB7; }
.company-wrapper h1 span { font: 2rem/1.2em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; display: block; }

.tabs { margin: 0 auto 60px; max-width: 1500px; width: calc(100% - 100px); }

/*タブ切り替え全体のスタイル*/
.tab_group { margin-bottom: 20px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: flex-start; justify-content: flex-start; border: 3px solid #17ACB7; border-radius: 10px; overflow: hidden; }
.tab_group.all { border: none; border-radius: 0; margin-bottom: 40px; }
.tab_group h3 { width: 230px; background-color: #FFE33F; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items: center; }
.tab_group h3 span { display: block; width: 100%; height: 46px; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.tab_group h3 span.sub01 { background: url("../img/searchsub01.svg") center center no-repeat; background-size: contain; }
.tab_group h3 span.sub02 { background: url("../img/searchsub02.svg") center center no-repeat; background-size: contain; }
.tab_group h3 span.sub03 { background: url("../img/searchsub03.svg") center center no-repeat; background-size: contain; }

.tab_list { margin-bottom: 100px; }

.tab_group_item { width: calc(100% - 230px); padding: 40px 40px 30px; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: flex-start; justify-content: flex-start; align-items: flex-start; }

.tab_item { font: 1.7rem/38px "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; width: fit-content; height: auto; padding: 0 20px; border: #17ACB7 1px solid; background-color: #fff; color: #17ACB7; border-radius: 5px; letter-spacing: 0.03em; margin: 0 10px 10px 0; text-align: center; }
.tab_item.all { border-radius: 50px; font: 1.7rem/38px "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; margin: 0; width: 120px; height: 40px; letter-spacing: 0.03em; }

.tab_item.active { color: #fff; font-weight: 600; background-color: #17ACB7; }

.tab_content { overflow: hidden; display: none; }

.company_list { width: 100%; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: flex-start; justify-content: flex-start; align-items: flex-start; }
.company_list li { max-width: 370px; width: calc((100% - 210px)/4); margin: 0 70px 75px 0; }
.company_list li:nth-of-type(4n) { margin-right: 0; }
.company_list .pic { aspect-ratio: 4/3; width: 100%; max-width: 100%; height: auto; overflow: hidden; }
.company_list .pic img { width: 100%; height: 100%; object-fit: cover; }
.company_list a { margin: 10px 0 20px; font: 1.8rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 700; text-decoration: underline; padding: 0 0 0 40px; position: relative; display: block; }
.company_list a:before { position: absolute; content: ""; display: block; background: url("../img/ico_schedule_arrow.svg") center center no-repeat; background-size: contain; width: 24px; height: 24px; left: 0; top: 4px; }
.company_list dt { font: 1.6rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; letter-spacing: 0.03em; background-color: #DAECEE; padding: 0 10px; color: #0787A2; margin: 0 0 5px; }
.company_list dd { margin-bottom: 20px; font: 1.7rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; letter-spacing: 0.03em; }
.company_list dd.flex { margin-bottom: 0; padding: 5px 0 0; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; }
.company_list dd .work_place { margin: 0 10px 0 0; }
.company_list .subject { display: block; aspect-ratio: 1/1; width: 100%; max-width: 30px; height: auto; margin: 0 8px 0 0; overflow: hidden; text-indent: 100%; white-space: nowrap; }
.company_list .subject.permanent { background: url("../img/icon_permanent.svg") center center no-repeat; background-size: contain; }
.company_list .subject.international { background: url("../img/icon_international.svg") center center no-repeat; background-size: contain; }

@media (hover: hover) { .tab_item:hover { cursor: pointer; opacity: 0.5; } }
@media (max-width: 1280px) { .company_list li { max-width: 370px; width: calc((100% - 60px)/4); margin: 0 20px 75px 0; }
  .company_list li:nth-of-type(4n) { margin-right: 0; } }
/*max-width:1280px*/
@media (max-width: 1024px) { .company_list { max-width: 768px; margin: 0 auto; -webkit-justify-content: space-between; justify-content: space-between; }
  .company_list li { max-width: 370px; width: calc((100% - 40px)/2); margin: 0 0px 75px 0; }
  .company_list li:nth-of-type(4n) { margin-right: 0; } }
/*max-width:1024px*/
@media (max-width: 768px) { .company { padding: 200px 0 0; }
  .company h1 { max-width: auto; height: 75px; }
  .company h2 { width: 152px; height: 60px; margin: 0 0 45px; }
  .tabs { margin: 0 auto 60px; max-width: 480px; width: calc(100% - 80px); }
  .tab_item { font: 1.7rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; width: fit-content; height: auto; padding: 5px 15px; border: #17ACB7 1px solid; background-color: #fff; color: #17ACB7; border-radius: 5px; letter-spacing: 0.03em; margin: 0 10px 10px 0; text-align: left; }
  .tab_group { display: block; }
  .tab_group h3 { width: 100%; padding: 15px 0; }
  .tab_group_item { width: 100%; padding: 15px; }
  .company_list li { width: 100%; margin: 0 auto 70px; } }
/*max-width:768px*/
@media (max-width: 480px) { .company { padding: 150px 0 0; }
  .company h1 { max-width: auto; height: 65px; }
  .company h2 { width: 152px; height: 50px; margin: 0 0 45px; }
  .tabs { margin: 0 auto 60px; max-width: 350px; width: calc(100% - 40px); }
  .tab_list { margin-bottom: 50px; }
  .tab_item { font: 1.5rem/1.5em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; margin: 0 10px 10px 0; }
  .tab_group { display: block; }
  .tab_group h3 { width: 100%; padding: 15px 0; }
  .tab_group h3 span { height: 40px; }
  .tab_group_item { width: 100%; padding: 15px; }
  .company_list li { width: calc(100% - 20px); margin: 0 auto 70px; }
  .company_list dt { width: 170px; text-align: center; }
  .company_list dd { font: 1.6rem/1.8em "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-weight: 400; }
  .company_list .pic { width: 90%; margin: 0 auto; } }
/*max-width:480px*/
/**********************************************/
.faq_btn { margin: 150px auto 220px; max-width: 800px; width: calc(100% - 100px); background-color: #FFDC26; color: #179EA9; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 60px 30px 60px 60px; border-radius: 20px; }
.faq_btn p { font: 10rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; letter-spacing: 0.03em; }
.faq_btn a { font: 2.6rem/80px "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; background-color: #179EA9; position: relative; text-align: center; max-width: 400px; width: calc(100% - 230px); height: 80px; border-radius: 50px; color: #fff; display: block; }
.faq_btn a:before { position: absolute; content: ""; top: 50%; left: auto; right: 35px; -webkit-transform: translate(0%, -50%); /* Safari用 */ transform: translate(0%, -50%); width: 0; height: 0; border-style: solid; border-top: 7px solid transparent; border-bottom: 7px solid transparent; border-left: 14px solid #FFDC26; border-right: 0; }

@media (hover: hover) { .faq_btn a:hover { background-color: #96DEEC; } }
/*max-width:1280px*/
/*max-width:1024px*/
@media (max-width: 768px) { .faq_btn { margin: 100px auto; max-width: 480px; width: calc(100% - 60px); display: block; padding: 40px 50px 40px 50px; }
  .faq_btn p { text-align: center; margin: 0 auto 20px; }
  .faq_btn a { max-width: 400px; width: 100%; height: 80px; border-radius: 50px; margin: 0 auto; } }
/*max-width:768px*/
@media (max-width: 480px) { .faq_btn { margin: 0 auto 80px; padding: 20px 50px 25px 50px; border-radius: 20px; }
  .faq_btn p { font: 5rem/1em "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; margin: 0 auto 13px; }
  .faq_btn a { font: 2.6rem/45px "Urbanist", Arial, Helvetica, "sans-serif"; font-weight: 700; max-width: 200px; height: 45px; }
  .faq_btn a:before { right: 15px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 12px solid #FFDC26; border-right: 0; } }
/*max-width:480px*/