@charset "UTF-8";
/*
Theme Name: 量子ジョブフェスタ
Author: 
Author URI: 
Version: 1.0.0
*/
@import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&family=Zen+Maru+Gothic:wght@300;400;500;700;900&display=swap");
.clearfix { *zoom: 1; }
.clearfix:after { content: ""; display: table; clear: both; }

html { font-size: 100%; font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", YuGothic Gothic Medium, "メイリオ", "Meiryo", sans-serif; }

body { margin: 0; line-height: 1.75; letter-spacing: 0.05em; color: #252525; }
body.fixed { height: 100%; overflow: hidden; }

a { position: relative; text-decoration: none; color: #4FC4E9; outline: none; }
@media (min-width: 64em) { a { -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
  a:hover { opacity: 0.60; } }

.sp { display: block; }
@media (min-width: 48em) { .sp { display: none; } }

.pc { display: none; }
@media (min-width: 48em) { .pc { display: block; } }

video.normal-movie { display: block; margin: 0; min-width: 100%; min-height: auto; width: 100%; height: auto; }

.mg-top-0rem { margin-block-start: 0 !important; }

.mg-top-1rem { margin-block-start: 1rem !important; }

.mg-top-2rem { margin-block-start: 2rem !important; }

.mg-top-3rem { margin-block-start: 3rem !important; }

.mg-top-4rem { margin-block-start: 4rem !important; }

.mg-top-5rem { margin-block-start: 5rem !important; }

.mg-top-6rem { margin-block-start: 6rem !important; }

.mg-top-7rem { margin-block-start: 7rem !important; }

.mg-top-8rem { margin-block-start: 8rem !important; }

.mg-top-9rem { margin-block-start: 9rem !important; }

.mg-top-10rem { margin-block-start: 10rem !important; }

.mg-center { margin-left: auto !important; margin-right: auto !important; }

.dp-block { display: block !important; }

.dp-in-block { display: inline-block !important; vertical-align: top; }

.dp-sp { display: block; }
@media (min-width: 64em) { .dp-sp { display: none; } }

.dp-pc { display: none; }
@media (min-width: 64em) { .dp-pc { display: block; } }

.googlemap-box iframe { width: 100%; height: 360px; }

.co-center { position: absolute; top: 50%; left: 50%; margin: auto; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.co-center-y { position: absolute; top: 50%; left: auto; right: auto; margin: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); }

.text-center { text-align: center !important; }
.text-left { text-align: left !important; }
.text-right { text-align: right !important; }
.text-border { display: inline; background: linear-gradient(transparent 72%, #DEFF00 0%); }

.fo-st-italic { font-style: italic; }
.fo-st-normal { font-style: normal; }

.fo-w-normal { font-weight: normal; }
.fo-w-bold { font-weight: bold; }
.fo-w-100 { font-weight: 100; }
.fo-w-300 { font-weight: 300; }
.fo-w-400 { font-weight: 400; }
.fo-w-700 { font-weight: 700; }
.fo-w-900 { font-weight: 900; }

.fo-co-base { color: #252525 !important; }
.fo-co-white { color: #fff !important; }
.fo-co-black { color: black !important; }
.fo-co-gray { color: #999999 !important; }
.fo-co-red { color: #EC1212 !important; }
.fo-co-pink { color: #E43480 !important; }
.fo-co-blue { color: #0076C9 !important; }
.fo-co-green { color: #00ac65 !important; }
.fo-co-orange { color: #faa701 !important; }
.fo-co-yellow { color: #F5EA2A !important; }

.fo-s { font-size: clamp(12px, 1.367vw, 14px); }

.fo-m { font-size: clamp(18px, 1.953vw, 20px); }

.fo-b { font-size: clamp(20px, 2.345vw, 24px); }

img.img-sp { display: block; }
@media (min-width: 48em) { img.img-sp { display: none; } }
img.img-pc { display: none; }
@media (min-width: 48em) { img.img-pc { display: block; } }

#PagetopBtn { position: fixed; right: -44px; bottom: 16px; z-index: 900; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 0); filter: alpha(opacity = 0); opacity: 0; -webkit-transition: 0.3s ease-in; -moz-transition: 0.3s ease-in; transition: 0.3s ease-in; }
#PagetopBtn.visible { right: 16px; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100); filter: alpha(opacity = 100); opacity: 1; }
@media (min-width: 48em) { #PagetopBtn.visible { right: 40px; } }
#PagetopBtn a { outline: none; width: 48px; height: 48px; display: block; color: #252525; text-align: center; font-size: 16px; line-height: 45px; background-color: rgba(222, 255, 0, 0.9); -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
@media (min-width: 64em) { #PagetopBtn a:hover { -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 60); filter: alpha(opacity = 60); opacity: 0.6; } }
#PagetopBtn svg { transform: rotate(-90deg); }

.youtube-movie { width: 100%; overflow: hidden; position: relative; padding-bottom: 56.25%; margin-bottom: 10px; }
@media (min-width: 64em) { .youtube-movie { width: 820px; height: 480px; margin: 0 auto; position: relative; padding-bottom: 0; margin-bottom: 16px; } }
.youtube-movie iframe { position: absolute; top: 0; left: 0; min-width: 100%; min-height: 100%; width: 100%; height: 100%; }
@media (min-width: 64em) { .youtube-movie iframe { position: relative; top: 0; left: 0; width: 820px; height: 480px; min-width: 820px; min-height: 480px; } }
.youtube-movie-w100 { width: 100%; overflow: hidden; position: relative; padding-bottom: 56.25%; }
@media (min-width: 64em) { .youtube-movie-w100 { display: inline-block; vertical-align: top; margin: 0 auto; overflow: auto; position: relative; padding-bottom: 0; } }
.youtube-movie-w100 iframe { position: absolute; top: 0; left: 0; min-width: 100%; min-height: 100%; width: 100%; height: 100%; }
@media (min-width: 64em) { .youtube-movie-w100 iframe { position: relative; top: 0; left: 0; min-width: 100%; min-height: 560px; width: 100%; height: 560px; } }

#svgicon { display: block; width: 0; height: 0; overflow: hidden; }

.tel-link a { color: currentColor; }

.anchor-link { margin-top: -64px !important; padding-top: 64px !important; }
@media (min-width: 48em) { .anchor-link { margin-top: -64px !important; padding-top: 64px !important; } }

.box-com { position: relative; margin: auto; max-width: 1260px; }
.box-com.bg { background-color: #fff; border-radius: 2.0rem; -webkit-box-shadow: 0 0.8rem 3.2rem rgba(16, 19, 52, 0.12); -moz-box-shadow: 0 0.8rem 3.2rem rgba(16, 19, 52, 0.12); box-shadow: 0 0.8rem 3.2rem rgba(16, 19, 52, 0.12); }
.box-com.width { max-width: 1440px; }

.bg-white { position: relative; padding: 2.4rem 0; background-color: #fff; }

.bg-gray { position: relative; padding: 2.4rem 0; background-color: #F0F4F5; }

.bg-gray-dark { position: relative; padding: 2.4rem 0; background-color: #E8EEF0; }

.sns-link { fill: #252525; }
.sns-link.white { fill: #fff; }
.sns-link ul { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.sns-link li { margin: 5px; width: 24px; font-size: 0; }
@media (min-width: 48em) { .sns-link li { margin: 8px; width: 30px; } }
.sns-link .sns-x { width: 22px; }
@media (min-width: 48em) { .sns-link .sns-x { width: 28px; } }
.sns-link .sns-youtube { width: 30px; }
@media (min-width: 48em) { .sns-link .sns-youtube { width: 36px; } }

.arrow { width: 12px; height: auto; fill: #252525; }

.container { position: relative; margin-inline: auto; width: 100%; max-width: 1260px; }

.container-small { position: relative; margin-inline: auto; width: 100%; max-width: 1024px; }

.container-980p { position: relative; margin-inline: auto; width: 100%; max-width: 980px; }

.button-base { display: flex; font-size: clamp(14px, 2.5vw, 16px); font-weight: 700; }
.button-base.center { justify-content: center; }
.button-base.right { justify-content: flex-end; }
.button-base.white a { border-color: #fff; color: #fff !important; }
.button-base.white a::before { background-image: url("img/icon/arrow_w.svg"); }
.button-base.white a::after { background-color: rgba(255, 255, 255, 0.15); }
.button-base.white a:hover { opacity: 1; background-color: #fff; color: #252525 !important; }
.button-base.white a:hover::after { background-color: #252525; }
.button-base a { position: relative; display: flex; justify-content: center; align-items: center; max-width: 480px; width: 100%; height: 56px; border: 1px solid #252525; border-radius: 64px; color: #252525 !important; text-decoration: none !important; }
.button-base a::before { content: ''; z-index: 1; position: absolute; top: 50%; right: 22px; width: 11px; height: 10px; background-image: url("img/icon/arrow.svg"); background-repeat: no-repeat; background-position: top center; background-size: 11px 10px; transform: translateY(-50%); }
.button-base a::after { content: ''; z-index: 0; position: absolute; top: 50%; right: 8px; width: 40px; height: 40px; background-color: rgba(150, 150, 150, 0.15); border-radius: 40px; transform: translateY(-50%); -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; }
.button-base a:hover { opacity: 1; background-color: #252525; color: #fff !important; }
.button-base a:hover::after { background-color: white; }

.main-logo { color: #fff; font-family: "Zen Maru Gothic", sans-serif; font-weight: 700; text-align: center; }
.main-logo .title { position: relative; margin: 0; display: inline-block; line-height: 1.25; }
.main-logo .title-sub { margin: 0 0 0.5rem; font-size: 3vw; }
@media (min-width: 48em) { .main-logo .title-sub { font-size: clamp(0.625rem, 2.08333vw, 1.5rem); } }
.main-logo .title-sub span { display: inline-block; font-size: 5vw; margin: 0 -2.0%; }
@media (min-width: 48em) { .main-logo .title-sub span { font-size: clamp(1.125rem, 3.125vw, 2.5rem); } }
.main-logo .title-main { margin: 0; font-size: 8.5vw; line-height: 1.15; }
@media (min-width: 48em) { .main-logo .title-main { font-size: clamp(2rem, 5.2083333vw, 3.6rem); } }
.main-logo .title-main span { display: block; margin-block-start: 0.5rem; font-size: 5vw; }
@media (min-width: 48em) { .main-logo .title-main span { font-size: clamp(1.25rem, 2.6041vw, 2.5rem); } }
.main-logo .title-icon { position: absolute; top: 11%; left: -10%; width: 24%; }
.main-logo .title-icon img { width: 100%; height: auto; }
@media (min-width: 48em) { .main-logo .title-icon { top: -35%; left: -14%; width: 20%; } }
.main-logo .date { margin-block-start: 1.5rem; display: flex; flex-direction: column; align-items: center; line-height: 1.25; letter-spacing: 0.08em; }
.main-logo .date-day { margin: 0; padding-inline-start: 8px; font-size: 2.0rem; }
.main-logo .date-day span { display: inline-block; font-size: 1.125rem; }
.main-logo .date-day .week { display: inline-block; margin-left: -8px; font-style: normal; }
@media (min-width: 48em) { .main-logo .date-day { padding-inline-start: 16px; font-size: 2.8rem; }
  .main-logo .date-day span { font-size: 1.75rem; }
  .main-logo .date-day .week { margin-left: -16px; } }
.main-logo .date-time { margin: 0; font-size: 1.25rem; }
@media (min-width: 48em) { .main-logo .date-time { font-size: 2.0rem; } }
.main-logo .location { display: flex; justify-content: center; margin-block-start: 1.5rem; font-size: 0.75rem; }
@media (min-width: 48em) { .main-logo .location { font-size: 1.125rem; } }
.main-logo .location a, .main-logo .location span { display: inline-block; padding: 8px 30px; border: 1px solid #fff; border-radius: 30px; }

.header--base { z-index: 1; width: 100%; padding: 0 10px; background-color: #fff; }

.header--base-container { display: flex; justify-content: space-between; align-items: center; height: 60px; }
.header--base-container .logo { margin: 0; font-size: 16px; letter-spacing: -0.07em; }
@media (min-width: 48em) { .header--base-container .logo { font-size: 18px; } }
.header--base-container .logo a { color: #111; }
.header--base-container .link { font-size: 14px; line-height: 1; font-weight: 700; }
.header--base-container .link a { display: flex; justify-content: center; align-items: center; height: 40px; padding: 0 20px; background-color: #FF0000; border-radius: 30px; color: #fff; }

.header--nav { position: sticky; top: 0; width: 100%; background-color: #08237df5; z-index: 1000; }

.header--nav-container { display: flex; justify-content: center; }
.header--nav-container ul { display: flex; justify-content: center; align-items: stretch; margin: 0; padding: 0; list-style: none; border-left: 1px solid #fff; }
.header--nav-container li { border-right: 1px solid #fff; font-size: clamp(0.75rem, 1.5625vw, 1.125rem); line-height: 1.25; font-weight: 700; text-align: center; }
.header--nav-container a { position: relative; display: flex; align-items: center; height: 100%; padding: 10px 20px 20px 20px; color: #fff; }
@media (min-width: 48em) { .header--nav-container a { padding: 15px 40px 30px 40px; } }
.header--nav-container svg { position: absolute; left: 50%; bottom: 6px; margin-block-start: 8px; width: 7px; height: auto; transform: translateX(-50%) rotate(90deg); fill: #fff; }

.footer { position: relative; padding: 4.0rem 2.0rem 6.0rem; background-color: #020723; background-position: center center; background-image: url("img/bg/bg_main_sp.jpg"); background-repeat: no-repeat; background-size: cover; color: #fff; }
@media (min-width: 48em) { .footer { padding: 6.0rem 2.0rem; background-image: url("img/bg/bg_main.jpg"); } }
.footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: #08247D40; }
.footer a { color: #fff; }

.footer--main { position: relative; }

.footer--link { display: flex; flex-wrap: wrap; justify-content: center; margin: 2.0rem 0; padding: 0; list-style: none; text-align: center; font-weight: 700; font-size: 1rem; }
@media (min-width: 48em) { .footer--link { font-size: 1.25rem; } }
.footer--link li { padding: 0.25rem 0.5rem; }
@media (min-width: 48em) { .footer--link li { padding: 0.5rem 1rem; } }

.footer--banner { position: relative; margin: 3.0rem 0 1.5rem; }
.footer--banner ul { margin: 0; padding: 0; list-style: none; text-align: center; }
@media (min-width: 48em) { .footer--banner ul { display: flex; justify-content: center; } }
.footer--banner li { position: relative; padding: 1rem; margin: auto; max-width: 380px; font-weight: 700; }
@media (min-width: 48em) { .footer--banner li { margin: 0; min-width: 380px; } }
.footer--banner a, .footer--banner span { position: relative; display: block; padding: 1.5rem; border: 2px solid #fff; border-radius: 10px; color: #fff; z-index: 1; }
.footer--banner a > i, .footer--banner span > i { position: absolute; top: -18px; left: 10px; padding: 5px 10px; font-style: normal; font-size: 14px; background-color: #FF0000; border-radius: 20px; color: #fff; }

.footer--copy { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0; text-align: center; font-weight: 500; font-size: 14px; }

#contactLink { position: fixed; right: -100px; bottom: 1rem; z-index: 900; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 0); filter: alpha(opacity = 0); opacity: 0; -webkit-transition: 0.3s ease-in; -moz-transition: 0.3s ease-in; transition: 0.3s ease-in; }
#contactLink.visible { right: 1rem; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100); filter: alpha(opacity = 100); opacity: 1; }
@media (min-width: 48em) { #contactLink.visible { right: 2.0rem; } }
#contactLink a { outline: none; width: 100px; height: 100px; border: 3px solid #ffffffee; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; font-size: 18px; font-family: "Zen Maru Gothic", sans-serif; line-height: 1.25; font-weight: 700; color: #fff; background-color: #ff0000cf; box-shadow: 0 0 10px #00000026; border-radius: 100%; }
@media (min-width: 48em) { #contactLink a { width: 120px; height: 120px; } }
@media (min-width: 64em) { #contactLink a:hover { opacity: 0.6; } }
#contactLink a span { display: block; font-size: 14px; }
#contactLink svg { transform: rotate(-90deg); }

.top--main-title { margin-block: 0 2.4rem; font-size: clamp(1.625rem, 3.3854vw, 3rem); font-family: "Zen Maru Gothic", sans-serif; text-align: center; }

.top--overview { margin-block: 2rem; font-size: 1.125rem; text-align: center; }

.top--soon-box { display: flex; justify-content: center; align-items: center; width: 100%; background-color: #fff; border-radius: clamp(20px, 2.60416vw, 40px); text-align: center; min-height: 300px; font-size: clamp(1.25rem, 2.6041vw, 2.5rem); font-weight: 700; }

.top--radius { border-top-left-radius: clamp(40px, 5.2083vw, 80px); border-top-right-radius: clamp(40px, 5.2083vw, 80px); }

.top--main { position: relative; min-height: 560px; padding: 3.0rem 1.0rem 4.0rem 1.0rem; border-bottom: 1px solid #fff; overflow: hidden; background-position: center center; background-image: url("img/bg/bg_main_sp.jpg"); background-repeat: no-repeat; background-size: cover; }
@media (min-width: 48em) { .top--main { background-image: url("img/bg/bg_main.jpg"); } }
.top--main::before { content: ''; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: #08247D40; }

.top--main-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; }

.top--company { margin: 2rem; padding: 2rem 1rem; background-color: #E8EEF0; border-radius: clamp(20px, 2.60416vw, 40px); }

.top--eventinfo { position: relative; margin-block-start: 4.0rem; padding: 3.0rem 2.0rem 4.0rem 2.0rem; overflow: hidden; background-color: #020723; background-position: bottom center; background-image: url("img/bg/bg_info.jpg"); background-repeat: no-repeat; background-size: contain; background-attachment: fixed; }
.top--eventinfo::before { content: ''; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background-color: #08247D40; }
@media (min-width: 48em) { .top--eventinfo { padding: 6.0rem 2.0rem 8.0rem; } }

.event-info-table { border-top: 2px solid #fff; color: #fff; }
.event-info-table dl { margin: 0; display: flex; align-items: stretch; border-bottom: 2px dotted #fff; }
.event-info-table dt { margin: 0; padding: 1rem; width: 30%; font-weight: 700; background-color: #00106F90; }
@media (min-width: 48em) { .event-info-table dt { width: 20%; } }
.event-info-table dd { flex: 1; margin: 0; padding: 1rem; font-weight: 500; background-color: #03134690; }
.event-info-table a { color: #fff; text-decoration: underline; }

.top--faq { position: relative; padding: 3.0rem 2.0rem 4.0rem 2.0rem; }
@media (min-width: 48em) { .top--faq { padding: 4.0rem 2.0rem 6.0rem 2.0rem; } }

.faq-item { background-color: #fff; border: 1px solid #ddd; border-radius: 20px; margin-bottom: 5px; overflow: hidden; transition: all 0.3s ease; }

.faq-question { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; font-size: clamp(1.125rem, 2.34375vw, 1.25rem); font-weight: 700; cursor: pointer; list-style: none; /* デフォルトの三角矢印を消す */ }
.faq-question > div { display: flex; align-items: center; width: 100%; }
.faq-question i { margin-inline-end: 10px; display: flex; justify-content: center; align-items: center; font-style: normal; font-size: 30px; line-height: 1; padding-bottom: 5px; background-color: #0EFE58; border-radius: 50%; width: 60px; height: 60px; }
.faq-question span { flex: 1; line-height: 1.25; }

.faq-question::-webkit-details-marker { display: none; }

.faq-question::after { content: "+"; font-size: 30px; color: #333; transition: transform 0.3s ease; }

.faq-item[open] { background-color: #fff; border-color: #dddddd; /* 開いた時の枠線カラー（青） */ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); }

.faq-item[open] .faq-question::after { transform: rotate(45deg); color: #0EFE58; }

.faq-answer { padding: 0 20px 16px 20px; line-height: 1.6; border-top: 1px solid #eee; background-color: #fff; font-weight: 400; }

.faq-answer p { margin: 12px 0 0 0; }

.top--info { position: relative; background-color: #D9F2F3; padding: 3.0rem 2.0rem 4.0rem 2.0rem; }
@media (min-width: 48em) { .top--info { padding: 6.0rem 2.0rem 8.0rem; } }

.info-detail { padding: 1.5rem; border-radius: clamp(10px, 1.30208vw, 20px); border: 5px solid #C8E3E5; background-color: #fff; }
@media (min-width: 48em) { .info-detail { padding: 2.5rem; } }

.info-detail-table { margin: 0 auto; max-width: 800px; }
.info-detail-table .title { position: relative; margin: 0; padding: 0.5rem 0 0 2rem; border-bottom: 2px solid #08247D; color: #08247D; font-size: clamp(1.125rem, 2.34375vw, 1.25rem); list-style: 1.5; font-weight: 700; }
.info-detail-table .title::before { content: ''; position: absolute; bottom: -9px; left: 0; width: 16px; height: 16px; border-radius: 30px; background-color: #08247D; }
.info-detail-table dl { margin: 0; width: 100%; display: flex; flex-direction: column; border-bottom: 1px solid #ddd; }
@media (min-width: 48em) { .info-detail-table dl { flex-direction: row; align-items: stretch; } }
.info-detail-table dt { margin: 0; padding: 1rem 1rem 0 2.0rem; font-weight: 700; }
@media (min-width: 48em) { .info-detail-table dt { width: 24%; padding-inline-start: 2.0rem; } }
.info-detail-table dd { flex: 1; margin: 0; padding: 0.25rem 1rem 1rem 2.0rem; font-weight: 500; }
@media (min-width: 48em) { .info-detail-table dd { padding: 1rem; } }

.info-detail-contact { padding: 2.0rem; margin-block-start: 3.0rem; background-color: #F11111; border-radius: clamp(10px, 1.30208vw, 20px); font-weight: 500; }

.contact-deadline { text-align: center; color: #fff; }
.contact-deadline .title { margin: 0; font-size: clamp(1.25rem, 2.6041vw, 2.5rem); font-weight: 700; }

.contact-detail { margin-block-start: 2rem; padding: 1.0rem; background-color: #fff; border-radius: clamp(10px, 1.30208vw, 20px); text-align: center; }
.contact-detail .title { margin: 1rem 0 0; font-size: 1.125rem; }

/*# sourceMappingURL=style.css.map */
