@charset "utf-8";
/* CSS Document */

body { font-size:calc(20 * 0.2vw); line-height: 1.8; }
:target { scroll-margin-top: calc(140vw / 7.8); }


.pc { display:none; }
.sp { display:block; }



.sp_left { text-align:left; }

.fs10vw { font-size:calc(10 * 0.22vw); }
.fs12vw { font-size:calc(12 * 0.22vw); }
.fs14vw { font-size:calc(14 * 0.22vw); }
.fs15vw { font-size:calc(15 * 0.20vw); }
.fs16vw { font-size:calc(16 * 0.20vw); }
.fs17vw { font-size:calc(17 * 0.20vw); }
.fs18vw { font-size:calc(18 * 0.20vw); }
.fs20vw { font-size:calc(20 * 0.20vw); }
.fs21vw { font-size:calc(20 * 0.18vw); }
.fs22vw { font-size:calc(22 * 0.18vw); }
.fs23vw { font-size:calc(23 * 0.18vw); }
.fs24vw { font-size:calc(24 * 0.18vw); }
.fs25vw { font-size:calc(25 * 0.17vw); }
.fs26vw { font-size:calc(26 * 0.17vw); }
.fs27vw { font-size:calc(27 * 0.17vw); }
.fs28vw { font-size:calc(28 * 0.17vw); }
.fs29vw { font-size:calc(29 * 0.17vw); }
.fs30vw { font-size:calc(30 * 0.16vw); }
.fs32vw { font-size:calc(32 * 0.16vw); }
.fs33vw { font-size:calc(33 * 0.16vw); }
.fs34vw { font-size:calc(34 * 0.16vw); }
.fs35vw { font-size:calc(35 * 0.16vw); }
.fs36vw { font-size:calc(36 * 0.15vw); }
.fs37vw { font-size:calc(37 * 0.15vw); }
.fs38vw { font-size:calc(38 * 0.15vw); }
.fs40vw { font-size:calc(40 * 0.15vw); }
.fs42vw { font-size:calc(42 * 0.14vw); }
.fs44vw { font-size:calc(44 * 0.14vw); }
.fs45vw { font-size:calc(45 * 0.14vw); }
.fs46vw { font-size:calc(45 * 0.14vw); }
.fs48vw { font-size:calc(48 * 0.14vw); }
.fs50vw { font-size:calc(50 * 0.14vw); }
.fs52vw { font-size:calc(52 * 0.14vw); }
.fs54vw { font-size:calc(54 * 0.12vw); }
.fs55vw { font-size:calc(55 * 0.12vw); }
.fs56vw { font-size:calc(56 * 0.12vw); }
.fs58vw { font-size:calc(58 * 0.12vw); }
.fs60vw { font-size:calc(60 * 0.1vw); }
.fs64vw { font-size:calc(64 * 0.1vw); }
.fs65vw { font-size:calc(65 * 0.1vw); }
.fs66vw { font-size:calc(66 * 0.1vw); }
.fs68vw { font-size:calc(68 * 0.1vw); }
.fs70vw { font-size:calc(70 * 0.1vw); }
.fs72vw { font-size:calc(72 * 0.1vw); }
.fs73vw { font-size:calc(73 * 0.1vw); }
.fs80vw { font-size:calc(80 * 0.1vw); }
.fs87vw { font-size:calc(87 * 0.1vw); }
.fs90vw { font-size:calc(90 * 0.1vw); }
.fs100vw { font-size:calc(100 * 0.1vw); }
.fs107vw { font-size:calc(107 * 0.08vw); }
.fs110vw { font-size:calc(110 * 0.08vw); }




.ttl { margin-block-end: 1em; }
.ttl2 .illust11 { top: -2em; left: -3em; }

.more { width: 70%; height: calc(70vw / 5); margin-block-start: 2em; }
.more .circle { width: calc(40vw / 7.2); height: calc(40vw / 7.2); }
.next .circle { width: calc(40vw / 7.2); height: calc(40vw / 7.2); }

.decoration { width:300%; }
.decoration .loop { animation: loop 30s linear infinite; }
.decoration .loop.second { animation: loop 30s -15s linear infinite; }


.shading,
.shading_white { background-size: 3vw 3vw; }


.inner { width: 94% }
.wide_inner { width: 94% }
.roomy_inner { width: 94% }
.middle_inner { width: 94% }
.low_inner { width: 94%; }
.narrow_inner { width: 94% }
.minimum_inner { width: 94%; }

