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

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

body {
	background:#F9FCFF; color:#222222; --text-color:#222222; font-size:calc(20 * 0.052vw); line-height: 2; letter-spacing: 0.03em;
	font-family: "Noto Sans JP","Yu Gothic", "Meiryo", "Hiragino Kaku Gothic ProN", sans-serif; font-weight:500;
	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;}

.jost { font-family: "Jost", serif; font-weight: 600; font-style: normal; }

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

button,input,textarea,select { appearance: none; -webkit-appearance: none; border:none; font-family: inherit; font-size: inherit; font-weight:600; letter-spacing: 0.1vw; }

.italic { font-style:italic; }
strong { font-weight:900; }


.fs12vw { font-size:calc(12 * 0.052vw); }
.fs14vw { font-size:calc(14 * 0.052vw); }
.fs16vw { font-size:calc(16 * 0.052vw); }
.fs17vw { font-size:calc(17 * 0.052vw); }
.fs18vw { font-size:calc(18 * 0.052vw); }
.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); }
.fs31vw { font-size:calc(31 * 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); }
.fs53vw { font-size:calc(53 * 0.052vw); }
.fs54vw { font-size:calc(54 * 0.052vw); }
.fs55vw { font-size:calc(55 * 0.052vw); }
.fs56vw { font-size:calc(56 * 0.052vw); }
.fs60vw { font-size:calc(60 * 0.052vw); }
.fs62vw { font-size:calc(62 * 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); }
.fs80vw { font-size:calc(80 * 0.052vw); }
.fs84vw { font-size:calc(84 * 0.052vw); }
.fs86vw { font-size:calc(86 * 0.052vw); }
.fs90vw { font-size:calc(90 * 0.052vw); }
.fs100vw { font-size:calc(100 * 0.052vw); }
.fs110vw { font-size:calc(110 * 0.052vw); }
.fs112vw { font-size:calc(112 * 0.052vw); }
.fs120vw { font-size:calc(120 * 0.052vw); }
.fs140vw { font-size:calc(140 * 0.052vw); }
.fs160vw { font-size:calc(160 * 0.052vw); }
.fs180vw { font-size:calc(180 * 0.052vw); }
.fs210vw { font-size:calc(210 * 0.052vw); }
.fs300vw { font-size:calc(300 * 0.052vw); line-height:1; }

.fw7 {font-weight: 700;}

img { border: none; vertical-align: middle; }

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


address, em { font-style: normal; }

