@charset "UTF-8";
/* サイト共通のヘッダー・メニュー・フッター（inc/g_nav.php・inc/footer.php から読み込む）
   旧 miross_academy.css と同じ ID を避けるため、フッターは maf_ で始まる名前にしている */

:root {
  --mac_red: #f31540;
  --mac_text: #2e2949;
  --mac_border: #dcdbda;
}

:where(#site_header, #menu_overlay, .ma_footer) *,
:where(#site_header, #menu_overlay, .ma_footer) *::before,
:where(#site_header, #menu_overlay, .ma_footer) *::after { box-sizing: border-box; margin: 0; padding: 0; }
:where(#site_header, #menu_overlay, .ma_footer) img { display: block; max-width: 100%; vertical-align: top; }
:where(#site_header, #menu_overlay, .ma_footer) ul { list-style: none; }

#site_header, #menu_overlay, .ma_footer { box-sizing: border-box; font-family: 'hiragino-kaku-gothic-pron','Hiragino Kaku Gothic ProN','Hiragino Sans','Avenir','Lato', sans-serif; font-size: 16px; line-height: 1.7; color: var(--mac_text); text-align: left; }
#site_header a, #menu_overlay a, .ma_footer a { font-weight: normal; text-decoration: none; }
.ma_footer a { color: var(--mac_text); }
#site_header a:hover img, .ma_footer a:hover img { filter: none; }
#site_header h1 { margin: 0; padding: 0; font-size: inherit; font-weight: normal; background: none; border: none; }
.header_burger { padding: 0; font-size: 16px; line-height: 1; appearance: none; -webkit-appearance: none; }
html.ma_menu_open, html.ma_menu_open body { overflow: hidden; }
.ma_header_spacer { height: 56px; }
#header_wrap.ma_top_anchor { position: absolute; top: 0; left: 0; width: 0; height: 0; padding: 0; margin: 0; overflow: hidden; background: none; }

/* HEADER */
#site_header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: transparent; border-bottom: 0.5px solid transparent; height: 3.5em; display: flex; align-items: center; justify-content: space-between; padding: 0 1em; transition: background 0.4s ease, border-color 0.4s ease; } 
#site_header.is_scrolled { background: #fff; border-bottom: 0.5px solid var(--mac_border); }
#site_header.is_scrolled a { color: var(--mac_text); }
.header_logo { font-size: 0.75em; letter-spacing: 0.18em; color: var(--mac_text); font-weight: 400; }
.header_logo img.logo_default { height: 50px; margin-top: 0.5em; transition: color 0.4s ease; }
.header_logo img.logo_scrolled { height: 35px; width: auto; transition: color 0.4s ease; }
.logo_scrolled { display: none; }
#site_header.is_scrolled .logo_default { display: none; }
#site_header.is_scrolled .logo_scrolled { display: block; }

.header_nav { display: flex; gap: 1.5em; align-items: center; }
.header_nav a { font-size: 0.9em; letter-spacing: 0.06em; color: #b70024; transition: color 0.4s ease; }
.header_right { display: flex; align-items: center; gap: 0; padding-right: 2.5em; } 
.header_burger { position: fixed; top: 1.2em; right: 1em; z-index: 300; display: flex; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; }
.header_burger span { display: block; width: 22px; height: 1.5px; background: var(--mac_text); transition: all 0.3s; }
.header_burger.is_open span { background: #fff; } .header_burger.is_open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.header_burger.is_open span:nth-child(2) { opacity: 0; }
.header_burger.is_open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

@media (max-width: 1000px) { 
  .header_nav { display: none; } 
 }

/* MENU OVERLAY */
#menu_overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--mac_text); z-index: 200; transform: translateX(100%); transition: transform 0.4s cubic-bezier(0.77,0,0.175,1); overflow-y: auto; display: flex; flex-direction: column; padding: 5em 2em 3em; text-align: center; }
#menu_overlay.is_open { transform: translateX(0); }
.menu_member {  padding: 1.5em; margin: 0 auto 2em auto; max-width: 400px; width: 100%; }
.menu_member p { font-size: 0.9em; color: rgba(255,255,255,0.7); letter-spacing: 0.15em; margin-bottom: 0.75em; }
.menu_member a { background: #FFF; display: block; font-size: 1em; color: var(--mac_text); padding: 0.6em 0; letter-spacing: 0.05em; margin-bottom: 0.2em; }
.menu_member a:last-child { background: var(--mac_red); color: #fff;}
.menu_nav_group { margin: 2em auto; max-width: 400px; width: 100%; }
.menu_nav_group strong { display: block; font-size: 0.9em; letter-spacing: 0.18em; color: rgba(255,255,255,0.7); margin-bottom: 0.75em; font-weight: 400; }
.menu_nav_group a { display: block; letter-spacing: 0.06em; color: #fff; padding: 0.75em 0; border-bottom: 0.5px solid rgba(255,255,255,0.1); }
.menu_nav_group a:last-child { border-bottom: none; }
.menu_login_state { display: block; }

.ma_footer { background-color: #ffffff; }

#maf_wrap { padding: 4em 0em; }
#maf_wrap .maf_flex_wrap { display: flex; padding: 0em; }
#maf_wrap .maf_flex_wrap .maf_box_40 { width: 30%; padding-right: 3em; }
#maf_wrap .maf_flex_wrap .maf_box_60 { width: 70%; }
#maf_wrap #maf_sitelogo img { width: 250px; }

#maf_wrap .maf_flex_wrap:nth-child(2) { flex-direction: row-reverse; }

#maf_wrap .maf_flex_wrap #maf_sns ul { display: flex; gap: 1em; }
#maf_wrap .maf_flex_wrap #maf_sns ul li a img { width: auto; height: 35px; }

#maf_contact_area { padding: 0em 0em 2em 0em; }
#maf_contact_area a { color: var(--mac_text);}
#maf_contact_area #maf_contact_kobe { font-size: 15px; font-weight: normal; margin-bottom: 2em; }
#maf_contact_area #maf_contact_kobe span { display: block; line-height: 1.6em; }

#maf_box { background-color: #f31540; padding: 0em; color: #FFF; }
#maf_box .maf_inner { display: flex; justify-content: space-between; flex-direction: row-reverse; align-items: center; margin: 0em auto; padding: 1em 0em; }
#maf_box .maf_inner p { margin-bottom: 0em; }
#maf_box .maf_inner #maf_copyright { display: block; font-size: 12px; }
#maf_box .maf_inner div:nth-child(2) { text-align: right; display: flex; }
#maf_box .maf_inner a { line-height: 1.3em; padding: 0.3em 0em; color: #FFF; }
#maf_box .maf_inner #maf_cookie_setting { margin-bottom: 0em; }
#maf_box .maf_inner #maf_cookie_setting a { font-size: 12px; font-weight: normal; }
#maf_box .maf_inner #maf_cookie_setting a:nth-child(1) { margin-right: 1em; }

#maf_map_box_wrap { width: 100%; overflow: hidden; font-size: 15px; z-index: 3; }
#maf_map_box_wrap a { color: #FFF; font-weight: normal; } 
#maf_map_box_wrap .contents { padding-bottom: 0px; }

#maf_map_box { width: 100%; } 
#maf_map_box a { color: var(--mac_text); font-weight: normal; font-size: 0.9em;  }

#maf_map_01 { margin: 0em 0em 3em 0em; }
#maf_map_01 ul { display: flex; justify-content: space-between; flex-wrap: wrap; }
#maf_map_01 ul li { width: 25%; border-right: #dcdbda solid 1px; } 
#maf_map_01 ul li a { width: 100%; font-size: 0.9em; text-align: center; position: relative; display: inline-block; transition: .3s; }
#maf_map_01 ul li a span { font-weight: bold; } 
#maf_map_01 ul li:nth-child(1) a { border-left: #dcdbda solid 1px;}

#maf_bc_wrap { display: flex; justify-content: space-between; flex-wrap: wrap; align-items: stretch; } 

#maf_bc_wrap ul li a { display: flex; align-items: center; gap: .75em; transition: transform .35s cubic-bezier(.22,1,.36,1), color .35s cubic-bezier(.22,1,.36,1); will-change: transform; }
#maf_bc_wrap ul li a::before { content: "›"; flex-shrink: 0; color: #F31540; font-size: 1.6em; line-height: 1; transform: translateY(-.09em);}
#maf_bc_wrap ul li a:hover { transform: translateX(4px); }

#maf_bc_wrap ul li a span { display: block; flex: 1; }

#maf_map_02 { border: #dcdbda solid 1px; border-radius: 10px;}
#maf_map_02 div { width: 100%; padding: 0.4em; font-weight: 700; border-bottom: #dcdbda solid 1px; text-align: center; }
#maf_map_02 div span:nth-child(1) { width: 100%; display: inline; padding-top: 1em;  }
#maf_map_02 ul { width: 100%; padding: 1em; }
#maf_map_02 ul li a { padding: 0.3em 0em; display: flex; justify-content: space-between; }

#maf_map_02 { width: 65%; }
#maf_map_03 { width: 32%; } 
#maf_map_03 ul li a { display: flex; justify-content: space-between; padding: 0.4em 0em; border-bottom: #dcdbda solid 1px; }

@media screen and (max-width: 1200px) {
  #maf_bc_wrap { display: block; } #maf_map_03, #maf_map_02 { width: 100%; }
  #maf_map_02 { margin: 1em 0em 1.25em 0em; }
}

@media screen and (max-width: 768px) {
  #maf_wrap { padding: 1em 0em ; }
  #maf_wrap .maf_flex_wrap { display: block; }
  #maf_wrap .maf_flex_wrap .maf_box_40 { width: 100%; padding-right: 0em;  }
  #maf_wrap .maf_flex_wrap .maf_box_60 { width: 100%; }
  #maf_wrap #maf_sitelogo img { width: 98%; margin: 1.5em auto 2em auto; }
  #maf_contact_area { padding: 4em 0em 2em 0em; margin: 0em; }
  #maf_map_01 { margin: 0em; }
  #maf_map_03 ul li a { padding: 0.5em 0em; width: calc(100% - 2em); margin: 0 auto; }
  #maf_contact_area #maf_contact_kobe { text-align: center; }
  #maf_map_box_wrap .contents { width: 100%; margin: 0em; }
  #maf_wrap .maf_flex_wrap #maf_sns ul { justify-content: center; margin-bottom: 2em; }
  #maf_box .maf_inner { padding: 1em; display: block; text-align: center; font-size: 15px; }
  #maf_box .maf_inner p { margin-bottom: 1em; }
  #maf_box .maf_inner #maf_copyright { text-align: center;font-size: 13px; font-weight: normal; }
}

@media screen and (max-width: 520px) {
  #maf_map_box_wrap { padding-top: 0em; } 
  #maf_map_01 { margin: 0em 0em 0em 0em; }
  #maf_map_01 ul li { width: calc(50% - 0.25em); margin: 0.25em 0em; padding: 0.2em; border: #dcdbda solid 1px; }
  #maf_map_01 ul li:nth-child(1) a { border-left: #b5bbd0 solid 0px; }
}

.maf_inner { margin: 0 auto; }
@media screen and (min-width: 1601px) { .maf_inner { width: 1260px; } }
@media screen and (max-width: 1600px) { .maf_inner { width: 75%; } }
@media screen and (max-width: 1200px) { .maf_inner { width: 85%; } }
@media screen and (max-width: 768px)  { .maf_inner { width: calc(100% - 2em); } }

/* ボタン（共通部品）
   ma_btn に種類を足して使う: ma_btn_pill＝赤の丸型 / ma_btn_cta＝グラデーション / ma_btn_line＝線のみ */
a.ma_btn { display: inline-block; text-align: center; text-decoration: none; }
a.ma_btn_pill { background: var(--mac_red); color: #fff !important; padding: 0em 1.2em; line-height: 3em; font-size: 0.85em; letter-spacing: 0.06em; border-radius: 2em; }
a.ma_btn_cta { background: linear-gradient(90deg, #ff8a00, #ff5536, #ff8a00); color: #fff; font-weight: bold; font-size: 0.95em; padding: 0.9em 2.2em; border-radius: 8px; transition: opacity 0.8s ease, transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.5s ease; }
a.ma_btn_cta:hover { transform: translateY(-4px); box-shadow: 0 4px 8px rgba(220, 0, 43, 0.5); animation: ma_btn_float 1.8s ease-in-out infinite; opacity: 1; }
a.ma_btn_line { display: block; width: 15em; font-size: 13px; border: #dcdbda solid 1px; padding: 0.2em 0.5em; margin-bottom: 1em; }
@keyframes ma_btn_float {
  0%, 100% { transform: translateY(-2px); }
  50% { transform: translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
  a.ma_btn_cta { animation: none; transition: none; }
}
@media screen and (max-width: 768px) {
  a.ma_btn_line { margin: 0em auto 1em auto; }
}