.inner_left { width: 100%; }





#header { height: calc(140vw / 7.8); }
#header .logo { width: calc(500vw / 7.2); line-height: 1.5; }
#header .logo .link .logo_mark { width: calc(163vw / 7.2); }

#header #hamburger { display: block; caret-color: transparent; width: calc(100vw / 7.2); height: calc(80vw / 7.2); border-radius: 0.25em; z-index: 1001; }


#header #hamburger .bar {
	display: block; width: calc(50vw / 7.2); height: 2px; margin-left: auto; margin-right: auto;
	transition: transform 0.3s ease, opacity 0.3s ease;transform-origin: center center; transform: none;
}


#header #hamburger .bar_1 { margin-block-end:calc(10vw / 7.2); }
#header #hamburger .bar_2 { margin-block-end:calc(10vw / 7.2); }

#header #hamburger.active .bar_1 { transform: translateY(var(--offset)) rotate(27.5deg); width: calc(56vw / 7.2); }
#header #hamburger.active .bar_2 { opacity:0; }
#header #hamburger.active .bar_3 { transform: translateY(calc(var(--offset) * -1)) rotate(-27.5deg); width: calc(56vw / 7.2); }




#header #drawer {
	position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);display: flex; opacity:0;transition: opacity 0.3s ease; pointer-events:none;
	justify-content: flex-start;align-items: flex-start;z-index: 1000;
}
#header #drawer.open {opacity:1; pointer-events:auto;}

#header #drawer .drawer-content {width: 100%;height: 100%;transform: translateX(200%);transition: transform 0.3s ease; padding: 6em 1.7em 2em 1.7em; }
#header #drawer.open .drawer-content { transform: translateX(0); overflow-y: scroll; }


#header #drawer .drawer-content .header_menu { display: block; width: 100%; }
#header #drawer .drawer-content .menu_list { display:block; margin: 0 0 3em 0; padding:0; width: 100%; }
#header .header_menu .menu_list li { margin: 0 2em 2em 2em; font-weight: 600; }


#header .courses_link { pointer-events:none; }
#header .courses_cat { list-style-type:none; padding: 0; margin: 1em 0 0 0; }
#header .header_menu .courses_cat li { font-weight: 500; margin: 0 0 1em 0; }




#header .apply_btn { margin: 1.75em auto 1.75em auto; width: calc(500vw / 7.2); height: calc(100vw / 7.2); }
#header .email_btn { margin: 1.75em auto 1.75em auto; width: calc(500vw / 7.2); height: calc(100vw / 7.2); }


.bottom_contact { padding: 3em 0 4em 0; }
.bottom_contact .contact_box { display: block; }
.bottom_contact .contact_box .text { width: 100%; }
.bottom_contact .contact_box .text:first-of-type { border-right: none; border-bottom: solid 1px #6B6B6B; }

.bottom_contact .contact_box .text .type { width: calc(400vw / 7.2); height: calc(60vw / 7.2); }

.bottom_contact .contact_box .text .btn { margin: 1.5em 0 1em 0; }




#footer { padding: 3em 0 4em 0; }

#footer .middle_inner.flex { display:block; }
#footer .footer_info { display: block; width: 100%; }

#footer .footer_info .text { display: block; text-align: center; margin: 0 auto 3em 0; width: 100%; }
#footer .footer_info .logo { display: block; width: calc(160vw / 7.2); margin: 0 auto 0.5em auto; }
#footer .footer_info .logo .logo_mark { display: block; width:100%; margin: 0 auto; text-align: center; }
#footer .footer_info .text .name { font-weight: 700; margin-block-end:0.5em; }

#footer .footer_menu_list { display: block; width: 100%; margin-block-end: 3em; }
#footer .footer_menu_list ul { display: block; width: 100%; }

#footer .btn_box { display: block; width: 100%; }

#footer .footer_menu_list ul li { margin: 0 0 1em 3em; }

#footer .apply_btn { margin: 1.75em auto 1.75em auto; width: calc(500vw / 7.2); height: calc(100vw / 7.2); }
#footer .email_btn { margin: 1.75em auto 1.75em auto; width: calc(500vw / 7.2); height: calc(100vw / 7.2); }




#page_top { bottom: 5vw; right: 4vw; width: calc(60vw / 6); height: calc(60vw / 6); }






main { padding-top:calc(140vw / 7.8); }



/* PCは place-content:center で縦中央寄せ。SPは上揃えにする（余った高さが上下に入るのを防ぐ） */
#fv { display: grid; place-content: start stretch; padding: 0; aspect-ratio: 43 / 43; background-position: center top; background-size: cover; }
#fv .fv_wrapper { display:block; }
#fv .text { width: 100%; position: relative; z-index: 2; }
#fv .text .catch { margin-block-end: 0; letter-spacing: 0.04em; text-align: left; }
#fv .text .table { display: block; width: 100%; margin: 0; padding: 1em 1em 1em 1em; }
#fv .text .table dt { display: block; width: 100%; }
#fv .text .table dd { display: block; padding: 0.75em 0 0 0; }

/* 「全国対応　講習会・受講生 募集中」は中央寄せで折り返す */
#fv .text .badge dt .call { white-space: normal; text-align: center; line-height: 1.5; }
#fv .text .badge dt .call .area { margin-right: 0.5em; }

/* 白い帯（ひし形なし・中央寄せ）※PCの左右振り分け（nth-of-type）を打ち消す */
#fv .text .badge dd .qualification,
#fv .text .badge dd .qualification:nth-of-type(1),
#fv .text .badge dd .qualification:nth-of-type(2) {
	width: 100%; margin: 0 0 0.6em 0; padding: 0.5em; border-radius: 0.25em; transform: none;
}
#fv .text .badge dd .qualification:last-of-type { margin-bottom: 0; }
#fv .text .badge dd .qualification span { transform: none; }