a { color: #000; text-decoration: none; }


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


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

/*********** 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; }


/******* end float **********/

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


/****** layout ********/
.inner { width: calc(1780vw / 19.2); margin: 0 auto; height: 100%; }
.middle_inner { width: calc(1560vw / 19.2); margin: 0 auto; height: 100%;}
.low_inner { width: calc(1260vw / 19.2); margin: 0 auto; height: 100%;}
.minimum_inner { width: calc(1200vw / 19.2); margin: 0 auto; height: 100%;}


.right_inner { width: calc(1740vw / 19.2); margin: 0 0 0 auto; height: 100%; }
.left_inner { width: calc(1740vw / 19.2); margin: 0 auto 0 0; height: 100%; }

.heading { width: 100%; }

/* image parent cover *******/
.fit { overflow: hidden; position:relative; }
.fit img { margin: auto; width: 100%; min-height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; }


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

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

.pc { display: unset; }
.sp { display: none; }
.grid { display: grid; }


.black { color:#000000; }
.white { color:#FFFFFF; --text-color: #FFFFFF; }
.red { color:#DC1D1D; }
.dark_blue { color:#0D5286; }
.blue { color:#8FB9DA; }
.light_blue { color:#E5F0F9; }


.alpha_white { color:rgba(255,255,255,0.5); }

.bg_black { background-color:#000000; }
.bg_white { background-color:#FFFFFF; }
.bg_body_white { background-color:#F9FCFF; }
.bg_alpha_body_white { background-color:rgba(249, 252, 255,0.8); }

.bg_red { background-color:#DC1D1D; }
.bg_dark_blue { background-color:#0D5286; }
.bg_blue { background-color:#8FB9DA; }
.bg_light_blue { background-color:#E5F0F9; }
.bg_pale_blue { background-color:#B1D1E9; }

.bg_gradient_blue { background: linear-gradient(to right, #0D5286 0, #076EBC 80%, #007BD9 100%); }




.circle { border-radius:50vmax; }

.ttl { position:relative; line-height: 1; font-weight: 900; margin-block-start: 1em; margin-block-end: 2em; font-weight: bold; }
.ttl .slug { display:block; padding:0 0 0.3em 0; font-weight: bold; }
.ttl i { margin-right: 0.4vw; line-height: 1.78vw; vertical-align: baseline; }
.ttl .ja { display:inline-block; padding: 0.2em 0 0.8em 0; font-weight: 800;}
.ttl::after { content:""; position:absolute; inset:auto auto 0 0; width: calc(80vw / 19.2); height:1px; background-color:#0D5286; }
.ttl.center::after { inset:auto 0 0 0; margin:auto; }


.sub_ttl { line-height: 1; font-weight: 900; margin-block-start: 2em; margin-block-end: 3em; }
.sub_ttl .slug { display:block; padding:0 0 0.9vw 0; font-weight: bold; }
.sub_ttl i { margin-right: 0.4vw; line-height: 1.78vw; vertical-align: baseline; }
.sub_ttl .ja { position:relative; display:inline-block; padding: 1em 0 1em 0; font-weight: 600; }
.sub_ttl .ja::after { content:""; position:absolute; bottom: -0.5em; right:0; left:0; margin:auto; background-color:#FFFFFF; width:5.5em; height:1px; }


.more_wrapper { position:relative; width: calc(400vw / 19.2); height: calc(90vw / 19.2); transition:0.5s ease; }
.more {
	position:relative; z-index:1; width:calc(400vw / 19.2); height:calc(90vw / 19.2); line-height:calc(90vw / 19.2); display:block;
	margin:4em 0 4em 0; text-align:center; border:solid 1px #0D5286; overflow: hidden;transition: all 0.3s;
	
}
.more .square {
	display:grid; place-items:center; width:calc(80vw / 19.2); height:100%; position: absolute; inset: 0 0 0 auto; clip-path: polygon(calc(20vw / 19.2) 0%, 100% 0%, 100% 100%, 0% 100%);transition: all 0.3s;
}
.more .square i { margin-left: 0.25em; }

.more_wrapper::before {
	position: absolute; inset:0; z-index: 0; content: "";
	width: calc(400vw / 19.2); height: calc(90vw / 19.2); background-color: #CDDEEA; transition: transform 2s ease; transform: translate(0, 0);
}
.more_wrapper.move.active::before { transform: translate(5px, 5px); }



.more.center { margin:4em auto 4em auto;}

.more:hover { opacity:1; background:#0D5286; color:#FFF; }
.more:hover .square { opacity:1; background:#FFFFFF; color:#0D5286; }



#modal_gallery_box {
	display: flex; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.7); justify-content: center; align-items: center; z-index: 9999;
	opacity: 0; visibility: hidden; transition: opacity 0.4s ease, visibility 0.4s;
}
#modal_gallery_box.show { opacity: 1; visibility: visible; }

#modal_gallery_box .modal-content {
	position: relative; background: #FFFFFF; padding: 10px; border-radius: 0.5em; max-width: 90%; max-height: 90%; box-shadow: 0 0 20px rgba(0,0,0,0.4);
}
#modal_gallery_box .modal-content img { width: 100%; max-width: 800px; max-height: 80vh; display: block; border-radius: 0.5em; }
#modal_gallery_box #modal-close {
	position: absolute; top: -3em; right: -1em; background: none; border: none; cursor: pointer;
}



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

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


.fade_right { opacity: 0; transform:translateX(2vw); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade_right.active { opacity: 1; transform:translateX(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); }


.scale_in {overflow: hidden;}
.scale_in img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out; overflow:hidden; }
.scale_in img:hover { -webkit-transform: scale(1.05); transform: scale(1.05); }

.grayscale { filter: grayscale(100%);transition: 2s ease; }
.grayscale.active { filter: grayscale(0%); }


.text_action span { display: inline-block; opacity: 0;transform: translate(0) scale(5); }
.text_action.active span { animation: leftRight .25s forwards; }
@keyframes leftRight {
	50% {
		transform: translate(0) scale(2.5);
		opacity: 1;
	}
	100% {
		transform: translate(0) scale(1);
		opacity: 1;
	}
}
.text_action span:nth-of-type(2) {animation-delay: .05s;}
.text_action span:nth-of-type(3) {animation-delay: .1s;}
.text_action span:nth-of-type(4) {animation-delay: .15s;}
.text_action span:nth-of-type(5) {animation-delay: .2s;}
.text_action span:nth-of-type(6) {animation-delay: .25s;}
.text_action span:nth-of-type(7) {animation-delay: .3s;}
.text_action span:nth-of-type(8) {animation-delay: .35s;}
.text_action span:nth-of-type(9) {animation-delay: .4s;}
.text_action span:nth-of-type(10) {animation-delay: .45s;}
.text_action span:nth-of-type(11) {animation-delay: .5s;}
.text_action span:nth-of-type(12) {animation-delay: .55s;}
.text_action span:nth-of-type(13) {animation-delay: .6s;}
.text_action span:nth-of-type(14) {animation-delay: .65s;}
.text_action span:nth-of-type(15) {animation-delay: .7s;}
.text_action span:nth-of-type(16) {animation-delay: .75s;}
.text_action span:nth-of-type(17) {animation-delay: .8s;}
.text_action span:nth-of-type(18) {animation-delay: .85s;}
.text_action span:nth-of-type(19) {animation-delay: .9s;}
.text_action span:nth-of-type(20) {animation-delay: .95s;}
.text_action span:nth-of-type(21) {animation-delay: 1.0s;}
.text_action span:nth-of-type(22) {animation-delay: 1.05s;}
.text_action span:nth-of-type(23) {animation-delay: 1.1s;}
.text_action span:nth-of-type(24) {animation-delay: 1.15s;}
.text_action span:nth-of-type(25) {animation-delay: 1.2s;}


.text_mask {
	color: transparent; /* 文字色は透明にして背景で塗る */
	-webkit-background-clip: text;
	background-clip: text;
	
	background-image: linear-gradient(90deg, var(--text-color) 0%, var(--text-color) 50%, transparent 50%, transparent 100%);
	background-size: 200% 100%;
	background-position: 100% 0;
	background-repeat: no-repeat;
}

.text_mask.active { animation: bg_reveal 1s linear forwards; }

@keyframes bg_reveal {
	from { background-position: 100% 0; }
	to   { background-position: 0% 0; }
}



.text_curtain { display: block; 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); }

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

.text_curtain strong { display: inline-block; padding: 0.2em 0.4em; clip-path: inset(0 100% 0 0); transition: clip-path 1s ease; }
.text_curtain.active strong { clip-path: inset(0 0 0 0); }

.box_curtain { position: relative; overflow: hidden; width: 100%; }
.box_curtain::before { background-color: #42BDAE; content: ""; position: absolute; z-index: 3; width: 100%; height: 100%; }
.box_curtain.active::before { animation: box_curtain 1.2s ease forwards; }


@keyframes box_curtain {
	0% { transform: translateX(-100%); }
	40%  { transform: translateX(0%); }
	60%  { transform: translateX(0%); }
	100% { transform: translateX(100%); }
}

.slider { width: 100%; overflow: hidden;}
.slider_track { display: flex; width: max-content; gap: 0; }
.slide { flex: 0 0 auto; }
.slide img { display: block; }



.bound_slide_up {opacity: 0;}
.bound_slide_up.active {
	-webkit-animation-name: boundup;animation-name: boundup;-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-delay: .8s;animation-delay: .8s;
	-webkit-animation-fill-mode: both;animation-fill-mode: both;display: block;transition-delay: 5s ;-webkit-backface-visibility:hidden;backface-visibility:hidden;
}
@-webkit-keyframes boundup {
	0% {-webkit-transform: translateY(50%);transform: translateY(50%);opacity: 0;}
	30% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	37% {-webkit-transform: translateY(25px);transform: translateY(25px);opacity: 1;}
	43% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	53% {-webkit-transform: translateY(15px);transform: translateY(15px);opacity: 1;}
	68% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	100% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
}
@-webkit-keyframes boundup {
	0% {-webkit-transform: translateY(50%);transform: translateY(50%);opacity: 0;}
	30% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	37% {-webkit-transform: translateY(25px);transform: translateY(25px);opacity: 1;}
	43% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	53% {-webkit-transform: translateY(15px);transform: translateY(15px);opacity: 1;}
	68% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
	100% {-webkit-transform: translateY(0px);transform: translateY(0px);opacity: 1;}
}



.illust1 { width:calc(418vw / 19.2); height:calc(520vw / 19.2); }
.illust2 { width:calc(460vw / 19.2); height:calc(280vw / 19.2); }
.illust3 { width:calc(257vw / 19.2); height:calc(245vw / 19.2); }
.illust4 { width:calc(548vw / 19.2); height:calc(330vw / 19.2); }
.illust5 { width:calc(547vw / 19.2); height:calc(283vw / 19.2); }
.illust6 { width:calc(304vw / 19.2); height:calc(360vw / 19.2); }
.illust7 { width:calc(203vw / 19.2); height:calc(322vw / 19.2); }
.illust8 { width:calc(521vw / 19.2); height:calc(313vw / 19.2); }
.illust9 { width:calc(249vw / 19.2); height:calc(302vw / 19.2); }
.illust10 { width:calc(266vw / 19.2); height:calc(254vw / 19.2); }
.illust11 { width:calc(327vw / 19.2); height:calc(404vw / 19.2); }
.illust12 { width:calc(674vw / 19.2); height:calc(468vw / 19.2); }
.illust13 { width:calc(606vw / 19.2); height:calc(520vw / 19.2); }
.illust14 { width:calc(446vw / 19.2); height:calc(497vw / 19.2); }
.illust15 { width:calc(395vw / 19.2); height:calc(395vw / 19.2); }
.illust16 { width:calc(258vw / 19.2); height:calc(333vw / 19.2); }
.illust17 { width:calc(446vw / 19.2); height:calc(453vw / 19.2); }
.illust18 { width:calc(313vw / 19.2); height:calc(328vw / 19.2); }
.illust19 { width:calc(290vw / 19.2); height:calc(360vw / 19.2); }
.illust20 { width:calc(556vw / 19.2); height:calc(547vw / 19.2); }
.illust21 { width:calc(439vw / 19.2); height:calc(481vw / 19.2); }
.illust22 { width:calc(241vw / 19.2); height:calc(300vw / 19.2); }
.illust23 { width:calc(384vw / 19.2); height:calc(317vw / 19.2); }
.illust24 { width:calc(248vw / 19.2); height:calc(714vw / 19.2); }
.illust25 { width:calc(311vw / 19.2); height:calc(438vw / 19.2); }
.illust26 { width:calc(546vw / 19.2); height:calc(345vw / 19.2); }
.illust27 { width:calc(467vw / 19.2); height:calc(705vw / 19.2); }
.illust28 { width:calc(358vw / 19.2); height:calc(462vw / 19.2); }
.illust29 { width:calc(523vw / 19.2); height:calc(361vw / 19.2); }
.illust30 { width:calc(342vw / 19.2); height:calc(396vw / 19.2); }
.illust31 { width:calc(310vw / 19.2); height:calc(480vw / 19.2); }
.illust32 { width:calc(420vw / 19.2); height:calc(280vw / 19.2); }
.illust33 { width:calc(255vw / 19.2); height:calc(255vw / 19.2); }
.illust34 { width:calc(349vw / 19.2); height:calc(253vw / 19.2); }
.illust35 { width:calc(551vw / 19.2); height:calc(270vw / 19.2); }
.illust36 { width:calc(277vw / 19.2); height:calc(375vw / 19.2); }
.illust37 { width:calc(448vw / 19.2); height:calc(349vw / 19.2); }
.illust38 { width:calc(242vw / 19.2); height:calc(359vw / 19.2); }
.illust39 { width:calc(196vw / 19.2); height:calc(189vw / 19.2); }
.illust40 { width:calc(280vw / 19.2); height:calc(312vw / 19.2); }
.illust41 { width:calc(374vw / 19.2); height:calc(465vw / 19.2); }
.illust42 { width:calc(275vw / 19.2); height:calc(359vw / 19.2); }


.bottom_contact_illust { width:calc(353vw / 19.2); height:calc(320vw / 19.2); }








#header { position:fixed; top: calc(10vw / 19.2); width: 100%; height: calc(100vw / 19.2); z-index: 999; transition: background-color 0.5s ease; }
#header .logo { width:calc(363vw / 19.2); aspect-ratio: 363 / 63; font-size:1em; line-height:1; margin: 0 calc(10vw / 19.2) 0 calc(20vw / 19.2); justify-content: center; align-items: center; }

#header .inner { height: calc(110vw / 19.2); z-index: 9999; align-items: center; box-shadow:2px 4px 4px rgba(13,82,134,0.2); }

#header .inner .header_nav {  }
#header .inner .header_nav ul { list-style-type:none; padding-inline-start: 3em; }
#header .inner .header_nav ul li { margin:0 2em 0 0; font-weight: 700; }

#header .inner .contact_btn {
	display: grid; place-items: center; place-content: center; width:calc(210vw / 19.2); height: 100%;
	background: linear-gradient(to right, #0D5286 0, #076EBC 70%, #007BD9 100%);
}

.goog-te-gadget-simple { font-size: calc(20vw / 19.2); }














#header .right_menu #google_translate_element { margin-right:3em; }



#header .right_menu #hamburger {
	width:calc(100vw / 19.2); height: 100%; text-align: center; cursor: pointer;
}
#header .right_menu #hamburger .icon { display:inline-block; width:50%; }
#header .right_menu #hamburger .icon .bar {
	display: flex; justify-content: center;width: 100%; height: 3px;margin: calc(10vw / 19.2) auto;border-radius: 2px;background: #fff;
	transition: transform 0.3s ease, opacity 0.3s ease;transform-origin: center center; transform: none;
}



#header .right_menu #hamburger.active .icon .bar_1 { transform: translateY(var(--offset)) rotate(45deg); }
#header .right_menu #hamburger.active .icon .bar_2 { transform: translateY(calc(var(--offset) * -1)) rotate(-45deg); }

#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: 10em; grid-template-rows: 20em; }
#header #drawer.open .drawer-content {transform: translateX(0);}



#header .grid { padding: 8vw 0 0 5vw; position: relative; z-index: 100; }
#header .grid ul { list-style-type:none; margin:0 0 0 0; padding:0 0 1.5em 0; }

#header .grid .grid1 {  }
#header .grid .grid2 { grid-column: 2; grid-row: 1 / 2; }
#header .grid .grid6 { grid-column: 3; grid-row: 1 / 2; }


#header .grid .grid4 { grid-column: 1; grid-row: 2 / 2; }
#header .grid .grid3 { grid-column: 2; grid-row: 2 / 2; }
#header .grid .grid5 { grid-column: 3; grid-row: 2 / 2; }



#header .grid ul li a .slug { display:block; }

#header .grid ul li.page_name { margin:0 0 1.3541666vw 0; }
#header .grid ul li.page_name a { position:relative; display:inline-block; padding:0 0 0 2.239583vw; line-height: 1; }
#header .grid ul li.page_name a i { position:absolute; top: 0.5vw; left:-0.239583vw; }
#header .grid ul li.page_name a .anchor { display:inline-block; margin-block-start:0.5em; }

#header .grid ul li.section_name { margin:0 0 0.5em 0; }
#header .grid ul li.section_name a { position:relative; display:inline-block; padding:0 0 0 1.875vw; line-height: 1; }
#header .grid ul li.section_name a i { position:absolute; top: -0.3vw; left:-0.239583vw; }





.bottom_contact {
	overflow:hidden;
	z-index:2; padding:calc(120vw / 19.2) 0 calc(120vw / 19.2) 0; background-image:url(../img/bottom_contact_bg.png); background-size:cover; background-repeat:no-repeat;
}
.bottom_contact .bottom_contact_wrapper {  padding:2.447916vw 4.166666vw 2.447916vw 4.166666vw ; clip-path: polygon(calc(70vw / 19.2) 0, 100% 0, 100% 100%, 0 100%, 0 calc(70vw / 19.2)); }

.bottom_contact .bottom_contact_wrapper .text { padding: 0 0 0 calc(200vw / 19.2); }

.bottom_contact .bottom_contact_wrapper .ttl { margin-block-start: 1vw; }
.bottom_contact .bottom_contact_wrapper .summary { margin-block-start:3em; margin-block-end:2em; }

.bottom_contact .bottom_contact_wrapper .link_box { justify-content: center; }
.bottom_contact .bottom_contact_wrapper .link_box .mail_btn, .bottom_contact .bottom_contact_wrapper .link_box .tel_btn {
	position:relative; width:calc(550vw / 19.2); height:calc(120vw / 19.2); line-height:calc(120vw / 19.2); display:block; border:solid 1px #0D5286; overflow: hidden;
	transition:0.5s ease; margin: 2em; padding-left:calc(170vw / 19.2);
}
.bottom_contact .bottom_contact_wrapper .link_box .mail_btn i ,
.bottom_contact .bottom_contact_wrapper .link_box .tel_btn i {
	margin-right: 0.6em;
}

.bottom_contact .bottom_contact_wrapper .link_box .square {
	display:grid; place-items:center; width:calc(140vw / 19.2); height:100%; position: absolute; inset: 0 auto 0 0; clip-path: polygon(0 0, 100% 0%, calc(100vw / 19.2) 100%, 0% 100%);
}

.bottom_contact .bottom_contact_illust { inset:auto auto 1em -1em; }




#footer { z-index:3; padding:4em 0 0 0; }

#footer .site_info { width:calc(500vw / 19.2); padding: 1em 0 3em 0; }
#footer .site_info .logo { display:block; width:calc(363vw / 19.2); margin-block-end:2em; }
#footer .site_info .site_name { display:block; margin:2em 0 0 0; }
#footer .site_info address { margin-block-end:2em; }
#footer .site_info address .circle { display: inline-block; width: 2em; height: 2em; text-align: center; margin-left: 0.4em; }



#footer .site_menu { width:calc(900vw / 19.2); flex-wrap: wrap; }
#footer .site_menu .box { list-style-type:none; margin: 0; padding: 0; width: 15em; }
#footer .site_menu .box .page_name { position: relative; margin-block-start: 1em; }

#footer .site_menu .box li .page_block { list-style-type:none; padding: 0; }


#footer .copy { padding:1em 0 1em 0; z-index:101;margin-block-start: 3em; }



#ptop {
	display: grid; place-items:center; position: fixed; inset:auto 3em 6em auto; z-index: 100; width:calc(80vw /19.2); height:calc(80vw /19.2);
	opacity: 0; pointer-events: none; transition: opacity 0.5s ease;
}

#ptop.show { opacity: 1;pointer-events: auto; }



.page_header {
	padding:calc(380vw / 19.2) 0 1em 0; height:calc(860vw / 19.2);
	background-image:url(../img/page_header_bg.webp); background-size:100%; background-position:center bottom;
}


.page_header .page_header_ttl { height: auto; }
.page_header .page_header_ttl .slug { display:block; font-weight: bold; line-height: 1.2;padding-block-end: 0.2em; }
.page_header .page_header_ttl .ja { display: block; width:max-content; line-height: 1; padding: 0.5em; background: linear-gradient(to bottom, #0D5286 0, #076EBC 80%, #007BD9 100%); }


.page_header_img { width:calc(1303vw /19.2); height:calc(633vw / 19.2); inset:auto 1em 1em auto; z-index:0; }




main {  }



#fv {
	aspect-ratio: 96 / 43;
	width: 100%; overflow: hidden; background-position:center bottom; background-repeat: no-repeat; background-size: 100%;
}


#fv video { width: 100%; aspect-ratio: 96 / 43;  object-fit: cover; }

#fv .recruit_btn { display:block; bottom:calc(60vw / 19.2); right:3%; width:calc(447vw /19.2); aspect-ratio: 447 / 229; }
#fv .recruit_btn .heading { height:100%; object-fit:cover; }



.decoration { z-index: 10; top: -0.2em; overflow: hidden; width: 100%; margin-inline: auto; line-height: 1.3; }

.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;}

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



#top_news {padding-block: 4em;background: #E5F0F9;}
#top_news .news_list {padding-block-end: 0;list-style-type: none;}
#top_news .news_list li { padding: 1em 0;border-bottom: 1px solid #8FB9DA;font-weight: 700; }
#top_news .news_list li span { margin-inline-start: 2em; }
#top_news .news_list li a { display: block; color: inherit; transition: opacity .3s; }
#top_news .news_list li a:hover { opacity: .6; }



#news_archive { padding-block: calc(120vw / 19.2); }
#news_archive .news_archive_list { list-style-type: none; }
#news_archive .news_article { padding: calc(60vw / 19.2); margin-block-end: calc(40vw / 19.2); }
#news_archive .news_article:last-child { margin-block-end: 0; }
#news_archive .news_article_header { padding-block-end: calc(24vw / 19.2); margin-block-end: calc(32vw / 19.2); border-bottom: 1px solid #8FB9DA; }
#news_archive .news_date { display: block; letter-spacing: 0.05em; }
#news_archive .news_ttl { margin-block: calc(8vw / 19.2) 0; line-height: 1.5; }
#news_archive .news_body { line-height: 2; font-weight: 500; }
#news_archive .news_body p { margin-block-end: 1em; }
#news_archive .news_body p:last-child { margin-block-end: 0; }
#news_archive .news_photos {
	display: grid; grid-template-columns: repeat(4, 1fr);
	gap: calc(24vw / 19.2); margin-block-start: calc(40vw / 19.2);
}
#news_archive .news_photos img {
	width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
	border-radius: calc(12vw / 19.2);
	cursor: pointer; transition: opacity .3s;
}
#news_archive .news_photos img:hover { opacity: .8; }


/* お知らせ写真のポップアップ（ライトボックス） */
.news_lightbox {
	position: fixed; inset: 0; z-index: 9999;
	display: none; align-items: center; justify-content: center;
	background: rgba(34, 34, 34, 0.85); padding: 2vw;
}
.news_lightbox.is_open { display: flex; }
.news_lightbox .news_lightbox_inner {
	position: relative; width: 900px; max-width: 92vw;
}
.news_lightbox .news_lightbox_img {
	display: block; width: 100%; max-height: 90vh;
	height: auto; object-fit: contain; border-radius: 6px;
}
.news_lightbox .news_lightbox_close {
	position: absolute; top: -1.6em; right: 0;
	width: 1.6em; height: 1.6em; padding: 0; cursor: pointer;
	background: none; border: none; color: #FFFFFF; font-size: 2.4rem; line-height: 1;
}



#top_about { padding:5em 0 0 0; background-image:url(../img/home/top_about_bg.webp); background-size:100%; background-position:center top; background-repeat:no-repeat; }

#top_about .text { width:calc(720vw / 19.2); }
#top_about .thumb_list {
	width:calc(930vw / 19.2); margin-block-start: 2.25em;
	grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: calc(30vw / 19.2); grid-row-gap: calc(30vw / 19.2);
}

#top_about .catch .clip { display:block; clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%); }
#top_about .catch .clip span {
	width:max-content; padding:0.1em 2em 0.1em 0.5em; /**/
	margin-block-end: 0.5em;font-weight: 700;
}


#top_about .thumb_list .grid1 { grid-column: 1 / 3; grid-row: 1 / 2; justify-self: end; }
#top_about .thumb_list .grid2 { grid-column: 1; grid-row: 2 / 2; }
#top_about .thumb_list .grid3 { grid-column: 2; grid-row: 2 / 2; }



#top_about .thumb_list .thumb1 { width:calc(860vw / 19.2); aspect-ratio: 43 / 25; clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%, 0 23%); }
#top_about .thumb_list .thumb2 { width:calc(480vw / 19.2); aspect-ratio: 48 / 29; }
#top_about .thumb_list .thumb3 { width:calc(350vw / 19.2); aspect-ratio: 35 / 29; }



#top_about .link_list { padding: 0 0 9em 0; background:linear-gradient(to bottom,transparent 0,transparent 20%,#007BD9 20%,#076EBC 60%,#0D5286 100%);}

#top_about .link_list .box { width:calc(480vw / 19.2); height:calc(300vw / 19.2); overflow:hidden; padding-left:1em; }
#top_about .link_list .box .thumb {
	display:block; width:100%; height:100%; object-fit:cover;
	position: absolute; inset: 0; z-index: 0; transition: transform .4s ease;
}

#top_about .link_list .slug { position:relative; display: block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; margin-block-end:0.5em; margin-block-start:8.5em; line-height: 1.5; }
#top_about .link_list .ja { position:relative; display: block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; line-height: 1.5;font-weight: 700; }
#top_about .link_list .square { position:absolute; inset: auto 0 0 auto; display:block; width:calc(80vw / 19.2); height:calc(80vw / 19.2); clip-path: polygon(100% 0, 0% 100%, 100% 100%); }
#top_about .link_list .square i { margin: 1.5em 0 0 1.5em; }

#top_about .link_list .box:hover .thumb { transform: scale(1.04); }
#top_about .link_list .decoration { top:auto; bottom:0.2em;font-style: italic; }




#top_business {
	padding: 5em 0 3em 0;
	background-image:url(../img/home/top_business_bg.webp); background-size:100%; background-position:center top; background-repeat:no-repeat;
}

#top_business .illust1 { inset:4em auto auto 0; }
#top_business .illust2 { inset:3em 1em auto auto; }


#top_business .box { margin-block-start: 5em; margin-block-end: 5em; }

#top_business .box .text { width:calc(680vw / 19.2); }
#top_business .box .thumb { width:calc(740vw / 19.2); }

#top_business .box .text .box_ttl { margin-block-start:0; }
#top_business .box .text .box_ttl .slug { display:block; line-height: 1.5; }
#top_business .box .text .box_ttl .num { display:block; line-height: 1.5; }
#top_business .box .text .box_ttl .ja {
	display:block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; font-weight: 700; line-height: 1.5;
}

#top_business .box .text .catch { font-weight:700; }




#top_facility {
	padding: 5em 0 5em 0;
	background-image:url(../img/home/top_facility_bg.webp); background-size:100%; background-position:center bottom; background-repeat:no-repeat;
}

#top_facility .text { padding: 0 0 0 calc(200vw / 19.2); }
#top_facility .link_list {  }
#top_facility .link_list .box { width:calc(740vw / 19.2); aspect-ratio: 37 / 24; overflow:hidden; }
#top_facility .link_list .box .gradation {
	display: grid; place-items: center; place-content: center;
	position:relative; inset:0; width:100%; height:100%; z-index:1;
	background: linear-gradient(to top, rgba(5,54,91,1) 0,rgba(13,82,134,0.4) 20%,rgba(13,82,134,0) 50%, transparent 100%);
}
#top_facility .link_list .box .thumb {
	display:block; width:100%; height:100%; object-fit:cover;
	position: absolute; inset: 0; z-index: 0; transition: transform .4s ease;
}
#top_facility .link_list .square { position:absolute; inset: auto -0.5px -0.5px auto; z-index:2; display:block; width:calc(80vw / 19.2); height:calc(80vw / 19.2); clip-path: polygon(100% 0, 0% 100%, 100% 100%); }
#top_facility .link_list .square i { margin: 1.25em 0 0 1.25em; }

#top_facility .link_list .slug { position:relative; display: block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; margin-block-end:0.5em; line-height: 1.5; }
#top_facility .link_list .ja { position:relative; display: block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; line-height: 1.5;font-weight: 700; }
#top_facility .link_list { margin-block-start:3em; }

#top_facility .link_list .box:hover .thumb { transform: scale(1.04); }




#top_recruit {
	padding:5em 0 5em 0; background-image:url(../img/home/top_recruit_bg.webp); background-size:100%; background-position:center top; background-repeat:no-repeat;
}

#top_recruit .illust3 { inset:2em auto auto 4em; }
#top_recruit .illust4 { inset:-2em 2em auto auto; }

#top_recruit .ttl { margin-block-end:3em; }
#top_recruit .ttl.center::after { background-color:#FFFFFF; }

#top_recruit .text { width:calc(720vw / 19.2); }
#top_recruit .text .catch .clip { display:block; clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%); }
#top_recruit .text .catch .clip  span {
	width:max-content; padding:0.1em 2em 0.1em 0.5em;
	margin-block-end: 0.5em; font-weight: 700;
}




#top_recruit .thumb { width:calc(860vw / 19.2); aspect-ratio: 43 / 26; margin-block-start:2em; }
#top_recruit .thumb .heading { height:100%; object-fit:cover; }



#top_recruit .link_list { padding: 4em 0 0 0; }

#top_recruit .link_list .box { width:calc(400vw / 19.2); aspect-ratio: 4 / 3; overflow:hidden; }
#top_recruit .link_list .box .thumb {
	display:block; width:100%; height:100%; object-fit:cover;
	position: absolute; inset: 0; z-index: 0; transition: transform .4s ease;
}

#top_recruit .link_list .anchor { position:absolute; margin:0; inset:auto auto 0 0; }

#top_recruit .link_list .slug { display: block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; margin-block-end:0.5em; line-height: 1.5; }
#top_recruit .link_list .ja { display: block; width:max-content; padding:0.3em 0.25em 0.1em 0.5em; line-height: 1.5; font-weight: 700; }
#top_recruit .link_list .ja i { margin-left:0.5em; }

#top_recruit .link_list .box:hover .thumb { transform: scale(1.04); }
#top_recruit .link_list .decoration { top:auto; bottom:0.2em; }





#top_gallery { padding:5em 0 6em 0; background:linear-gradient(to bottom,#E5F0F9 0,#E5F0F9 62%,#FFFFFF 62%, #FFFFFF 100%); }

#top_gallery .illust5 { inset:-1em auto auto 4em; }
#top_gallery .illust6 { inset:-2em 0 auto auto; }

#top_gallery .box { width:calc(720vw / 19.2); margin-block-start:4em; }
#top_gallery .box .top_gallery_ttl { display:block; padding: 0 0 0 1em; overflow:hidden; margin-block-end:1em; }
#top_gallery .box .top_gallery_ttl .square {
	display:grid; place-items:center; width:calc(80vw / 19.2); height:101%; position: absolute; inset: -0.5px -0.5px 0 auto; clip-path: polygon(calc(20vw / 19.2) 0%, 100% 0%, 100% 100%, 0% 100%);
}
#top_gallery .box .top_gallery_ttl .square i { margin-left: 0.25em; }

