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


html {scroll-behavior: smooth;}
:target { scroll-margin-top: calc(120vw / 19.2); }

body {
	color:#000000; font-size:calc(22 * 0.054vw); line-height: 1.8; letter-spacing: 0.04em;
	font-family: "Noto Sans JP",-apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "游ゴシック体", "Yu Gothic UI", Meiryo, sans-serif;
	font-weight:400; margin: 0 auto; height: 100%; overflow-x:hidden;
}

*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box;-o-box-sizing: border-box; -ms-box-sizing: border-box;box-sizing: border-box;}


.inter { font-family: "Inter", sans-serif; font-weight: 500; font-style: normal; }
.lora { font-family: "Lora", serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; }
.serif { font-family: "Noto Serif JP", serif; font-weight: 700; }
.ship { font-family: "Shippori Antique", sans-serif; font-weight: 400; font-style: normal; }


.italic { font-style:italic; }

.bold7 { font-weight:700; }
.bold { font-weight:900; }

.rl { -ms-writing-mode: tb-rl; writing-mode: vertical-rl;}


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


img { border: none; vertical-align: middle; backface-visibility: hidden; }

img.top { vertical-align: top; }
img.bottom { vertical-align: bottom; }
img.banner { border: solid 1px #DDD; }

input,button,textarea { appearance:none; -webkit-appearance:none; font-family: inherit; font: inherit; color: inherit; }
button { border: none; cursor:pointer; background: none; }


address, em { font-style: normal; }

mark { background: linear-gradient(#fbe2ac, #fbe2ac) 0 100% / 0 0.3em no-repeat; background-size: 100% 0.3em; }

a { color: #000000; text-decoration: none; }
a.underline { text-decoration:underline; }

a:hover, input[type="submit"]:hover, input[type="reset"]:hover {
	opacity: 0.9; filter: alpha(opacity=90); -ms-filter: "alpha( opacity=90 )";
}
strong {font-weight: 700;}

.position_r { position:relative; z-index:1; }
.position_a { position:absolute; z-index:0 }

.circle { display:inline-block; border-radius:100vmax; }


/*********** class ****************************************/


/********** float ************/
.c-both { clear: both; }
.clearfix::after { content: ""; clear: both; display: block; }
.left { float: left; }
.right { float: right; }
.center { display: block; margin-left: auto; margin-right: auto; text-align: center; }
.text_right { margin-left:auto; margin-right:0; text-align:right; }
.text_left { margin-right:auto; margin-left:0; text-align:left; }
/******* end float **********/

/******* flex box ***********/
.flex {
	display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: space-between; align-items: flex-start;
}
.height {flex-wrap: wrap; align-items: stretch;}
.js_center {justify-content: center; }
.wrap { flex-wrap: wrap; }
.start { justify-content: flex-start; }
.end { justify-content: flex-end; }

/******* flex box ***********/
.grid { display:grid; }


/* image parent cover *******/
.fit { overflow: hidden; }
.fit img { object-fit: cover; font-family: 'object-fit: cover;'; width: 100% !important; height: 100% !important; }
.cover { width: 100%; height:100%; object-fit:cover; }

/****** layout ********/
.inner {width: calc(1820vw / 19.2); margin: 0 auto;}
.middle_inner {width: calc(1620vw / 19.2); margin: 0 auto;}
.narrow_inner {width: calc(1480vw / 19.2); margin: 0 auto;}
.low_inner {width: calc(1280vw / 19.2); margin: 0 auto;}
.minimum_inner {width: calc(1275vw / 19.2); margin: 0 auto;}

.inner_left {width: calc(1630vw / 19.2); margin: 0 auto 0 0;}

.heading { width: 100%; }


dl.table { display:table; width:100%; }
dl.table dt,dl.table dd { display:table-cell; }

p.indent { text-indent: -1em; margin-left: 1em; }


/****** display ********/

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

.black { color:#000000; }
.dark { color:#324148; }
.white { color:#FFFFFF; --color: #FFFFFF; }
.blue { color:#2F5387; }
.light_blue { color:#4C9FCE; }
.sky_blue { color:#29A0DC; }
.orange { color:#E67E14; }
.gold { color:#F2B004; }
.deep_sky_blue { color:#0068DB; }
.deep_blue { color:#085781; }
.green { color:#005566; }


.yellow { color:#F3C609; }
.red { color:#7E1114; }



.bg_black { background-color:#000000; }
.bg_dark { background-color:#324148; }
.bg_white { background-color:#FFFFFF; --bg_color: #FFFFFF; }

.bg_dark_blue { background-color:#2F5387; }
.bg_blue { background-color:#007BFF; }
.bg_light_blue_normal { background-color:#4C9FCE; }
.bg_light_blue { background-color:rgba(234, 247, 255, 0.5); }
.bg_light_blue2 { background-color:#D8F2FE; }
.bg_arctic_ice { background-color:#F5FBFF }
.bg_sky_blue { background-color:#EAF7FF; }
.bg_green { background-color:#005566; }
.bg_light_gray { background-color:#F5F5F5; }
.bg_storm_cloud { background-color:#394A56; }
.bg_slate { background-color:#44515D; }

.bg_red { background-color:#da2668; --bg_color: #da2668; }
.bg_orange { background-color:#FF750F; }




.ttl { font-size: 1em; margin-block-start: 0; margin-block-end: 2.25em; }
.ttl .ja { display:block;}
.ttl .slug { display:block; line-height: 1.3;  }



.more {
	place-content:center; width: calc(360vw / 19.2); height: calc(74vw / 19.2);
	margin-block-start: 2em; border:solid 1px #000000;
}
.more .text_box { text-box:trim-both cap alphabetic; }



.fadein { opacity: 0; transition: opacity 0.8s ease; }
.fadein.active { opacity: 1; }

i.fa-instagram {
	background: linear-gradient(135deg, rgba(86, 30, 245, 1) 0%, rgba(234, 50, 191, 1) 27%, rgba(234, 51, 99, 1) 46%, rgba(239, 140, 53, 1) 65%, rgba(233, 50, 133, 1) 87%);
	-webkit-background-clip: text; -webkit-text-fill-color: transparent; min-width:19px;
}


/** animation **************************/
.decoration { z-index: 0; top:0; overflow: hidden; width: 100%; margin-inline: auto; }

.decoration .loop { animation: loop 40s linear infinite; width: max-content; }
.decoration .loop.second{ position: absolute; top: 0; left: 0; animation: loop 40s -20s linear infinite;}

.ohidden { position:relative; width:100%; height: calc(250vw / 19.2); overflow:hidden; }

@keyframes loop { 0%{ transform: translateX(100%); } 100%{ transform: translateX(-100%); } }

.fade_in { opacity: 0; transition: opacity 0.8s ease; }
.fade_in.active { opacity: 1; }

.fade_up { opacity: 0; transform:translateY(2vw); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade_up.active { opacity:1; transform: translateY(0); }


.fade_zoom { opacity: 0; transform: scale(0.3); transition: opacity 0.6s ease, transform 0.4s ease;}
.fade_zoom.active { opacity: 1; transform: scale(1); }

.text_curtain { width: max-content; overflow: hidden; }
.text_curtain span { display: inline-block; padding: 0.2em 0.4em; clip-path: inset(0 100% 0 0); transition: clip-path 1s ease; }
.text_curtain.active span { clip-path: inset(0 0 0 0); }

/** end animation **************************/




main { padding-top:calc(120vw / 19.2); }

#header { width: 100%; position:fixed; z-index:9998; height:calc(120vw / 19.2); box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1); }
#header .header_inner { height: 100%; align-items: center; }

/* トップは h1、下層は p でマークアップされるため、太さをブラウザ既定に任せず明示する */
#header .logo { font-size: 1em; font-weight: 700; width: calc(320vw / 19.2); margin:0; }
#header .logo .link { align-items: center; }
#header .logo .link .logo_mark { width: calc(163vw / 19.2); aspect-ratio:163 / 100; }
#header .logo .link .text { display:grid; margin-block-end: 0.5em; }
#header .logo .link .text .entity { margin-block-end: 0.75em; text-box: trim-both cap alphabetic; }
#header .logo .link .text .name { text-box: trim-both cap alphabetic; }



#header .header_menu { width: calc(1360vw / 19.2); height: 100%; align-items: center; }
#header .header_menu .menu_list { list-style-type:none; margin: 0 1em 0 0; padding: 0; }
#header .header_menu .menu_list li { margin-right:1.25em; margin-left: 1.25em; }

#header .apply_btn {
	place-items: center; place-content: center; width: calc(200vw / 19.2); height: calc(60vw / 19.2);
}

#header .email_btn {
	align-items: center; justify-content: center; width: calc(200vw / 19.2); height: calc(60vw / 19.2);
}

#header .email_btn i { margin-right:0.3em; }




#hamburger { display:none; }

#drawer { height: 100%; }
#drawer .drawer-content { height: 100%; }






.bottom_contact {
	padding:4em 0 6em 0;
}


.bottom_contact .ttl {  }

.bottom_contact .summary { margin-block-end:3em; }

.bottom_contact .contact_box { border:solid 1px #6B6B6B; }
.bottom_contact .contact_box .text { margin: 0; padding: 1.5em 1em; width: 50%; }
.bottom_contact .contact_box .text:first-of-type { border-right:solid 1px #6B6B6B; }

.bottom_contact .contact_box .text .type {
	width:calc(400vw / 19.2); height:calc(58vw / 19.2); border:solid 1px #000000; border-radius:50vmax;display: grid; place-content: center;
}
.bottom_contact .contact_box .text .type span { text-box:trim-both cap alphabetic; }

.bottom_contact .contact_box .text .btn {
	display: flex; justify-content: center; align-items: center; margin: 1em 0.5em; line-height: 1.2;
}

.bottom_contact .contact_box .text .btn i { margin-right:0.3em; }







#footer { padding:7em 0 3em 0; }
#footer .footer_wrapper {  }

#footer .footer_info { width: calc(580vw / 19.2); }

#footer .footer_info .logo { font-size: 1em; width: calc(320vw / 19.2); margin-block-start:0; margin-block-end: 2em; }
#footer .footer_info .logo .logo_mark { width: calc(160vw / 19.2); aspect-ratio:160 / 111; display:block; }
#footer .footer_info .text { display: block; margin-block-start: 0; padding-left: 1em; width: 34em; }
#footer .footer_info .text .name { display:block; }

#footer .footer_info .text .ja { display:block; }



#footer .footer_menu_list { width: calc(990vw / 19.2); }
#footer .footer_menu_list ul { padding: 0; list-style-type:none; }
#footer .footer_menu_list ul li { margin:0.25em 0 0 1.75em; }



#footer .apply_btn {
	place-items: center; place-content: center; width: calc(300vw / 19.2); height: calc(60vw / 19.2);
	background:linear-gradient(to bottom,#F3C609 0%,#FCE952 100%); margin:1em;
}

#footer .email_btn {
	align-items: center; justify-content: center; width: calc(300vw / 19.2); height: calc(60vw / 19.2);
	background:linear-gradient(to bottom,#007BFF 0%,#00B2FF 100%); margin:1em;
}

#footer .email_btn i { margin-right:0.3em; }







#page_top {
	position: fixed; bottom: 3vw; right: 3vw; z-index: 100; display: grid; place-content: center; place-items: center; line-height: 1;
	width: calc(80vw / 19.2); height: calc(80vw / 19.2); opacity:0; pointer-events:none; transition:opacity 0.4s ease;
}
#page_top i { text-box: trim-both cap alphabetic; }
#page_top.show { opacity:1; pointer-events:auto; }


#track { display:none; opacity: 0; transition: opacity 0.5s ease; }




.page_header {
	background-image:url(../img/page_header_bg.webp);
	background-size:100%; background-repeat:no-repeat; background-position:center top; height: calc(626vw / 19.2); aspect-ratio: 1920 / 626;
}
.page_header .page_header_ttl { margin: 1.5em 0 1em 0; width:max-content; }
.page_header .page_header_ttl .slug { display:block; line-height: 1.4; font-weight: 400; }
.page_header .page_header_ttl .ja { display:block; }



/* 各ページ共通パンくず */
.breadcrumb { list-style-type:none; }
.breadcrumb li { margin-left:1em; }

.page_wrapper { background:linear-gradient(to bottom,#DAEDFE 0%,#F5F8F7 calc(300vw / 19.2),#FFFFFF 100%); overflow:hidden; padding-bottom:4em; }

.page_box { position: relative; z-index: 1; inset: -7em auto auto auto; }

.square_bottom_left { position:absolute; z-index: 0; inset:auto auto -10em 0; width:calc(315vw / 19.2); height: calc(600vw / 19.2); }

/**** home ************************/


/* HOMEのFVは1980px設計。design px × (1920/1980) で 19.2換算しています */
#fv { background-image:url(../img/home/fv_bg2.webp); background-size:cover; background-position:center top; width:100%; aspect-ratio: 99 / 38; display:grid; place-content:center; }
#fv .fv_wrapper { display: flex; align-items: center; justify-content: space-between; }

/* 左上のオレンジ英字（design: left95 / top41） */
#fv .fv_slug {
	position:absolute; z-index:2; inset: calc(40vw / 19.2) auto auto calc(92vw / 19.2); margin:0;
	color:#F2B004; font-size:calc(31 * 0.052vw); line-height:1.2; white-space:nowrap;
	text-shadow:
		2px 0 2px #FFFFFF, -2px 0 2px #FFFFFF, 0 2px 2px #FFFFFF, 0 -2px 2px #FFFFFF,
		1px 1px 2px #FFFFFF, -1px -1px 2px #FFFFFF, 1px -1px 2px #FFFFFF, -1px 1px 2px #FFFFFF,
		-2px 4px 10px rgba(255,255,255,0.75);
}

/* design: キャッチ y317-550、緑ボックス y600-764（英字y169-190の下126px） */
#fv .text { width: calc(741vw / 19.2); padding-top: calc(126vw / 19.2); }
#fv .text .catch { position:relative; margin: 0 0 calc(49vw / 19.2) 0; color:#085781; line-height:1.5; letter-spacing:0.12em; }
#fv .text .sub_catch { position:relative; }
#fv .text .badge { width: calc(620vw / 19.2); margin: 0 auto; padding: calc(14vw / 19.2) calc(30vw / 19.2) calc(16vw / 19.2) calc(30vw / 19.2); border-radius:0.4em; }
#fv .text .badge dt { display:block; width:100%; }

#fv .text .badge dt .call { filter: drop-shadow(0 4px 4px rgba(0,0,0,0.25)); font-weight:700; margin: 0; line-height: 1.3; white-space:nowrap; }
#fv .text .badge dt .call .area { margin-right:1em; }
#fv .text .badge dt .call .recruit { text-decoration:underline; text-underline-offset:0.2em; }

/* design: "全国対応"行(y614-642)の下21px からひし形1つ目(y664-700) */
#fv .text .badge dd { display:block; margin:0; padding: calc(21vw / 19.2) 0 0 0; }
/* 白いひし形（design: 幅419 h37 / 上は左端+31、下は左端+162 → ずれ131px、間12px） */
#fv .text .badge dd .qualification {
	display:block; width: calc(406vw / 19.2); padding:0.1em 0;
	border-radius:0.15em; filter: drop-shadow(0 4px 2px rgba(0,0,0,0.25)); transform: skewX(-20deg);
}
#fv .text .badge dd .qualification:nth-of-type(1) { margin:0 0 calc(12vw / 19.2) 0; }
#fv .text .badge dd .qualification:nth-of-type(2) { margin:0 0 0 calc(127vw / 19.2); }
#fv .text .badge dd .qualification span { display:block; transform: skewX(20deg); }

#fv .slide { width: calc(539vw / 19.2); aspect-ratio: 539 / 655; }

/* 右の縦書き2列（design: 解体…=left1800/top60、今こそ…=left1695/top330） */
#fv .fv_vertical {
	position:absolute; z-index:2; margin:0; color:#0068DB; font-size:calc(32 * 0.052vw);
	font-weight:500; line-height:1.05; letter-spacing:0.02em;
	text-shadow:
		2px 0 2px #FFFFFF, -2px 0 2px #FFFFFF, 0 2px 2px #FFFFFF, 0 -2px 2px #FFFFFF,
		1px 1px 2px #FFFFFF, -1px -1px 2px #FFFFFF, 1px -1px 2px #FFFFFF, -1px 1px 2px #FFFFFF;
}
#fv .fv_vertical.vertical1 { inset: calc(58vw / 19.2) calc(140vw / 19.2) auto auto; }
#fv .fv_vertical.vertical2 { inset: calc(320vw / 19.2) calc(242vw / 19.2) auto auto; }




#top_introduction {
	padding:6em 0 7em 0; overflow: hidden;
}
#top_introduction .top_introduction_wrapper {
	align-items: stretch;
}

#top_introduction .text { width:calc(640vw / 19.2); }
#top_introduction .thumb { position:relative; z-index:0; width:calc(500vw / 19.2); padding-top: 9em; }
#top_introduction .thumb::before{
	content:""; position:absolute; inset:3em -5em auto auto; clip-path: polygon(22% 0%, 100% 0%, 78% 100%, 0% 100%);
	width:calc(402vw / 19.2); height:calc(438vw / 19.2); background-color: rgba(0, 172, 247,0.3);
}
#top_introduction .thumb .thumb_img { position:relative; z-index:1; width:calc(500vw / 19.2); aspect-ratio: 570 / 589; }




#top_point {
	padding:6em 0 7em 0; overflow: hidden;
	background-image:url(../img/home/top_point_bg.webp); background-size:cover; background-position: center center;
}
#top_point .top_point_wrapper {
	
}

#top_point .summary { margin-block-end:3em; }

#top_point .content { align-items: stretch; }
#top_point .box { width:calc(620vw / 19.2); margin-right: calc(40vw / 19.2); padding:1.25em 1.5em 1.5em 1.5em; }
#top_point .box:nth-of-type(2n) { margin-right:0; }

#top_point .box dt { padding: 0 0 0.75em 0; }
#top_point .box dt span { position:relative; display:block; }
#top_point .box dt span::after {
	content:""; position:absolute; inset:auto 0 0 0; width:2em; height:1px; background-color:#4C9FCE;
	display:block; margin: auto;
}
#top_point .box dd { margin: 0; }






#top_persons {
	padding:6em 0 7em 0; overflow: hidden;
	background-image:url(../img/home/top_persons_bg.webp); background-size:cover; background-position: center center;
}

#top_persons .summary { margin-block-end:3em; }

#top_persons .content { align-items: stretch; }

#top_persons .box { width:calc(390vw / 19.2); padding:1.25em 1.5em 1.5em 1.5em; }

#top_persons .box dt { padding: 0 0 0.75em 0; }
#top_persons .box dt span { position:relative; display:block; }

#top_persons .box dd { margin: 0; }


#top_about {
	padding:6em 0 7em 0; overflow: hidden;
}

#top_about .top_about_logo { width:calc(240vw / 19.2); aspect-ratio: 240 / 152; }



#top_voice {
	padding:6em 0 7em 0; overflow: hidden;
	background-image:url(../img/home/top_voice_bg.webp); background-size:cover; background-position: center center;
}

#top_voice .ttl .note { display: block; margin-block-start: 0.75em; color: #4C9FCE; font-weight: 500; }

#top_voice .voice_list { align-items: stretch; margin-block-start: 3em; margin-block-end: 3em; }

#top_voice .box { width:calc(432vw / 19.2); padding: 1em 1em 1.5em 1em; margin:0; }
#top_voice .box .slug { position:relative; display:block; width:max-content; margin-block-end:0.5em; padding-bottom: 0.5em; }
#top_voice .box .slug::after {
	content:""; position:absolute; inset:auto 0 0 0; width:calc(63vw / 19.2); height: calc(12vw / 19.2);
	background-image:url(../img/home/voice_slug_after.png); background-size:100%;
}

#top_voice .box .thumb { width:calc(245vw / 19.2); aspect-ratio: 1 / 1; margin: auto; display: block; }
#top_voice .box .text { margin:0; padding:1em 0 0 0; }
#top_voice .box .text .qualification { display:inline-block; margin-block-end:0.6em; padding:0.3em 1em; background-color:#E7F2FB; border-radius:50vmax; color:#2F5387; font-weight:500; line-height:1.4; }
#top_voice .box .text .attr { display:block; margin-block-end:0.5em; font-weight:700; }
#top_voice .box .text p { margin:0; line-height:1.8; }





/* HOMEは1980px設計。design px × (1920/1980) で 19.2換算しています */
#top_area {
	padding:6em 0 7em 0; overflow: hidden;
}

#top_area .summary { align-items: center; margin-block-end: 3em; }
#top_area .summary .label { padding: 0.4em 1.5em; margin-right: 1.5em; border: solid 1px #FFFFFF; line-height: 1.4; }
#top_area .summary .lead { margin: 0; }

#top_area .area_slider { position: relative; margin-block-start: 3em; margin-block-end: 3em; }
/* 左に350px（1980基準）空け、コンテンツ幅1630px（1980基準）→ 19.2換算 */
#top_area .area_viewport { width: calc(1581vw / 19.2); margin-left: calc(339vw / 19.2); overflow: hidden; }
#top_area .area_track { display: flex; gap: calc(39vw / 19.2); will-change: transform; }

#top_area .box { flex: 0 0 calc(294vw / 19.2); width: calc(294vw / 19.2); }
#top_area .box .thumb { position: relative; display: block; width: 100%; aspect-ratio: 303 / 480; overflow: hidden; }
#top_area .box .slug { z-index: 2; inset: 0; display: grid; place-content: center; text-align: center; }
#top_area .box .text { margin: 0; padding-top: 1em; }
#top_area .box .text dt { margin-block-end: 0.3em; }

/* ＜ボタン：Figma 46×110、スライドから40px離す（1980基準を19.2換算） */
#top_area .area_prev {
	position: absolute; z-index: 3; left: calc(150vw / 19.2); top: calc(233vw / 19.2); transform: translateY(-50%);
	display: grid; place-content: center; width: calc(46vw / 19.2); height: calc(110vw / 19.2);
	background: none; cursor: pointer; transition: opacity 0.3s ease;
}
#top_area .area_prev i { font-size: calc(150vw / 19.2); line-height: 1; }
#top_area .area_prev:hover { opacity: 0.6; }


#top_instructor {  }
#top_instructor .text { width:calc(600vw / 19.2); height: calc(840vw / 19.2); place-content:center; }
#top_instructor .thumb { width:calc(990vw / 19.2); height: calc(840vw / 19.2); aspect-ratio: 99 / 84; }



#top_faq { padding:6em 0 7em 0; overflow: hidden; }

#top_faq .top_faq_header { width:calc(240vw / 19.2); }
#top_faq .content { width:calc(960vw / 19.2); }

#top_faq .content .list { border:solid 1px #C4C4C4; }

#top_faq .content .list dt { position: relative; display: flex; align-items: center; cursor: pointer; caret-color: transparent; margin: 0; padding: 1.25em 1em 1.25em 1em; }
#top_faq .content .list dt .icon_q { margin-right: 0.5em; text-box: trim-both cap alphabetic; }
#top_faq .content .list dt p { margin:0; text-box: trim-both cap alphabetic; font-weight: 500; }
#top_faq .content .list dt i { position: absolute; inset: 0 1em 0 auto; margin: auto; display: grid; place-content: center; }

#top_faq .content .list dd { margin: 0; padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
/* display:flex は HTML 側の .flex クラスで指定 */
#top_faq .content .list dd .a_inner { padding: 0.25em 1em 1.25em 1em; }
#top_faq .content .list dd .icon_a { flex-shrink: 0; margin-top: 0.3em; margin-right: 0.5em; text-box: trim-both cap alphabetic; }
#top_faq .content .list dd .a_inner > div { flex: 1; }
#top_faq .content .list dd p { text-box: trim-both cap alphabetic; }
#top_faq .content .list dd p + p { margin-block-start: 1em; }




#top_blog { padding:6em 0 7em 0; overflow: hidden; }

#top_blog .top_blog_wrapper { overflow: hidden; align-items: stretch; margin-block-start: 3em; margin-block-end: 3em; }

#top_blog .blog_item { position:relative; width:calc(410vw / 19.2); padding: 1em 1em 1.5em 1em; margin:0 calc(30vw / 19.2) 0 calc(30vw / 19.2); border:solid 1px #BABABA; }


#top_blog .blog_item .cat { display:block; }
#top_blog .blog_item .cat.information { color:#2F5387; }
#top_blog .blog_item .cat.topic { color:#49A7DA; }
#top_blog .blog_item .thumb { display: block; width:100%; aspect-ratio: 37 / 22; }

#top_blog .blog_item .text { margin: 0; }

#top_blog .blog_item .text dt {  }
#top_blog .blog_item .text dt time { display:block; }



#top_blog .blog_item .text dd { margin:0; }
#top_blog .blog_item .text dd p { margin-block-end:0; }

#top_blog .blog_item .text dd .link { display: block; width: max-content; }
#top_blog .blog_item .text dd .link .icon { margin-left:0.5em; }
#top_blog .blog_item .text dd .link .underline { text-decoration:underline; }





.left_column { width: calc(840vw / 19.2); }
.right_column { width: calc(360vw / 19.2); padding-top: 3em; }

.entry_ttl { border-bottom:solid 2px #559ECB; }
.posted-on { display:inline-block; margin-right:1em; }
.post-taxonomies { display:inline-block; }
.post-taxonomies a { color: #2F5387; }

.news_list { padding: 2em 0 4em 0; }
.news_list .posts { margin-block-end:6em; }
.news_list .post { margin-block-end:6em; }


.news_list .posts .content_text { padding-top:1.5em; }
.news_list .posts .thumb { display: block; margin-block-end:2em; }

.news_list .page-numbers { color:#2F5487; display: inline-grid; place-content: center; width: 1.75em; height: 1.75em; border:solid 1px #2F5487; margin-right: 0.25em; }
.news_list .page-numbers.current { background-color:#2F5487; color:#FFFFFF; }
.news_list .page-numbers.next,
.news_list .page-numbers.prev { width:5em; display:inline-flex; align-items:center; }
.news_list .page-numbers i {  }

.news_list .single_nav .nav-links::after { content: ""; clear: both; display: block; }

.news_list .nav-previous { width:45%; float: left; }
.news_list .nav-next { width:45%; text-align: right; float: right;}




.right_column .cat_ttl { position:relative; padding:0 0 0.25em 1.5em; margin: 0; border-bottom:solid 2px #559ECB; }
.right_column .cat_ttl::before { content:"\f07c"; position:absolute; inset:0; font-family:"Font Awesome 7 Pro"; font-weight: 300; }
.right_column .newposts_ttl { position:relative; padding:0 0 0.25em 1.5em; margin: 0; border-bottom:solid 2px #559ECB; }
.right_column .newposts_ttl::before { content:"\e29e"; position:absolute; inset:0; font-family:"Font Awesome 7 Pro"; font-weight: 300; }
.right_column .archive_ttl { position:relative; padding:0 0 0.25em 1.5em; margin: 0; border-bottom:solid 2px #559ECB; }
.right_column .archive_ttl::before { content:"\e0d5"; position:absolute; inset:0; font-family:"Font Awesome 7 Pro"; font-weight: 300; }

.right_column ul { list-style-type:none; margin:0; padding: 0;}
.right_column ul li { border-bottom:solid 2px #CFCFCF; padding:1em 0 1em 0; }


.right_column .widget_block { margin-block-end:3em; }

/**** courses *********************/


.courses_page_header { width:100%; height:calc(814vw / 19.2); }

#building.courses_page_header {
	background:linear-gradient(to bottom,#33A3CD 0,#F5F8F7 100%);
	
}

#structures.courses_page_header {
	background:linear-gradient(to bottom,#017A4E 0,#F5F8F7 100%);
	
}

#building.courses_page_header .page_header_img { width:calc(1530vw / 19.2); aspect-ratio:1530 / 693; inset: auto 0 calc(100vw / 19.2) auto; }
#structures.courses_page_header .page_header_img { width:calc(1630vw / 19.2); aspect-ratio:163 / 72; inset: auto 0 calc(100vw / 19.2) auto; }



.courses_page_header .page_cat_ttl { margin-block-start: 2em; }
.courses_page_header .page_cat_ttl .slug { display:block; line-height: 1.4; font-weight: 400; }
.courses_page_header .page_cat_ttl .ja { display:block; }

.courses_page_header .page_header_ttl { line-height: 1.6; letter-spacing: 0.08em; font-weight: 400; margin-block-start: 0.35em; margin-block-end: 0.35em; }


.courses_page_header .btn_box {  }
.courses_page_header .btn_box .course_btn { width:calc(480vw / 19.2); padding:0.5em; border:solid 1px #0A0A0A; place-items: center; margin:1em; }
#building.courses_page_header .btn_box .course_btn.building { pointer-events:none; }
#building.courses_page_header .btn_box .course_btn.building i { margin-right:0.25em; }
#building.courses_page_header .btn_box .course_btn.structure i { margin-left:0.25em; }


#structures.courses_page_header .btn_box .course_btn.structure { pointer-events:none; }
#structures.courses_page_header .btn_box .course_btn.building i { margin-left:0.25em; }
#structures.courses_page_header .btn_box .course_btn.structure i { margin-right:0.25em; }


.btn_schedule_registration { width:calc(480vw / 19.2); padding:0.5em; place-items: center; margin-block-start: 2.5em; }
.btn_schedule_registration i { inset: auto 0.5em auto auto; margin: auto; }


/* ---- courses 共通 ---- */
.page_wrapper_courses { background:#F5F8F7; overflow:hidden; padding-bottom:1em; }
.page_wrapper_courses .page_box { inset: -6em auto auto auto; }

.courses .courses_wrapper { padding: 4em 0 2em 0; }

#outline { align-items: center; margin-block-end: 3em; }
#outline .text { width: calc(700vw / 19.2); }
#outline .text .summary p { margin: 0 0 1.5em 0; line-height: 1.9; }
#outline .thumb { width: calc(430vw / 19.2); aspect-ratio:430 / 322; }


#outline .price_box { margin: 0; }
#outline .price_box + .price_box { margin-block-start: 0.5em; }
#outline .price_box dt { width: 6em; }
#outline .price_box dt i { margin-right: 0.5em; font-size: 0.7em; vertical-align: middle; }
#outline .price_box dd { margin: 0; }


/* ---- timetable ---- */

#timetable { margin-block-start: 4em; margin-block-end: 4em; }
#timetable h2 { margin: 0 0 1.5em 0; }

#timetable .timetable_content { align-items: stretch; }
#timetable .timetable_content .half { border:solid 1px #7B7C7D; padding: 0 calc(24vw / 19.2) 1.5em calc(24vw / 19.2); }
#timetable .timetable_content .half .day_content_ttl { width:max-content; margin: -0.75em auto 1.25em auto; padding:0 1em 0 1em; }


#timetable .half { width:48.8%; }

#timetable .day_content .box { margin: 0; }
#timetable .day_content .box dt { width: 8em; white-space: nowrap; }
#timetable .day_content .box dd { margin: 0; line-height: 1.5; }
#timetable .day_content .box dd .asterisk { margin-left: 0.25em; }
#timetable .day_content > i { display: block; margin: 0.2em 0 0.2em calc(45vw / 19.2); }

#timetable .notice { margin-block-start: 2em; }
#timetable .notice .indent { text-indent: -1.07em; margin-left: 1.5em; padding-left: 0.5em; line-height: 1.85; }
#timetable .notice .indent .asterisk { display:inline-block; padding-right:0.5em; }


/* ---- audience（受講対象者・必要書類） ---- */

#audience { margin-block-end: 3em; }
#audience h3,
#audience h4 { margin: 0 0 1.5em 0; }
#audience h4 { margin-block-start: 3em; }

/* 罫線は 外枠 + 1列目の区切り + 各行の横罫（デザイン準拠） */
#audience .audience_table { width: 100%; border-collapse: collapse; border: solid 1px #C4C4C4; }
#audience .audience_table th,
#audience .audience_table td { padding: 1em; border-bottom: solid 1px #C4C4C4; line-height: 1.75; text-align: left; vertical-align: middle; }
#audience .audience_table tr:last-child th,
#audience .audience_table tr:last-child td { border-bottom: none; }
#audience .audience_table th { font-weight: 600; text-align: center; }
#audience .audience_table th:first-child,
#audience .audience_table td:first-child { width: 7em; border-right: solid 1px #C4C4C4; text-align: center; white-space: nowrap; }

#audience .documents { border-bottom: solid 1px #C4C4C4; padding-bottom: 2em; }
#audience .documents p { margin: 0; line-height: 1.85; }
#audience .documents p + p { margin-block-start: 1.5em; }


/* ---- schedule_registration（開催日程・お申し込み） ---- */

/* ヘッダーは背景画像、それより下は #44515D */
#schedule_registration { padding: 0 0 7em 0; overflow: hidden; background-color: #44515D; }

/* design: 帯h835 / 上端→見出し149 / 見出し→slug41 / slug→パネル134（白パネルは帯に450食い込む） */
#schedule_registration .schedule_header {
	height: calc(835vw / 19.2); padding: calc(149vw / 19.2) 0 0 0;
	background-image: url(../img/courses/schedule_registration_bg.webp); background-size: cover; background-position: center center; background-repeat: no-repeat;
}
#schedule_registration .schedule_header .ttl { margin: 0; }
#schedule_registration .schedule_header .ttl .ja { display: block; letter-spacing: 0.05em; line-height: 1; }
#schedule_registration .schedule_header .ttl .slug { display: block; margin-block-start: calc(41vw / 19.2); font-weight: 400; line-height: 1; }

#schedule_registration .schedule_body { margin-top: calc(-450vw / 19.2); border-radius: calc(20vw / 19.2); padding: 4em 0 4.5em 0; }

#schedule_registration .area_block { margin-block-end: 4em; }
#schedule_registration .area_block:last-child { margin-block-end: 0; }
#schedule_registration .area_ttl { margin: 0 0 0.75em 0; }
#schedule_registration .area_course { margin: 0 0 1.25em 0; }
#schedule_registration .area_empty { margin: 0; }

/* 罫線は 外枠 + 各列の区切り（design x:2/192/562/1032/1282）+ 各行の横罫 */
#schedule_registration .schedule_table { width: 100%; border-collapse: collapse; border: solid 1px #C4C4C4; }
#schedule_registration .schedule_table th,
#schedule_registration .schedule_table td { padding: 1em; border-right: solid 1px #C4C4C4; border-bottom: solid 1px #C4C4C4; line-height: 1.6; text-align: left; vertical-align: middle; }
#schedule_registration .schedule_table th:last-child,
#schedule_registration .schedule_table td:last-child { border-right: none; }
#schedule_registration .schedule_table tr:last-child th,
#schedule_registration .schedule_table tr:last-child td { border-bottom: none; }
#schedule_registration .schedule_table th { font-weight: 600; text-align: center; }
/* 列幅：会場以外を em 指定（文字数基準）。会場は残り幅 */
#schedule_registration .schedule_table th:nth-child(1),
#schedule_registration .schedule_table td:nth-child(1) { width: 10em; }
/* 「2026年10月30日（木）・29日（金）」が1行で収まる幅 */
#schedule_registration .schedule_table th:nth-child(2),
#schedule_registration .schedule_table td:nth-child(2) { width: 19em; white-space: nowrap; }
#schedule_registration .schedule_table th:nth-child(4),
#schedule_registration .schedule_table td:nth-child(4) { width: 9em; }
#schedule_registration .schedule_table th:nth-child(5),
#schedule_registration .schedule_table td:nth-child(5) { width: 14em; }
/* SP用カード（PCでは .sp により非表示） */
#schedule_registration .schedule_cards { display: none; }

/* 受付状況 */
#schedule_registration .status_cell { text-align: center; white-space: nowrap; }
#schedule_registration .status { display: inline-block; font-weight: 600; line-height: 1.5; }
#schedule_registration .status_open { color: #007BFF; }
#schedule_registration .status_few { color: #E67E14; }
#schedule_registration .status_full { color: #C0504D; }

#schedule_registration .apply_cell { text-align: center; }
#schedule_registration .apply_btn { width: calc(220vw / 19.2); height: calc(40vw / 19.2); place-content: center; border-radius: 0.25em; }







/**** contact *********************/

.contact_hero {  }

#contact { padding: 6em 0 6em 0; }
#contact .summary { margin-block-end:3em; }


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

#contact .form_btn {
	align-items:center; gap: calc(20vw / 19.2); min-height: calc(115vw / 19.2);
	padding: calc(15vw / 19.2) calc(40vw / 19.2) calc(15vw / 19.2) calc(35vw / 19.2);
	border:solid 1px #4C9FCC; border-radius: calc(15vw / 19.2); background-color:#F5F8FC;
}

#contact .form_btn .icon {
	flex:0 0 auto; place-items:center; width: calc(75vw / 19.2); height: calc(75vw / 19.2);
	border-radius: calc(15vw / 19.2); font-size:calc(32 * 0.052vw);
}

#contact .form_btn .text { flex:1 1 auto; }
#contact .form_btn .sub { display:block; font-style:normal; font-weight:700; line-height:1.75; letter-spacing:-0.03em; }
#contact .form_btn .main { display:block; line-height:1.4; }

#contact .form_btn .arrow { flex:0 0 auto; line-height:1; }

#contact .form_btn.type_group .icon      { background-color:#32C8E1; }
#contact .form_btn.type_group .sub       { color:#2DBCD4; }
#contact .form_btn.type_instructor .icon { background-color:#F3B907; }
#contact .form_btn.type_instructor .sub  { color:#ECB100; }
#contact .form_btn.type_other .icon      { background-color:#007BFF; }
#contact .form_btn.type_other .sub       { color:#007BFF; }
#contact .form_btn.type_cancel .icon     { background-color:#FF8833; }
#contact .form_btn.type_cancel .sub      { color:#EF7D2E; }


/**** faq ************************/

/* ---- faq hero ---- */

.faq_hero .text { width: calc(660vw / 19.2); }
.faq_hero .text .catch { margin: 0 0 0.75em 0; line-height: 1.7; }
.faq_hero .text .summary p { margin: 0 0 1.5em 0; line-height: 2; }
.faq_hero .text .summary p:last-child { margin-bottom: 0; }

.faq_hero .thumb { width: calc(592vw / 19.2); }
.faq_hero .thumb img { width: 100%; height: auto; }


/* ---- faq list ---- */

#faq { border-radius: calc(20vw / 19.2); padding: 4em 0 4.5em 0; }

#faq .content .list { border: solid 1px #C4C4C4; margin-block-end: 2em; }
#faq .content .list:last-child { margin-block-end: 0; }

#faq .content .list dt { position: relative; display: flex; align-items: center; cursor: pointer; caret-color: transparent; margin: 0; padding: 1.75em 3em 1.75em 2.25em; }
#faq .content .list dt .icon_q { margin-right: 0.6em; text-box: trim-both cap alphabetic; }
#faq .content .list dt p { margin: 0; text-box: trim-both cap alphabetic; font-weight: 500; line-height: 1.5; }
#faq .content .list dt i { position: absolute; inset: 0 2em 0 auto; margin: auto; display: grid; place-content: center; }

#faq .content .list dd { margin: 0; padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
/* display:flex は HTML 側の .flex クラスで指定 */
#faq .content .list dd .a_inner { padding: 0 3em 2em 2.25em; }
#faq .content .list dd .icon_a { flex-shrink: 0; margin-top: 0.15em; margin-right: 0.6em; text-box: trim-both cap alphabetic; }
#faq .content .list dd .a_inner > div { flex: 1; }
#faq .content .list dd p { margin: 0; line-height: 1.8; }
#faq .content .list dd p + p { margin-block-start: 1em; }

/**** end faq ***********************************/




/**** privacy ************************/

/* ---- privacy intro ---- */

.privacy_intro .text p { margin: 0; line-height: 1.75; }
.privacy_intro .text p + p { margin-block-start: 1em; }


/* ---- privacy body ---- */

#privacy { border-radius: calc(20vw / 19.2); padding: 4em 0 4.5em 0; }

#privacy .privacy_section { margin-block-end: 3.25em; }
#privacy .privacy_section:last-child { margin-block-end: 0; }

#privacy .privacy_section .section_ttl { margin: 0 0 0.75em 0; line-height: 1.4; }

#privacy .privacy_section p { margin: 0; line-height: 1.75; }
#privacy .privacy_section p + p { margin-block-start: 1em; }

#privacy .privacy_section .list { list-style: none; margin: 0.75em 0 0 0; padding: 0; }
#privacy .privacy_section .list li { position: relative; margin-block-end: 0.5em; padding-left: 1.5em; line-height: 1.6; }
#privacy .privacy_section .list li:last-child { margin-block-end: 0; }
#privacy .privacy_section .list li::before { content: ""; position: absolute; left: 0.35em; top: 0.7em; width: 0.45em; height: 0.45em; border-radius: 50%; background-color: #000000; }

/**** end privacy ***********************************/




/**** legal（特定商取引法に基づく表記） ************************/

#legal { border-radius: calc(20vw / 19.2); padding: 4em 0 4.5em 0; }

#legal .legal_section { margin-block-end: 3.5em; }
#legal .legal_section:last-child { margin-block-end: 0; }

#legal .legal_section .section_ttl { margin: 0 0 0.75em 0; line-height: 1.4; }

/* aboutの #profile テーブルを踏襲 */
#legal .legal_table { border-top: solid 1px #C4C4C4; }
#legal .legal_row { margin: 0; border-bottom: solid 1px #C4C4C4; }
#legal .legal_row dt,
#legal .legal_row dd { vertical-align: top; padding: 1.25em 0; line-height: 1.75; }
#legal .legal_row dt { width: calc(330vw / 19.2); font-weight: 500; }
#legal .legal_row dd { margin: 0; }
#legal .legal_row .pay_list { list-style: none; margin: 0; padding: 0; }
#legal .legal_row .pay_list li { line-height: 1.75; }

/**** end legal ***********************************/




/**** about ************************/

/* CTA直後に bottom_contact が続くため、このページのみ page_wrapper 下余白を打ち消す */
.page_wrapper.about_page { padding-bottom: 0; }

/* ---- about hero ---- */

.about_hero .text { width: calc(700vw / 19.2); }
.about_hero .text .catch { margin: 0 0 1em 0; line-height: 1.7; }
.about_hero .text .catch ruby rt { font-weight: 700; }
.about_hero .text .lead { margin: 0; line-height: 1.75; }
.about_hero .text .lead + .lead { margin-block-start: 1.25em; }

.about_hero .thumb { width: calc(591vw / 19.2); }
.about_hero .thumb img { width: 100%; height: auto; }


/* ---- philosophy ---- */

#philosophy { padding: 5em 0 5em 0; overflow: hidden; }

#philosophy .content { align-items: flex-start; }

#philosophy .thumb { width: calc(540vw / 19.2); }
#philosophy .thumb .thumb_img {
	display: block; width: 100%; height: auto;
	clip-path: polygon(16.67% 0, 100% 0, 100% 100%, 0 100%, 0 16.67%);
}

#philosophy .text { width: calc(690vw / 19.2); }
#philosophy .text .catch { margin: 0 0 1em 0; line-height: 1.6; letter-spacing: 0; }
#philosophy .text .lead { margin: 0; line-height: 1.75; }

#philosophy .deco_left { position: absolute; z-index: 0; inset: auto auto -10em 0; width: calc(321vw / 19.2); height: calc(600vw / 19.2); }


/* ---- mission ---- */

#mission {
	padding: 6em 0 7em 0; overflow: hidden;
	background-image: url(../img/about/mission_bg.webp); background-size: cover; background-position: center center;
}

#mission .summary { margin-block-end: 3em; }

#mission .content { align-items: stretch; }

#mission .box { width: calc(394vw / 19.2); padding: 2.5em 2em 2.5em 2em; text-align: center; }

#mission .box dt { margin: 0; padding: 0 0 1.5em 0; }
#mission .box .box_ttl { position: relative; display: inline-block; padding-bottom: 0.6em; }
#mission .box .box_ttl::after {
	content: ""; position: absolute; inset: auto 0 0 0; margin: auto; width: calc(43vw / 19.2); height: 3px; background-color: #4C9FCE;
}

#mission .box dd { margin: 0; }
#mission .box dd p { margin: 0; text-align: left; line-height: 1.75; }
#mission .box dd .icon { display: grid; place-content: center; margin-top: 2em; }
#mission .box dd .icon img { width: auto; height: auto; max-width: calc(116vw / 19.2); max-height: calc(100vw / 19.2); }


/* ---- profile ---- */

#profile { padding: 5em 0 7em 0; overflow: hidden; }

#profile .watermark { z-index: 0; left: 0; right: 0; top: 55%; transform: translateY(-50%); margin: 0 auto; width: calc(840vw / 19.2); height: auto; }

#profile .profile_table { z-index: 1; margin-block-start: 3em; border-top: solid 1px #C4C4C4; }
#profile .profile_row { margin: 0; border-bottom: solid 1px #C4C4C4; }
#profile .profile_row dt,
#profile .profile_row dd { vertical-align: top; padding: 1.25em 0; line-height: 1.75; }
#profile .profile_row dt { width: calc(230vw / 19.2); font-weight: 500; }
#profile .profile_row dd { margin: 0; }
#profile .profile_row .biz_list { list-style: none; margin: 0; padding: 0; }
#profile .profile_row .biz_list li { line-height: 1.75; }

#profile .deco_right { position: absolute; z-index: 0; inset: auto 0 -10em auto; width: calc(325vw / 19.2); height: calc(600vw / 19.2); }


/* ---- about cta ---- */

#about_cta {
	padding: 5em 0 6em 0; overflow: hidden;
	background-image: url(../img/about/about_footer_bg.webp); background-size: cover; background-position: center center;
}

#about_cta .catch { margin: 0 0 1em 0; line-height: 1.6; }
#about_cta .lead { margin: 0 0 2.5em 0; line-height: 1.75; }

#about_cta .course_btn {
	width: calc(484vw / 19.2); height: calc(79vw / 19.2); margin: 0 calc(28vw / 19.2); place-content: center;
}

#about_cta .course_btn.building { border: solid 2px #007BFF; }
#about_cta .course_btn.structure { border: solid 2px #249b6b; }



/**** end about ***********************************/




/**** instructor ************************/

/* hero deco（.about_hero のテキスト/サムネ指定を流用） */
.about_hero .deco_left { position: absolute; z-index: 0; inset: auto auto -17em 0; width: calc(325vw / 19.2); height: calc(600vw / 19.2); }


/* ---- instructor list ---- */

.instructor_hero .text { width: calc(700vw / 19.2); }
.instructor_hero .text .catch { margin: 0 0 1em 0; line-height: 1.7; }
.instructor_hero .text .catch ruby rt { font-weight: 700; }
.instructor_hero .text .lead { margin: 0; line-height: 1.75; }
.instructor_hero .text .lead + .lead { margin-block-start: 1.25em; }

.instructor_hero .thumb { width: calc(591vw / 19.2); }
.instructor_hero .thumb img { width: 100%; height: auto; }

.instructor_hero .deco_left { position: absolute; z-index: 0; inset: auto auto -17em 0; width: calc(325vw / 19.2); height: calc(600vw / 19.2); }



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

#instructor_list .list_header {
	padding: 4.5em 0 8em 0;
	background-image: url(../img/instructor/instructor_list_header_bg.webp); background-size: cover; background-position: center center; background-repeat: no-repeat;
}

#instructor_list .list_body { margin-top: calc(-140vw / 19.2); }

#instructor_list .instructor { border: solid 1px #E2E2E2; margin-block-end: calc(80vw / 19.2); padding: 3em 0 3.5em 0; }
#instructor_list .instructor:last-child { margin-block-end: 0; }

#instructor_list .instructor .thumb { overflow: hidden; border: solid 1px #C4C4C4; }
#instructor_list .instructor .thumb.pc { width: calc(290vw / 19.2); aspect-ratio: 290 / 380; }

#instructor_list .instructor .text { width: calc(920vw / 19.2); }

#instructor_list .instructor .role { position: relative; margin: 0 0 0.4em 0; padding-left: calc(48vw / 19.2); font-weight: 500; }
#instructor_list .instructor .role::before { content: ""; position: absolute; left: 0; top: 0.85em; width: calc(33vw / 19.2); height: 2px; background-color: #4C9FCE; }

#instructor_list .instructor .name { margin: 0 0 0.75em 0; line-height: 1.3; }
#instructor_list .instructor .name ruby rt { font-weight: 600; }
#instructor_list .instructor .name .roman { margin-left: 0.6em; }

#instructor_list .instructor .desc {  }
#instructor_list .instructor .desc + .desc { margin-block-start: 1em; }

#instructor_list .instructor .tags { display: flex; flex-wrap: wrap; gap: calc(16vw / 19.2); list-style: none; margin: 1em 0 0 0; padding: 0; }
#instructor_list .instructor .tags li { padding: 0.4em 1.25em; background-color: #E7F2FB; border: solid 1px #B7C7D9; border-radius: 50vmax; color: #12203F; font-weight: 500; line-height: 1.5; }

#instructor_list .deco_right { position: absolute; z-index: 0; inset: auto 0 -14em auto; width: calc(325vw / 19.2); height: calc(600vw / 19.2); }

/**** end instructor ***********************************/


.error-404 { padding:2em 0 8em 0; }