#fv .slide { position: absolute; inset: 1em 4% auto auto; width: calc(539vw / 14.2); }

#fv .text .sub_catch { text-shadow: 1px 1px 3px #FFFFFF; font-size: calc(23 * 0.16vw); }




#top_introduction { padding: 3em 0 4em 0; }
#top_introduction .top_introduction_wrapper { display: block; }
#top_introduction .text { width: 100%; }

#top_introduction .thumb {width: calc(570vw / 7.2); padding-top: 4em;}

#top_introduction .thumb::before {inset: 2em -3em auto auto; width: calc(402vw / 7.2); height: calc(438vw / 7.2);}


#top_introduction .thumb .thumb_img { width: calc(570vw / 7.2); }

#top_point { padding: 3em 0 4em 0; background-position: left bottom; }
#top_point .ttl { text-shadow: 1px 1px 3px #FFFFFF; }
#top_point .content { display: block; }
#top_point .box { width: 100%; margin-right: 0; }



#top_persons { padding: 3em 0 4em 0; }
#top_persons .content { display: block; }
#top_persons .box { width: 100%; }


#top_about { padding: 3em 0 4em 0; }
#top_about .top_about_logo { width:calc(240vw / 7.2); }


#top_voice { padding: 3em 0 4em 0; }
#top_voice .ttl { text-shadow: 1px 1px 3px #FFFFFF; }


#top_voice .voice_list { display: block; margin-block-start: 2em; }
#top_voice .box { width: 100%; margin-block-end: 2em; }
#top_voice .box .slug::after { width: calc(63vw / 7.2); height: calc(12vw / 7.2); }

#top_voice .box .thumb { width: calc(245vw / 5); }

#top_area { padding: 3em 0 4em 0; }

#top_area .summary { margin: 2em 0 0 0; }
#top_area .summary .label { padding: 0.4em 0.5em; width: 7em; text-align: center; }
#top_area .area_slider { margin-block-start: 2em; margin-block-end: 0; }
#top_area .box { margin-block-end: 0; flex: 0 0 calc(294vw / 7.2); width: calc(294vw / 7.2); }
#top_area .area_prev { left: calc(40vw / 7.2); top: calc(233vw / 7.2); width: calc(46vw / 7.2); height: calc(110vw / 7.2); }



#top_instructor { padding: 3em 0 0 0; }
#top_instructor .text { float:none; width: 94%; height: auto; margin: 0 auto; padding-bottom: 3em; }
#top_instructor .thumb { float:none; width: 100%; height: auto; }


#top_faq { padding: 3em 0 4em 0; }
#top_faq .top_faq { display: block; }
#top_faq .top_faq_header { width: 100%; }
#top_faq .content { width: 100%; }

#top_faq .ttl { text-align:center; margin-block-end: 2em; }

#top_faq .content .list dt { align-items: flex-start; padding: 1.25em 0.5em 1.25em 0.5em; }