#top_gallery .box .thumb { display:block; aspect-ratio: 8 / 5; }
#top_gallery .box .thumb .heading { height:100%; object-fit:cover; }

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

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

#about_hero .box { width:calc(750vw / 19.2); clip-path: polygon(calc(80vw / 19.2) 0, 100% 0, 100% 100%, 0 100%, 0 calc(80vw / 19.2)); padding: 2em 1.5em 3em 1.5em; }
#about_hero .box dt { padding:0 0 2.5em 0; }
#about_hero .box dt .ja { line-height:1.5; }
#about_hero .box dt::after { content:""; position:absolute; inset:auto 0 0 0; margin:auto; width:1px; height:1.5em; background-color:#FFFFFF; }
#about_hero .box dd { margin:0; padding:1.5em 0 0 0; }
#about_hero .box dd span { width:max-content; line-height: 1; padding: 0.4em 0.6em 0.4em 0.6em;  font-weight: 700; }




#greeting { padding: 5em 0 5em 0; background-image:url(../img/about/greeting_bg.webp); background-size:100%; background-position:center top; background-repeat:no-repeat; }

#greeting .picture_box {  }
#greeting .picture_box .thumb { width:calc(850vw / 19.2); aspect-ratio: 85 / 48; }

#greeting .picture_box .catch { inset:auto 4em 0 auto; }
#greeting .picture_box .catch .clip { display: block; clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%); }
#greeting .picture_box .catch .clip span { width: max-content; padding: 0.1em 2em 0.1em 0.5em; margin-block-end: 0.5em; font-weight: 700; }

