/* CSS Document */

@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
/*
Light   300
Regular 400
Medium  500
Bold    700
Black   900
*/

/*
@import "svg.css";
*/

:root{
/* color */
--color-K:#333;
--color-KB:rgb(0,28,74);
--color-R:#F00;/* #dc3c50 */
--color-B:#003894;
--color-B-T050:#809bc9;/* rgba(0,56,148,0.5) */
--color-B-T030:#b2c3df;/* rgba(0,56,148,0.3) */
--color-B-T010:#e5ebf4;/* rgba(0,56,148,0.1) */
--color-gray-8:#808080;
--color-gray-9:#999999;
--color-gray-A:#a0a0a0;
--color-gray-B:#b3b3b3;
--color-gray-C:#cccccc;
--color-gray-E:#e6e6e6;
--color-gray-F:#f2f2f2;
/* --color-clear:rgba(0,0,0,0.25); */
/* grad */
--grad-BX:linear-gradient(45deg, var(--color-B) 0%, rgba(0,56,148,0.5) 70%, rgba(0,56,148,0) 100%);
--grad-BK:linear-gradient(45deg, var(--color-B) 0%, var(--color-KB) 70%, #000 100%);
--grad-BK-text:linear-gradient(90deg, var(--color-B) 0%, var(--color-KB) 70%, #000 100%);
--grad-BK-bar:linear-gradient(180deg, var(--color-B) 0%, var(--color-KB) 70%, #000 100%);
/* size */
--size-header-H :100px;
--size-sp      :max(1px,calc(1vw / 3.75));
--size-sp-pc1vw:var(--size-sp);
--size-sp-80per:min(1px,calc(var(--size-sp) * 4 / 5));
--size-inner-mgn:min(25px,calc(20 * var(--size-sp)));
--size-inner-maxW:calc(100% - var(--size-inner-mgn) * 2);
--size-inner-960 :min( 960px,var(--size-inner-maxW));
--size-inner-980 :min( 984px,var(--size-inner-maxW));/* 名前の数値より若干大きめ */
--size-inner-1100:min(1100px,var(--size-inner-maxW));
--size-inner-1350:min(1350px,var(--size-inner-maxW));
--size-inner-1400:min(1400px,var(--size-inner-maxW));
--size-radius    :min(10px,calc(4 * var(--size-sp)));
--size-radius-sp8:min(10px,calc(8 * var(--size-sp)));
/* font */
--font-jp: "Noto Sans JP", sans-serif;
--font-en: "Roboto", "Noto Sans JP", sans-serif;
/* transition */
--transition-fast:0.3s;
--transition-middle:0.5s;
}
@media screen and (min-width: 1000px) {
	:root{
		--size-sp-pc1vw:1vw;
	}
}
@media screen and (max-width: 999px) {
	:root{
		--size-header-H:80px;
	}
}

*{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
html,.font_sizebase{font-size:16px;}
html *{
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	word-break: break-all;
	text-box-trim: trim-both;
}
body{
	margin: 0px; padding: 0px;
	font-size: 1rem; font-weight: 400;
	font-family: var(--font-jp);
	/* font-family: "Noto Sans JP",'游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif; */
	/* font-family: 'Zen Maru Gothic', sans-serif; */
	line-height:normal;
}
body,body *{line-height: normal;}
body,.col_base{color:var(--color-K);}
h1,h2,h3,h4,h5,h6,p,form,hr,
dl,dt,dd,ul,li,figure{margin:0; padding:0;}
ul,li{list-style-type: none;}
/* ul::after{clear:both;} */
span{display:inline-block;}
a{color:inherit;text-decoration:none;}
/*
a:hover{text-decoration: underline;}
a.ov_white{transition: opacity 0.3s ease;}
a.ov_white:hover{opacity:0.8;}
*/
a img{border:none;}
hr{
	/* border-top:solid 1px rgba(0,0,0,0.25); */
	border:none; border-top:solid 1px var(--color-K);
}
figure,img,svg{max-width:100%;display:block;}
picture{max-width:100%; display: flex; justify-content: center; align-items: center;}
picture source{display: none;}
picture img,
figure img{width:100%; height:auto;}
img{min-width:1rem; object-fit:cover;}
img[src*=".svg"],svg{width:100%; object-fit:contain;}
@media screen and (min-width: 1000px) {
	a[href*="tel:"]{pointer-events:none;}
}

/* ----- */

.col_W{color:#FFF;}
.bg_K{background-color: #000; color:#FFF;}

.en{font-family: var(--font-en);}

.float_set::after{content:''; display: block; clear: both;}

.cmn_logo{font-size: calc(16 * var(--size-sp-80per)); font-weight: 700; display: flex; flex-direction: column;}
.cmn_logo .jp{font-size: 1em; text-align: justify; text-align-last: justify;}
.cmn_logo .en{font-size: 2.5em; font-family: var(--font-en); margin: -0.2em 0;}

.cmn_subt1{display: flex; flex-direction: column; align-items: center;}
.cmn_subt1[type="L"]{align-items: flex-start;}
.cmn_subt1 .en{font-size: min(80px,calc(50 * var(--size-sp))); margin: -0.2em 0 0;}
.cmn_subt1:not([class*="col_"]) .en{
	background: var(--grad-BK);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.cmn_subt1 h3{font-size: min(20px,calc(16 * var(--size-sp)));}

.cmn_subt2{font-size: min(65px,calc(32 * var(--size-sp))); display: flex; justify-content: center;}
.cmn_subt2[type="L"]{gap: 0.5em; justify-content: flex-start;}
.cmn_subt2[type="L"]::before{
	content:''; display: block; background: var(--grad-BK-bar);
	width: min(10px,calc(4 * var(--size-sp))); height: 1em;
}
.cmn_subt2.col_W[type="L"]::before{background: #FFF;}
.cmn_subt2 h3{font-size: 1em; margin: -0.25em 0;}
.cmn_subt2:not([class*="col_"]) h3{
	background: var(--grad-BK-text);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

*[class*="cmn_font"]{text-align: justify; white-space: pre-wrap;}
.cmn_font47{font-size: min(47px,calc(28 * var(--size-sp)));}
.cmn_font26{font-size: min(26px,calc(20 * var(--size-sp)));}

.cmn_text{font-size: 1rem; line-height: min(2.5em,calc(30 * var(--size-sp))); text-align: justify; white-space: pre-wrap;}
.cmn_text.textC{text-align: center;}
.cmn_text.textR{text-align: right;}

*[prewrap]{white-space: pre-wrap;}

span[tume*="L"]{margin-left: -0.75em;}
span[tume*="R"]{margin-right: -0.75em;}
span[tume="LR"]{margin: 0 -0.375em;}

.btn_oval{color: #FFF; background-color: #000; position: relative;
	overflow: hidden; font-size: 70px; font-weight: 700; width: 285px; max-width: 100%; height: 1em; border-radius: 1em;
	display: flex; justify-content: center; align-items: center;
}
.btn_oval > *{font-size: 18px; text-align: center; position: relative; z-index: 2;}
.btn_oval:not(.no_ov)::before{content:''; display: block; background: var(--grad-BX);
 	position: absolute; top:0; right:100%; width:100%; height:100%;
	transition: right var(--transition-fast);
}
.btn_oval.bg_W{transition: background-color var(--transition-fast)
													,color var(--transition-fast);}
.btn_oval.bg_W{background-color: #FFF; color:var(--color-K);}
.btn_oval.typeH{font-size: 40px; width: 290px;}
.btn_oval.typeH > *{font-size: 1rem;}
.btn_oval.typeF{font-size: calc(40 * var(--size-sp-80per)); width: calc(1em * 170 / 40);}
.btn_oval.typeF > *{font-size: calc(1em * 14 / 40);}
/*
.btn_oval.typeHF{font-size: 40px; width: 170px;}
.btn_oval.typeHF > *{font-size: 15px; font-family: var(--font-en);}
*/
.btn_oval svg[fn*="arrow"]{position: absolute; right:25px; width: auto; height: 30px;}
.btn_oval svg[fn*="arrow"] *{stroke:#FFF; transition: stroke var(--transition-fast);}
.btn_oval.typeH svg[fn*="arrow"]{right:1em; height:1em;}
.btn_oval.typeH svg[fn*="arrow"] *{stroke-width: 3px;}
.btn_oval.bg_W:not(:hover) svg[fn*="arrow"] *{stroke:#000;}
@media screen and (min-width: 1000px) {
	.btn_oval:hover::before{right:0;}
	.btn_oval.bg_W:not(.no_ov):hover{color: #FFF; background-color: #000;}
	/* .btn_oval.bg_W.no_ov:hover{background-color: #FFF; color:var(--color-K);} */
	.btn_oval.type_contact{font-size: 120px; width: 600px;}
	.btn_oval.type_contact > *{font-size: 23px;}
	/*
	.btn_oval.type_contact .en{font-size: 38px;}
	.btn_oval.type_contact .jp{font-size: 16px;}
	*/
}
@media screen and (max-width: 999px) {
	.btn_oval:not(.bg_W)::before{right:0;}
	.btn_oval.bg_W svg[fn*="arrow"] *{stroke:#000;}
}

.btn_more{font-size: 18px;
gap: 1.5em; display: flex; align-items: center;}
.btn_more:hover{color:var(--color-B); text-decoration: underline;}
.btn_more svg{width: auto; height: 28px;}
.btn_more:hover svg[fn="arrow-btn"] *{stroke:var(--color-B);}

.btn_maruarrow,
.btn_maruarrow *{position: relative;
	transition: background-color var(--transition-fast)
							,color var(--transition-fast);}
.btn_maruarrow,
.btn_maruarrow .a{overflow: hidden;}
.btn_maruarrow::before,
.btn_maruarrow .a::before{
	content:''; display: block; background: var(--grad-BX);
 	position: absolute; top:0; width:100%; height:100%;
}
.btn_maruarrow{background-color: #FFF;}
.btn_maruarrow::before{transition: right var(--transition-fast); right:100%;}
.btn_maruarrow > *{z-index: 2;}
.btn_maruarrow .a{width: 1em; min-width: 1em; height: 1em;
border-radius: 100%; background-color: #000;
display: flex; justify-content: center; align-items: center;}
.btn_maruarrow .a::before{right:0; transition: opacity var(--transition-fast); opacity:1;}
.btn_maruarrow .a svg{width:auto; position: relative; z-index: 2;}
.btn_maruarrow .a svg *{stroke: #FFF; transition: stroke var(--transition-fast);}
.btn_maruarrow:hover{background-color: #000; color:#FFF;}
.btn_maruarrow:hover::before{right:0;}
.btn_maruarrow:hover .a{background-color: #FFF;}
.btn_maruarrow:hover .a::before{opacity:0;}
.btn_maruarrow:hover .a svg *{stroke: var(--color-B);}


.num_list{counter-reset: number 0;}
/*
counter-increment: number 1;
content: counter(number, decimal-leading-zero);
*/

.anchor{position: relative;}
.anchor a{position:absolute;top:calc(var(--size-header-H) * -1);left:0;}

/* ----- */

body > *{min-width:375px; /* overflow-x: hidden; */}
header,main,footer,body > * > .inner{display: flex; align-items: center;}
header{
	position: fixed; top:0; left:0; width: 100%; z-index: 1000;
}
header::before{
	content: ''; position: absolute; inset:0; z-index: -1; display: block; background-color: rgba(255,255,255,0);
	transition: background-color var(--transition-fast);
}
/* body:not(.top) header::before, */
header.bg_W::before{background-color: rgba(255,255,255,0.5);}
header .inner{
	width:100%; margin: 0 auto; padding-left: max(4.5%,20px); padding-right: max(2%,20px);
	min-height: var(--size-header-H);
}
header .cmn_logo{font-size: 0.9rem; margin-right: auto; transition: color var(--transition-fast);}
header.active .cmn_logo{color:#FFF;}
header .hmenu{
	min-height: var(--size-header-H);
	gap: 0 3vw; display: flex;
}
header .hmenu > *,
header .hmenu a{position: relative;
display: flex; justify-content: center; align-items: center;}
header .hmenu > * > a{font-size: 1rem; width:100%; height:100%; flex-direction: column;}
header .hmenu a .m{position: relative; display: flex; flex-direction: column; align-items: center;}
header .hmenu a .m::after{content: ''; display: block; width:0; border-bottom: solid 2px var(--color-B);
transition: width var(--transition-fast); position: absolute; bottom: -0.75em;}
header .hmenu a.current > .m::after,
header .hmenu a:hover > .m::after{width: 25px;}
header .hmenu a .m .jp{font-weight: 700;}
header .hmenu a .m .en{font-size: 0.75em; margin-top: 0.25em;}
header .hmenu .s{position: absolute; top: 100%; margin: 0 -200%; overflow: hidden; font-size: 14px;}
header .hmenu .s > *{margin-top: -200px; transition: margin-top var(--transition-fast); background-color: var(--color-B); color:#FFF; padding: 20px;}
header .hmenu .s > *[cnt]{margin-top: calc(attr(cnt number) * -20px + (attr(cnt number) - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="1"]{margin-top: calc(1 * -20px + (1 - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="2"]{margin-top: calc(2 * -20px + (2 - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="3"]{margin-top: calc(3 * -20px + (3 - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="4"]{margin-top: calc(4 * -20px + (4 - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="5"]{margin-top: calc(5 * -20px + (5 - 1) * -15px - 40px);}
header .hmenu .s > *[cnt="6"]{margin-top: calc(6 * -20px + (6 - 1) * -15px - 40px);}
header .hmenu .s > * > *{line-height: 20px; gap: 4px; justify-content: flex-start;}
header .hmenu .s > * > *:nth-of-type(n+2){margin-top: 15px;}
header .hmenu .s > * > *:not(:hover){opacity:0.8;}
header .hmenu .s > * > *::before{content:'-';}
header .hmenu > *:hover .s > *{margin-top: 0;}
header .btn{margin-left: 2.5vw;}
:root{
--header-btn-line-H:2px;
}
header .inner button{
	border:none;
	background-color: transparent;
	cursor: pointer;
	font-size: 46px; width: 1em;	min-width: 1em; height:1em;
	margin: 0; padding: 0; background-color: var(--color-B);
	display: flex; justify-content: center; align-items: center;
}
header .inner button > div{
	width:18px; height:calc(8px + var(--header-btn-line-H) * 3);
	display: flex; flex-direction: column; justify-content: space-between; align-items: center;
	transition: transform var(--transition-fast)
						, height var(--transition-fast);
}
header .inner button hr{margin: 0 -100%; width: 100%; height:var(--header-btn-line-H);
background-color: #FFF; border:none;
	transition: transform var(--transition-fast)
						, opacity var(--transition-fast)
						, width var(--transition-fast);
}
header .inner button hr:first-of-type{margin-bottom: -100%;}
header .inner button hr:last-of-type{margin-top: -100%;}
header.active .inner button > div{transform:rotate(360deg); height:var(--header-btn-line-H);}
header.active .inner button hr:first-of-type,
header.active .inner button hr:last-of-type{width: 125%;}
header.active .inner button hr:first-of-type{transform: rotate(45deg);}
header.active .inner button hr:nth-of-type(2){opacity:0;}
header.active .inner button hr:last-of-type{transform: rotate(-45deg);}
header .inner .smenu{
	position: absolute;	top:0; left:0; width:100%; height:0; z-index: -1;
	opacity: 0;	overflow: hidden;
	transition-property: opacity , height;
	transition-duration: var(--transition-fast), 0s;
	transition-delay: 0s, var(--transition-fast);
}
/*
header .inner .smenu *{line-height: 1em;}
*/
header.active .inner .smenu{
	height: 100vh;
	height: 100dvh; opacity: 1;
	transition-delay: 0s, 0s;
	overflow: hidden;
}
header .inner .smenu .flex{position: absolute; inset:0;
	display: flex; flex-direction: column;
}
header .inner .smenu .frame{
	background-color: var(--color-B); color:#FFF;
	padding-top: var(--size-header-H);
	transition: margin-top var(--transition-fast);
}
header:not(.active) .inner .smenu .frame{
	margin-top: max(-10vh,calc(var(--size-header-H) * -1));
	margin-top: max(-10dvh,calc(var(--size-header-H) * -1));
}
header .inner .smenu .frame .scr{
	max-height:calc(100vh - var(--size-header-H));
	max-height:calc(100dvh - var(--size-header-H));
	overflow: auto; padding-top: 10px; padding-bottom: var(--size-header-H);
	display: flex; flex-direction: column; align-items: center;}
header .inner .smenu .frame .m{}
header .inner .smenu .frame .m dl{font-size: 14px;}
header .inner .smenu .frame .m dl + dl{margin-top: 2em;}
header .inner .smenu .frame .m dt{font-weight: 700;
display: flex; justify-content: space-between; align-items: center;}
header .inner .smenu .frame .m dt.onoff{}
header .inner .smenu .frame .m dt.onoff > div{width: 1em; height: 1em; position: relative; cursor: pointer;
display: flex; justify-content: center; align-items: center;}
header .inner .smenu .frame .m dt.onoff > div::before,
header .inner .smenu .frame .m dt.onoff > div::after{
	content:''; display: block; width:2px; height:2px; background-color: #FFF; position: absolute;
}
header .inner .smenu .frame .m dt.onoff.active > div::after{display: none;}
header .inner .smenu .frame .m dt.onoff > div::before{width:100%;}
header .inner .smenu .frame .m dt.onoff > div::after{height:100%;}
header .inner .smenu .frame .m dd{font-size: 13px; overflow: hidden;
	display: flex; flex-direction: column;}
header .inner .smenu .frame .m dt.onoff + dd{height:0;}
header .inner .smenu .frame .m dt.onoff.active + dd{height: auto;}
header .inner .smenu .frame .m dd a{margin-top: 1em; gap: 4px; display: flex; align-items: flex-start;}
header .inner .smenu .frame .m dd a::before{content: '-';}
header .inner .smenu .frame .b{width:237px; max-width: 100%; margin-top: 50px;}
header .inner .smenu .dark{background-color: rgba(0,0,0,0.4); flex-grow: 1;}
@media screen and (min-width: 1000px) {
	header .inner button,
	header .inner .smenu{display: none;}
}
@media screen and (max-width: 999px) {
	header .hmenu,
	header .btn{display: none;}
}

main{
	min-height: 100vh;
	min-height: 100dvh;
	flex-direction: column;
}
main section,
body > section{width:100%;}
main section .inner{width:100%; max-width:var(--size-inner-1100);	margin: 0 auto;}

:root{
--transition-fuwa:0.5s;
}
main .fuwa,
main .fuwa_ren *[delay]{
	transition: opacity var(--transition-fuwa)
						, transform var(--transition-fuwa);
}
main .fuwa:not(.moved),
main .fuwa_ren:not(.moved) *[delay]{
	opacity:0; transform: translateY(80px);
}
main .fuwa_ren *[delay]{transition-delay: attr(delay s);}
main .fuwa_ren *[delay="0"]{transition-delay: 0s;}
main .fuwa_ren *[delay="1"]{transition-delay: var(--transition-fuwa);}
main .fuwa_ren *[delay="2"]{transition-delay: calc(var(--transition-fuwa) * 2);}
main .fuwa_ren *[delay="3"]{transition-delay: calc(var(--transition-fuwa) * 3);}
main .fuwa_ren *[delay="4"]{transition-delay: calc(var(--transition-fuwa) * 4);}
main .fuwa_ren *[delay="5"]{transition-delay: calc(var(--transition-fuwa) * 5);}

/*
main .kasane{display: flex;}
main .kasane > *{margin-top: auto; width: 100%; max-height: 100%; overflow: visible hidden;}
main .kasane > * > *{position: sticky; top:0;}

main .kasane{overflow: visible hidden;}//stickyを使う場合は親と先祖のoverflow設定を無くしておく
*/
main .kasane > *{position: sticky; top:0;}

section.cmn_recruit{position: relative; min-height: 640px;}
section.cmn_recruit .bg{position: absolute; inset:0; width:100%; max-width: 1400px; height:100%; margin: auto; overflow: hidden;
gap:0 var(--size-inner-mgn); display: flex;}
section.cmn_recruit .bg *{flex-grow: 1; width: 100%;}
section.cmn_recruit .bg > *{display: flex; flex-direction: column;}
section.cmn_recruit .bg picture img{width:100%; height:100%;}
section.cmn_recruit .bg::after{
	content: ''; display: block;
	position: absolute; inset:0; width:100%; height:100%;
	background-color: rgba(0,0,0,0.35);
}
section.cmn_recruit .inner{position: absolute; inset:0; z-index: 2;
gap:min(70px,calc(30 * var(--size-sp))) 0; display: flex; flex-direction: column; justify-content: center; align-items: center;}
@media screen and (min-width: 1000px) {
	section.cmn_recruit .bg .S{width:440px; padding: var(--size-inner-mgn) 0;}
	section.cmn_recruit .bg .S > *{height:100%;}
	section.cmn_recruit .bg .C{width:470px; gap: 30px; justify-content: space-between;}
	section.cmn_recruit .bg .C > *{height:305px;}
}
@media screen and (max-width: 999px) {
	section.cmn_recruit{min-height:calc(588 * var(--size-sp));}
	section.cmn_recruit .bg{
		padding: calc(var(--size-inner-mgn) * 4 / 5) 0;
		gap: calc(var(--size-inner-mgn) * 3 / 4) 0;
		flex-direction: column;
	}
	section.cmn_recruit .bg > *{width:100%; flex-direction: row;}
	section.cmn_recruit .bg .S{height:calc(200 * var(--size-sp));}
	section.cmn_recruit .bg .C{height:calc(126 * var(--size-sp)); gap: 0 calc(var(--size-inner-mgn) * 3 / 4);}
}

section.cmn_contact{padding: min(150px,calc(50 * var(--size-sp))) 0;}
section:not(.cmn_recruit) + .cmn_contact{padding-top: min(150px,calc(100 * var(--size-sp-pc1vw)));}
section.cmn_contact .inner,
.cmn_tel{display: flex; flex-direction: column; align-items: center;}
section.cmn_contact .cmn_subt2{margin-bottom: 1em;}
section.cmn_contact .btn_oval,
.cmn_tel{max-width: 100%;}
section.cmn_contact .btn_oval + .cmn_tel{margin-top: min(50px,calc(35 * var(--size-sp)));}
.cmn_tel{gap:1rem;}
.cmn_tel > *{margin: -0.2em 0;}
.cmn_tel > a{font-size: 38px;}
section.cmn_contact .bnr{margin-top: 70px; max-width: 100%;}
section.cmn_contact .bnr a{
	color:#FFF; font-size: 20px; font-weight: 500;
	width: 480px; max-width: 100%; aspect-ratio: 480 / 126; border-radius: var(--size-radius);
	background-image: url("../img/common/bnr-outside.png");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	opacity: 1; transition: opacity var(--transition-fast);
	gap: 0.75em; display: flex; justify-content: center; align-items: center;
}
section.cmn_contact .bnr a:hover{opacity: 0.75;}
section.cmn_contact .bnr img[src*="icon"]{width: 1em; margin: -1em 0;}
@media screen and (max-width: 999px) {
}

:root{
--pagetop-W:min(80px,calc(50 * var(--size-sp)));
}
section.pagetop{
	position: -webkit-sticky; /* Safari用 */
	position: sticky; bottom:calc(var(--size-inner-mgn) + var(--pagetop-W) / 2); z-index: 900; overflow: visible;
	transition: bottom var(--transition-fast);
}
section.pagetop:not(.active){bottom:calc(var(--pagetop-W) / -2);}
section.pagetop > div{width:100%; max-width:var(--size-inner-1400);	margin: 0 auto; position: relative;
display: flex; justify-content: flex-end;}
section.pagetop a{width:var(--pagetop-W); height:var(--pagetop-W); position: absolute; bottom: calc(var(--pagetop-W) / -2);
background-color: #000; border-radius: 100%; overflow: hidden;
transition: background-color var(--transition-fast);
display: flex; justify-content: center; align-items: center;
}
section.pagetop a:hover{background-color: var(--color-B);}
section.pagetop a::before{content:''; display: block; background: var(--grad-BX);
 	position: absolute; top:0; left:0; width:100%; height:100%;
	/* transition: left var(--transition-fast); */
}
/*
section.pagetop a:hover::before{left:100%;}
*/
section.pagetop a img{position: relative; z-index: 2; width:calc(100% * 3 / 8);}

footer{
	background-color: #000; color:#FFF;
	padding: min(80px,calc(50 * var(--size-sp))) 0 min(70px,calc(35 * var(--size-sp)));
}
footer .inner{
	width:100%; max-width:var(--size-inner-1100);	margin: 0 auto;
	flex-wrap: wrap; align-items: flex-start;
}
footer .inner .info{gap:50px 0; display: flex; flex-direction: column; align-items: flex-start;}
footer .inner .fmenu{display: flex; flex-direction: column; justify-content: flex-start;}
footer .inner .fmenu dl{font-size: 1rem;}
footer .inner .fmenu dl + dl{margin-top: 2em;}
footer .inner .fmenu dt{font-weight: 700;}
footer .inner .fmenu dd{font-size: 14px; margin-top: 1em; color: var(--color-gray-C);
	gap: 4px; display: flex; align-items: flex-start;}
footer .inner .fmenu dd::before{content: '-';}
footer .inner .fmenu dd a:hover{color:#FFF;}
footer .inner hr{width:100%; border-top: solid 1px #FFF; margin: min(5em,calc(30 * var(--size-sp))) 0 1em;}
footer .inner .fmenu a:hover{text-decoration: underline;}
footer .inner .fmenu > a{font-size: 14px;}
footer .inner .copy{font-size: 10px; margin-left: auto;}
@media screen and (min-width: 1000px) {
	footer .inner .info{margin-right: auto;}
	footer .inner .fmenu + .fmenu{margin-left: min(80px,calc((1vw - 9px) * 40));}
}
@media screen and (max-width: 999px) {
	footer .inner{flex-direction: column;}
	footer .inner .fmenu{order:1;}
	footer .inner .info{order:2; width: 100%; margin-top: 50px;
	flex-direction: row; justify-content: space-between; align-items: flex-end;}
	footer .inner hr,
	footer .inner hr + .fmenu{order:3;}
	footer .inner .copy{order:4; margin-left: 0; margin-top: 1em;}
	footer .inner .fmenu + .fmenu{margin-top: 2em;}
}


/* ----- */

.pc_vanish{}
.sp_vanish{}
.im_vanish{display:none!important;}
.pc_br_del{}
.sp_br_del{}
.vanish_branch{}
.vanish_branch_onoff{}
@media screen and (min-width: 1000px) {
	*[vanish="pc"],
	.pc_vanish,
	.pc_br_del br,
	.pc_div_del div,
	.vanish_branch img[src*="-sp."],
	.vanish_branch_onoff img[src*="-sp."]{display:none!important;}
}
@media screen and (max-width: 999px) {
	*[vanish="sp"],
	.sp_vanish,
	.sp_br_del br,
	.sp_div_del div,
	.vanish_branch img[src*="-pc."],
	.vanish_branch_onoff img:not([src*="-sp."]){display:none!important;}
}

.W100per{width:100%;}
.Wbase{
	width:100%;
	max-width:1000px;
	margin: 0 auto;
}
.Wbase.W1100{max-width:1100px;}
.Wbase.W1400{max-width:1400px;}
.Wbase[w]{max-width:attr(w px);}
@media screen and (max-width: 999px) {
}

/* CSSだけで多角形を作る */
.clippath{width:100%; height:90px;
background-color: #F00;
clip-path: polygon(0 100%, 100% 0, 90% 100%, 0 100%);
}

/* 印刷用CSS */
/*
@media print{
  印刷用CSSの定義を指定する
}
※印刷時は
「@media screen and (min-width: 1000px)」
「@media screen and (max-width: 999px)」内のスタイルは効かなくなる
*/
@media print{
	.pc_vanish{display:none!important;}
	header{position:relative;}
	main{padding-top: 0;}
}