#top_faq .content .list dt p { margin: 0.25em 1em 0 0; }
#top_faq .content .list dd .icon_a { margin-top: 0.45em; }
#top_faq .content .list dt i { inset: 0 0.5em 0 auto; }
#top_faq .content .list dd .a_inner { padding: 0.25em 0.75em 1.25em 0.75em; }

#top_faq .more { margin-block-start: 3em; }


#top_blog { padding: 3em 0 4em 0; }
#top_blog .top_blog_wrapper { display: block; margin-block-end: 0; }
#top_blog .blog_item { width: 100%; margin: 0 0 2em 0; }
#top_blog .blog_item:last-of-type { margin-block-end:1em; }
#top_blog .blog_item .thumb { margin-block-end: 0.5em; }


.page_header {
	background-size: cover; background-position: center top; width: 100%; height: calc(380vw / 7.2); aspect-ratio: 49 / 27;
}
.page_header .page_header_ttl { margin: 1.3em 0 1em 0; }

.page_box { inset: auto; }

.about_hero_wrapper { display: block; }
.about_hero .text { width: 100%; }
.about_hero .thumb { width: calc(591vw / 7.2); margin: 2em auto 0 auto; }

#philosophy .content { display: block; }

#philosophy .ttl { margin-block-end: 2em; }
#philosophy .thumb { width: 100%; margin-block-end: 1.5em; }
#philosophy .text { width: 100%; }


#mission { padding: 3em 0 4em 0; }
#mission .content { display: block; }
#mission .box { width: 100%; padding: 2.5em 1.75em 2.5em 1.75em; }
#mission .box dd .icon img { max-width: calc(116vw / 5); max-height: calc(100vw / 5); }

#mission .box .box_ttl::after { width: calc(43vw / 7.2); }


#profile { padding: 3em 0 4em 0; }


#profile .profile_row { display: block; }
#profile .profile_row dt { display: block; width: 100%; padding-bottom:0; }
#profile .profile_row dd { display: block; }

#profile .watermark { width: calc(840vw / 10.2); }

#profile .profile_row .biz_list li { margin-bottom:0.5em; }


/* legal（特定商取引法に基づく表記） */
#legal { padding: 3em 0 4em 0; }

#legal .legal_row { display: block; }
#legal .legal_row dt { display: block; width: 100%; padding-bottom: 0; }
#legal .legal_row dd { display: block; }
#legal .legal_row .pay_list li { margin-bottom: 0.5em; }





#about_cta { padding: 3em 0 4em 0; }

#about_cta .btn_box { display: block; }
#about_cta .course_btn { width: 19em; height: calc(100vw / 7.2); margin: 0 auto 1.5em auto; }


.about_hero .deco_left { inset: auto auto -3em 0;  }
#profile .deco_right { inset: auto 0 -3em auto; }
.instructor_hero .deco_left { inset: auto auto -3em 0; }
#instructor_list .deco_right { inset:auto 0 -7em auto }

.square_bottom_left { inset: auto auto -3em 0; }



.instructor_hero { padding: 0 0 4em 0; }

.instructor_hero_wrapper { display: block; }
.instructor_hero .text { width: 100%; }
.instructor_hero .thumb { width: calc(591vw / 7.2); margin: 2em auto 0 auto; }


#instructor_list { padding: 0 0 4em 0; }

#instructor_list .list_header { padding: 3em 0 5em 0; }

#instructor_list .instructor { margin-block-end: calc(80vw / 7.2); padding: 0; }
#instructor_list .instructor .text { float:none; width: 100%; }


#instructor_list .instructor .role { padding-left: calc(48vw / 7.2); }
#instructor_list .instructor .role::before { width: calc(33vw / 7.2); }
#instructor_list .instructor_inner { width:100%; padding:1em; }

#instructor_list .instructor .sp_flex_box { display:flex; justify-content:space-between; align-items: stretch; margin-block-end: 1.5em; }
#instructor_list .instructor .sp_flex_box .name_box { width: 50%; display: grid; place-content: center; }
#instructor_list .instructor .sp_flex_box .thumb { width: 50%; }
#instructor_list .instructor .name .roman { margin-left: 0; }

#instructor_list .instructor .tags { gap: calc(16vw / 7.2); }



.faq_hero_wrapper { display: block; }
.faq_hero .text { width: 100%; }
.faq_hero .thumb { width: calc(591vw / 7.2); margin: 2em auto 0 auto; }
#faq { border-radius: calc(20vw / 7.2); padding: 3em 0 2em 0; }