#greeting .illust20 { inset:-8em auto auto 0; }
#greeting .illust21 { inset:2em 0 auto auto; }
#greeting .illust22 { inset:25em auto auto 0; }
#greeting .text {  }
#greeting .text .box { width:calc(730vw / 19.2); margin-block-start:2em; }
#greeting .text .box dt { position:relative; margin:0; padding:0 0 1em 0; font-weight:600; }
#greeting .text .box dt::after { content:""; position:absolute; inset:auto 0 0 0; margin:auto; width:100%; height:calc(15vw / 19.2); background-color:#B1D1E9; clip-path: polygon(100% 0, 0 0, 0 100%); }
#greeting .text .box dd { margin:0; padding:1em 0 0 0; }

#slogan { padding: 5em 0 5em 0; background-image:url(../img/about/slogan_bg.webp); background-size:cover; background-position:center top; background-repeat:no-repeat; }

#slogan .illust23 { inset:1em auto auto 0; }
#slogan .illust24 { inset:4em 0 auto auto; }

#slogan .slogan_list { list-style-type:none; margin-block-start:4em; }
#slogan .slogan_list li { position:relative; padding: 0.75em 0 0.75em calc(135vw / 19.2); margin-block-start:1em; }
#slogan .slogan_list li .square {
	display: grid; place-items: center; width: calc(130vw / 19.2); height: 100%; position: absolute; inset: 0 auto 0 0; clip-path: polygon(0 0, 100% 0%, calc(100vw / 19.2) 100%, 0% 100%);
	line-height: 1; padding-right: 0.5em;
}

#slogan .ttl::after { background-color:#FFFFFF; }

#slogan .thumb_list { padding:2em 0 0 0; }
#slogan .thumb_list .thumb { width:calc(730vw / 19.2); aspect-ratio: 73 / 50; margin-block-start:2em; }



#organization { padding: 7em 0 6em 0; background-image:url(../img/about/organization_bg.webp); background-size:cover; background-position:center top; background-repeat:no-repeat; }
#organization .content { position:relative; padding: 1em 2em 2em 2em; }
#organization .content::before{
	content: ""; position: absolute; inset: 0; padding: 1em; background: linear-gradient(to right,#0D5286 0,#076AB5 30%,#076AB5 70%,#0D5286 100%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;
}

#organization .content .organization_ttl {
	position: relative; width: max-content; margin: -1.5em auto 0 auto; padding: 0 1em 0 1em;
	background: linear-gradient(to top, #FFFFFF 0, #FFFFFF 45%, transparent 100%);
}
#organization .content .organization_ttl::after { /*content:""; position:absolute; inset:auto 0 -0.75em 0; margin:auto; width:1px; height:0.5em; background-color:#0D5286;*/ }

#organization .content .slogan_text { margin-block-start:2em; margin-block-end: 1.5em; }



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

#company .illust25 { inset:-9em auto auto 0; }
#company .illust26 { inset:-7em 0 auto auto; }