#faq .content .list dt { align-items: flex-start; padding: 1.25em 0.5em 1.25em 0.5em; }

#faq .content .list dt p { margin: 0.25em 1em 0 0; }
#faq .content .list dd .icon_a { /*margin-top: 0.45em;*/ }
#faq .content .list dt i { inset: 0 0.5em 0 auto; }
#faq .content .list dd .a_inner { padding: 0.25em 0.75em 1.25em 0.75em; }



.news_wrapper { display: block; }
.left_column { float:none; width: 100%; }
.right_column { float:none; width: 100%; }

.news_list .page-numbers.current,
.news_list .page-numbers,
.news_list .page-numbers.next,
.news_list .page-numbers.prev { vertical-align: bottom; }


.contact_hero {  }

.contact_hero .catch.fs42vw{ font-size: calc(42 * 0.12vw); }



#contact { padding: 3em 0 2em 0; }

/* ---- お問合せフォーム振り分けボタン（Googleフォーム） ---- */
#contact .form_box { gap: calc(20vw / 7.2); width: 100%; }

#contact .form_btn {
	gap: calc(20vw / 7.2); min-height: 0;
	padding: calc(20vw / 7.2) calc(20vw / 7.2) calc(20vw / 7.2) calc(20vw / 7.2);
	border-radius: calc(15vw / 7.2);
}

#contact .form_btn .icon {
	width: calc(70vw / 7.2); height: calc(70vw / 7.2);
	border-radius: calc(12vw / 7.2); font-size:calc(32 * 0.16vw);
}

#contact .form_btn .sub { line-height:1.5; }
#contact .form_btn .main { line-height:1.5; }




.courses_page_header { height: calc(814vw / 7.2);}

.courses_page_header .btn_box { display: block; }
.courses_page_header .btn_box .course_btn { width: 92%;  margin: 1em auto 1em auto; }

#building.courses_page_header .page_header_img { width: calc(1530vw / 10.2); inset: auto 0 calc(100vw / 7.2) auto; }
#structures.courses_page_header .page_header_img { width: calc(1530vw / 10.2); inset: auto 0 calc(100vw / 7.2) auto; }


.page_wrapper_courses .page_box { inset: -1em auto auto auto; }
.courses .courses_wrapper { padding: 2em 0 2em 0; }

#outline{ display: block; }
#outline .text { width:100%; }
#outline .thumb { width: calc(430vw / 7.2); margin: 2em auto 1em auto; }

#outline .price_box { display:block; }
#outline .price_box dt { display:block; }
#outline .price_box dd { display:block; padding: 0 0 0 1.25em; }

.btn_schedule_registration { width: 88%; }


#timetable .timetable_content { display:block; }
#timetable .timetable_content .half { width:100%; margin-block-end: 2em; padding: 0 1em 1.5em 1em; }


#timetable .notice { display:block; }
#timetable .notice .half { width:100%; }


#audience .audience_table th:first-child, #audience .audience_table td:first-child { width: 4.5em; }


#audience .audience_table th, #audience .audience_table td { padding: 0.5em; }


/* 開催日程・お申し込み：SPは table を隠してカード型に */
#schedule_registration .schedule_table { display: none; }
#schedule_registration .schedule_cards { display: block; }

#schedule_registration .schedule_card { border: solid 1px #C4C4C4; margin-block-end: 1.5em; padding: 1em; background-color: #FFFFFF; }
#schedule_registration .schedule_card:last-child { margin-block-end: 0; }

#schedule_registration .schedule_card dl { display: block; margin: 0 0 0.75em 0; }
#schedule_registration .schedule_card dt { display: inline-block; margin-block-end: 0.4em; padding: 0.2em 0.9em; border-radius: 50vmax; line-height: 1.5; font-weight: 600; }
#schedule_registration .schedule_card dd { display: block; margin: 0; line-height: 1.6; }

/* ボタンの font-size が小さく 1em では詰まるため、カード側の padding で間隔を確保 */
#schedule_registration .schedule_card dl:last-of-type { margin-block-end: 0; }
#schedule_registration .schedule_card .apply_btn { width: 100%; height: calc(90vw / 7.2); margin-block-start: 1.5em; }


#schedule_registration .schedule_header { padding: calc(149vw / 14.2) 0 0 0; }
#schedule_registration .schedule_body { margin-top: calc(-200vw / 19.2); }