#company .company_wrapper { margin-block-start:4em; }

#company .box_wrapper { padding:4em 0 4em 0; }
#company .box_wrapper .half { width:calc(740vw / 19.2); margin:0;}
#company .box_wrapper .half .box {  margin:0; }
#company .box_wrapper .half .box dt { margin:0; padding:1em 1em 1em 0; border-bottom:solid 1px #0D5286; width:9em; }
#company .box_wrapper .half .box dd { margin:0; padding:1em 0 1em 1em; border-bottom:solid 1px #B1D1E9; }

#company .img_box { z-index: 2; }
#company .img_box .heading { margin-block-end: 4em; aspect-ratio: 156 / 72; }


#company .map_section { padding: 5em 0 5em 0; }
#company .map_section .gmap { height:calc(500vw / 19.2); min-height:300px; }


#company .map_section .illust27 { inset:-14em 0 auto auto; z-index:0; }






/**** business ***************/
#business {
	padding: 5em 0 3em 0;
	background-image:url(../img/home/top_business_bg.webp); background-size:100%; background-position:center top; background-repeat:repeat-y;
}

#business .illust1 { inset:4em auto auto 0; }
#business .illust2 { inset:3em 1em auto auto; }


#business .box { margin-block-start: 6em; margin-block-end: 6em; padding-bottom:6em; }

#business .box .text { width:calc(680vw / 19.2); }
#business .box .thumb { width:calc(740vw / 19.2); }

#business .box .text .box_ttl { margin-block-start:0; }
#business .box .text .box_ttl .slug { display:block; line-height: 1.5; }
#business .box .text .box_ttl .num { display:block; line-height: 1.5; }
#business .box .text .box_ttl .ja {
	display:block; width:max-content; padding:0.1em 0.5em 0.1em 0.5em; font-weight: 700; line-height: 1.5;
}

#business .box .text .catch { font-weight:700; }

#business .illust10 { inset:4em 2em auto auto; }
#business .illust11 { inset:-13em 0 auto auto; z-index: 0; }

#business .illust12 { inset:-25em 2em auto auto; z-index: 0; }
#business .illust13 { inset:auto auto 3em 0; }


#business .box .thumb_list { align-items: self-start; padding:4em 0 0 0; }
#business .box .thumb_list .sub_thumb { width:calc(480vw / 19.2); aspect-ratio:1 /1; }
#business .box .thumb_list .sub_thumb1 { margin-block-start: 2em; }
#business .box .thumb_list .sub_thumb2 { margin-block-start: 6em; }
#business .box .thumb_list .sub_thumb3 { margin-block-start: 2em; }

#business #business02 .sub_thumb { width:calc(670vw / 19.2); aspect-ratio:67 / 37; }
#business #business03 .sub_thumb { width:calc(670vw / 19.2); aspect-ratio:67 / 37; }


/****** recruit ******************************/

#message { padding: 6em 0 5em 0; background:url(../img/recruit/message_bg.webp); background-size:100%; background-position:center bottom; min-height: calc(3000vw / 19.2); background-repeat:no-repeat; }

#message .ttl { margin-block-end: 1em; }
#message .ttl .ja { width: max-content; padding: 0.2em 0.5em 0.4em 0.5em; }
#message .ttl::after { display:none; }
#message .catch { margin-block-start:0; margin-block-end: 0; }

#message .message_header { padding:0 0 3em 0; }
#message .message_header .text { padding-left:calc(110vw / 19.2); }
#message .message_header .text .catch { font-weight:800; }

#message .message_header .president { width:calc(600vw / 19.2); height:calc(513vw / 19.2); inset:auto 1em 0 auto; }

#message .box {
	clip-path: polygon(calc(75vw / 19.2) 0, 100% 0, 100% 99%, 0 100%, 0 calc(80vw / 19.2));
	padding:1em 5em 1em 5em; margin-block-end:4em;
}
#message .box .box_ttl { font-weight:700; }

#message .box .text { width:calc(730vw / 19.2); }
#message .box .thumb { width:calc(730vw / 19.2); aspect-ratio: 73 / 45; box-shadow:10px 10px 0 #B1D1E9; }
#message .box .text .slug { font-weight:600; line-height: 1; }




#attempt { padding: 5em 0 5em 0; background:url(../img/recruit/attempt_bg.webp); background-size:100%; background-position:center bottom; background-repeat:no-repeat; }
#attempt .illust28 { inset:4em auto auto 0; }
#attempt .illust29 { inset:0 0 auto auto; }
#attempt .illust30 { inset:auto auto 10em 0; }


#attempt .box_wrapper { background:linear-gradient(to top,rgba(249, 252, 255,0.8) 0,transparent 100%); padding-bottom:4em; }

#attempt .drop_shadow { filter: drop-shadow(5px 5px 0 #E5F0F9); }
#attempt .box { clip-path: polygon(100% 0, 100% 85%, 95% 100%, 0 100%, 0 0); padding-bottom:2em; margin-block-start:4em;  }

#attempt .box .box_content { padding: 0 6em 0 6em; }
#attempt .box .box_content dt { position: relative; width: max-content; margin: 0 auto; padding: 0 0 1em 0; font-weight: 600; }
#attempt .box .box_content dt::after { content: ""; position: absolute; inset: auto 0 0 0; margin: auto; width: 100%; height: calc(15vw / 19.2); background-color: #B1D1E9; clip-path: polygon(100% 0, 0 0, 0 100%); }
#attempt .box .box_content .text { margin: 0; padding: 1em 0 0 0; }

.recruit_loop { padding:4em 0 4em 0; z-index:2; background:url(../img/recruit/recruit_loop_bg.webp); background-size:cover; }
.recruit_loop .illust31 { inset:-10em 0 auto auto; z-index:1; }
.recruit_loop .loop-slider { overflow: hidden; }
.recruit_loop .loop-slider .slider_track { display:flex; width:max-content; gap:0; position:relative; z-index:2; }
.recruit_loop .loop-slider .slide { width:calc(530vw / 19.2); aspect-ratio: 53 / 33; margin:calc(10vw / 19.2); clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%); }
.recruit_loop .loop-slider .slide .heading {  }


#interview { padding: 5em 0 18em 0; background:url(../img/recruit/interview_bg.webp); background-size:cover; background-position:center top; background-repeat:no-repeat; }

#interview .illust32 { inset:3em auto auto 0; }
#interview .illust33 { inset:2em 1em auto auto; }

#interview .ttl::after { background-color:#FFFFFF; }

#interview .box { margin-block-start:4em; padding:2em 5.5em 2em 5.5em; }
#interview .box .thumb { width:calc(730vw / 19.2); aspect-ratio: 73 / 52; padding:1em 1.5em 1em 1.5em; margin-block-start: 1.5em; }
#interview .box .text { width:calc(740vw / 19.2); }


#interview .box .thumb img.heading { position: absolute; inset: 0; height: 100%; object-fit: cover; z-index:0; }
#interview .box .thumb .slug { display:block; }
#interview .box .thumb .num { display:block; line-height: 1; margin-block-end: 1.5em; }
#interview .box .thumb .staff_slug { display:block; width: max-content; line-height: 1; padding:0.4em 0.5em 0.4em 0.5em; margin-block-end: 0.5em; }
#interview .box .thumb .staff_name { line-height: 1; padding:0.3em 0.5em 0.3em 0.5em; font-weight: 800; }


#interview .box .text .catch .clip { display:block; clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%); }
#interview .box .text .catch .clip span {
	width:max-content; padding:0.1em 2em 0.1em 0.5em; /**/
	margin-block-end: 0.5em;font-weight: 700;
}

.interview_footer_img { top: -13em; }

#requirements { padding: 18em 0 6em 0; background:url(../img/recruit/requirements_bg.webp); background-size:cover; background-position:center bottom; background-repeat:no-repeat; }


#requirements .illust34 { inset:20em auto auto 0; }
#requirements .illust35 { inset:17em 0 auto auto; }

#requirements .requirements_wrapper { margin-block-start:4em; }
#requirements .requirements_wrapper .half { width:calc(740vw / 19.2); }
#requirements .requirements_wrapper .half .box { border-bottom:solid 1px #B1D1E9; margin: 0; }
#requirements .requirements_wrapper .half .box dt { width:8em; text-align: center; margin: 0; padding: 1em 0 1em 0; }
#requirements .requirements_wrapper .half .box dt .clip { display:block; width:7em; clip-path: polygon(0 0, 100% 0%, 95% 100%, 0% 100%); }
#requirements .requirements_wrapper .half .box dd { margin:0; padding: 1em 0 1em 0; }


/****** facility *****************************/

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

#about_factory .illust36 { inset:2em auto auto 0; }
#about_factory .illust37 { inset:4em 0 auto auto; }

#about_factory .summary { margin-block-start: 4em; }
#about_factory .about_factory_thumb { margin-block-start: 2em; }
#about_factory .about_factory_thumb .heading { border: solid 10px #0D5286; filter: drop-shadow(10px 10px 0 #B1D1E9); }

#about_factory .movie_list { margin-block-start: 2em; }
#about_factory .movie_list .movie { width: calc(560vw / 19.2); aspect-ratio: 28 / 19; margin: 0 calc(50vw / 19.2) calc(50vw / 19.2) 0; }
#about_factory .movie_list .movie:nth-of-type(3n) { margin: 0 0 calc(50vw / 19.2) 0; }


#factory_layout { padding: 5em 0 0 0; background:url(../img/facility/factory_layout_bg.webp); background-size:cover; }
#factory_layout .illust38 { inset:auto auto 40em 0; }

#factory_layout .content { border:solid 2px #0D5286; z-index: 2; }
#factory_layout .content dd { margin:0; padding:3em; display:grid; place-items:center; }
#factory_layout .factory_layout_thumb { width: calc(730vw / 19.2); aspect-ratio: 730 / 867; }


.facility_loop { padding:4em 0 4em 0; background: linear-gradient(to bottom, transparent 0, transparent 40%, #007BD9 40%, #076EBC 60%, #0D5286 100%); }
.facility_loop .illust31 { inset:-10em 0 auto auto; z-index:1; }
.facility_loop .loop-slider { overflow: hidden; }
.facility_loop .loop-slider .slider_track { display:flex; width:max-content; gap:0; position:relative; z-index:2; }
.facility_loop .loop-slider .slide { width:calc(580vw / 19.2); aspect-ratio: 29 / 20; margin:calc(20vw / 19.2); clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%); }
.facility_loop .loop-slider .slide .heading {  }


#equipment { padding: 5em 0 5em 0; background:url(../img/facility/equipment_bg.webp); background-size:100%; background-position:center bottom; background-repeat:no-repeat; }


#equipment .illust39 { inset:2em auto auto 0; }
#equipment .illust40 { inset:4em 0 auto auto; }


#equipment .summary {  }
#equipment .equipment_list_ttl {  }

#equipment .equipment_list { border-collapse: collapse; }
#equipment .equipment_list tr.border_top {border-top: solid 2px #0D5286; }
#equipment .equipment_list th { border: solid 1px #0D5286; }
#equipment .equipment_list td { border: solid 1px #0D5286; text-align:center; }

#equipment .specifications { margin:0; border: solid 1px #0D5286; }
#equipment .specifications dt { margin:0; border-bottom: solid 1px #0D5286; }
#equipment .specifications dd { margin:0; }
#equipment .specifications dd .half { width:50%; padding: 1em 2em 1em 4em; }
#equipment .specifications dd .half .specifications_list { list-style-type:none; padding: 0; }
#equipment .specifications dd .half .specifications_list li { margin: 1em 0 1em 0; }
#equipment .specifications dd .half .specifications_list li .num { width: 2em; height: 2em; align-items:center; text-align: center; margin-right:1em; }


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

#facility_gallery .illust41 { inset:14em auto auto 0; }
#facility_gallery .illust42 { inset:auto 0 -4em auto; }

#facility_gallery .content { z-index: 2; }
#facility_gallery .content .thumb { width:calc(730vw / 19.2); aspect-ratio: 730 / 449; margin:0 calc(99vw / 19.2) 3em 0; filter: drop-shadow(10px 10px 0 #B1D1E9); }
#facility_gallery .content .thumb:nth-of-type(2n) { margin:0 0 3em 0; }



/****** gallery ******************************/
#movie { padding: 6em 0 6em 0; }

#movie .illust14 { inset: -4em auto auto 2em; z-index:0; }
#movie .illust15 { inset: 6em 0 auto auto; z-index:0; }

#movie .content { margin-block-start:4em; }
#movie .content .movie { width:calc(480vw / 19.2); aspect-ratio: 64 / 43; margin:0 calc(60vw / 19.2) calc(60vw / 19.2) 0; }
#movie .content .movie:nth-of-type(3n){ margin:0 0 calc(60vw / 19.2) 0; }


#photo {
	padding: 6em 0 6em 0;
	background:url(../img/gallery/photo_bg_top.webp),url(../img/gallery/photo_bg_bottom.webp); background-size:100%,calc(1200vw / 19.2); background-position:center top,right bottom; background-repeat:no-repeat,no-repeat;
}

#photo .ttl::after { background-color:#FFFFFF; }

#photo .content { margin-block-start:4em; }
#photo .content .thumb { width:calc(360vw / 19.2); aspect-ratio: 9 / 8; margin:0 calc(40vw / 19.2) calc(40vw / 19.2) 0; }
#photo .content .heading { height:100%; object-fit:cover; }
#photo .content .thumb:nth-of-type(4n){ margin:0 0 calc(40vw / 19.2) 0; }


#photo .illust16 { inset: -4em auto auto 0; z-index:0; }
#photo .illust17 { inset: -14em 0 auto auto; z-index:0; }
#photo .illust18 { inset: 45em 0 auto auto; z-index:0; }
#photo .illust19 { inset: auto auto 12em 0; z-index:0; }


/****** contact ******************************/
#contact_hero { padding: 5em 0 5em 0; }


#contact_hero .phone_warapper {
	margin-block-start:5em; padding: calc(85vw / 19.2) 0 calc(85vw / 19.2) 0;
	background-image:url(../img/contact/phone_warapper_bg.webp); background-size:100%; background-position:center bottom; background-repeat:repeat;
}
#contact_hero .phone_warapper .phone_inner { padding:calc(40vw / 19.2) calc(120vw / 19.2) calc(40vw / 19.2) calc(140vw / 19.2); align-items: flex-start; }

#contact_hero .phone_warapper .phone_inner .tel_btn {
	position:relative; width:calc(620vw / 19.2); height:calc(140vw / 19.2); line-height:calc(140vw / 19.2); display:block; border:solid 1px #0D5286; overflow: hidden;
	transition:0.5s ease; margin: 2em 0 0 0; padding-left:calc(210vw / 19.2);
}
.
#contact_hero .phone_warapper .phone_inner .tel_btn i {
	margin-right: 0.6em;
}

#contact_hero .phone_warapper .phone_inner .tel_btn .square {
	display:grid; place-items:center; width:calc(160vw / 19.2); height:100%; position: absolute; inset: 0 auto 0 0; clip-path: polygon(0 0, 100% 0%, calc(120vw / 19.2) 100%, 0% 100%);
}
#contact_hero .phone_warapper .phone_inner .content .hour { margin-block-start:0; }


#contact {
	padding: 10em 0 6em 0;
}

.illust7 { inset:3em auto auto 0; }
.illust8 { inset:2em 0 auto auto; }
.illust9 { inset:auto 0 0 auto; }


#contact .contact_phone .contact_ttl {  }
#contact .contact_phone .contact_ttl .burs { margin-block-end: 0.3em }
#contact .contact_phone .contact_ttl .ja { display: block; line-height: 1.6; }
#contact .contact_phone .contact_ttl .slug { display: block; font-weight:bold; line-height: 1.2;}

#contact .contact_phone .summary { margin-block-start: 2em; margin-block-end: 3em; }
#contact .contact_phone .tel_btn {
	position:relative; width:calc(415vw / 19.2); height:calc(100vw / 19.2); line-height:calc(100vw / 19.2); display:block; text-align:center; border:solid 3px #000000;
	transition:0.5s ease; margin: 2em auto 2em auto; border-radius:50vmax;
}
#contact .contact_phone .tel_btn i {
	position:absolute; left:0.7vw; line-height: calc(91vw / 19.2);
	background-color: #FFFFFF; clip-path: circle(32% at 50% 50%); padding-left: 0.05em;
}
#contact .contact_phone .tel_btn:hover { opacity:1; background:#000; color:#FFF; }



#contact .contact_email .contact_ttl {  }
#contact .contact_email .contact_ttl .burs { margin-block-end: 0.3em }
#contact .contact_email .contact_ttl .ja { display: block; line-height: 1.6; }
#contact .contact_email .contact_ttl .slug { display: block; font-weight:bold; line-height: 1.2;}


#contact .contact_email .contact_email_wrapper {
	padding:calc(40vw / 19.2) calc(80vw / 19.2) calc(80vw / 19.2) calc(80vw / 19.2); box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); border-radius:1em; margin-block-start:3em;
}





#form {  }



#form .box { margin:0; border-bottom: solid 1px #CDDEEA; }
#form .box dt { width:16em; padding:2.5em 0 1.5em 0; vertical-align: top; }
#form .box dt .field {	}
#form .box dt .required { display:inline-block; margin-left:1em; padding:0.3vw 0.4vw 0.3vw 0.4vw; line-height:1; }
#form .box dt .any { display:inline-block; margin-left:1em; padding:0.3vw 0.4vw 0.3vw 0.4vw; line-height:1; border:solid 1px #0D5286; }
#form .error { display: block; }

#form .box dd { padding:1.5em 1em 1.5em 2em; }
#form.confirm .box dd { padding:2.25em 1em 2em 2em; }

#form .box dd input[type="text"], #form .box dd input[type="tel"], #form .box dd input[type="email"] { width: 100%; padding:1em; border: solid 1px #0D5286; }
#form .box dd textarea { width: 100%; padding:1em; border:solid 1px #0D5286; height: 12em; }

#form .box dd input.short { width:10em; }

form .box label { display: inline-block; cursor:pointer; margin:0.75em 2em 0.75em 0; }

form .box input[type=checkbox] { height: 1.5em; width: 1.5em; margin:0 0.6em 0.15em 0; background-color: #FFF; border:solid 1px #0D5286; vertical-align: middle;}
form .box input[type=checkbox]:checked { border: 2px solid #0D5286; background-color: #0D5286;}
form .box input[type=checkbox]:checked::before {
	content: ""; display: block; position: relative; left: 0.5em; top: 0; width: 0.5em; height: 1em; border: solid white; border-width: 0 3px 3px 0; transform: rotate(45deg);
}
form .box input[type=checkbox]:focus-visible { }




#form .box dd .memo { display:block; margin-block-start:1em; }

#form .form_btn_wrapper { position:relative; width: calc(400vw / 19.2); height: calc(90vw / 19.2); transition:0.5s ease; margin: 4em auto 4em auto; }
#form .next {
	position:relative; width:calc(400vw / 19.2); height:calc(90vw / 19.2); line-height:calc(90vw / 19.2); display:block; text-align:center;
	transition:0.5s ease; margin: 2em auto 2em auto; cursor:pointer; border:solid 1px #0D5286; overflow: hidden;
}



#form .next .square {
	display:grid; place-items:center; width:calc(80vw / 19.2); height:100%; position: absolute; inset: 0 0 0 auto; clip-path: polygon(calc(20vw / 19.2) 0%, 100% 0%, 100% 100%, 0% 100%);
}
#form .next .square i { margin-left: 0.25em; }


#form .form_btn_wrapper::before {
	position: absolute; inset:0; z-index: 0; content: "";
	width: calc(400vw / 19.2); height: calc(90vw / 19.2); background-color: #CDDEEA; transition: transform 2s ease; transform: translate(0, 0);
}
#form .form_btn_wrapper.move.active::before { transform: translate(5px, 5px); }


#form .send_btn {
	position:relative; width:calc(400vw / 19.2); height:calc(90vw / 19.2); line-height:calc(90vw / 19.2); display:block; text-align:center;
	transition:0.5s ease; cursor:pointer; border:solid 1px #0D5286; overflow: hidden;
}

#form .send_btn .square {
	display:grid; place-items:center; width:calc(80vw / 19.2); height:100%; position: absolute; inset: 0 0 0 auto; clip-path: polygon(calc(20vw / 19.2) 0%, 100% 0%, 100% 100%, 0% 100%);
}
#form .send_btn .square i { margin-left: 0.25em; }



#form .back_btn {
	position:relative; width:calc(400vw / 19.2); height:calc(90vw / 19.2); line-height:calc(90vw / 19.2); display:block; text-align:center;
	transition:0.5s ease; cursor:pointer; border:solid 1px #0D5286; overflow: hidden;
}
#form .back_btn .square {
	display:grid; place-items:center; width:calc(80vw / 19.2); height:100%; position: absolute; inset: 0 auto 0 0; clip-path: polygon(0 0, 100% 0, calc(60vw / 19.2) 100%, 0% 100%);
}
#form .back_btn .square i { margin-right: 0.25em; }