/* name: common.css
/* role: フロントと管理画面の共通CSS
/* ========================================================================== */
/*	0. Root Setup
/* ========================================================================== */
:root{
	--bodyBgColor: white;
	--bodyFontColor: black;
	--themeColor: var(--wp--preset--color--theme);
	--themeColorLight: var(--wp--preset--color--theme-light);
	--themeTranslucent90: rgba(0,137,206,0.9);
	--themeTranslucent70: rgba(0,137,206,0.7);
	--themeTranslucent50: rgba(0,137,206,0.5);
	--themeColor2: var(--wp--preset--color--accent);
	--themeColor2Light: var(--wp--preset--color--accent-light);
	--themeGray: #EFEFEF;
	--hoverColor: #DE5E1A;
	--footerTextColor: white;

	--gothicFont: "YakuHanJP","Noto Sans JP", sans-serif;
	--englishFont: "Oswald", sans-serif;

	--fontSize100: clamp(30px,calc( 6.55vw  + 9px),100px);     /*320-1389*/
	--fontSize80:  clamp(25px,calc( 5.14vw +  8.6px ), 80px);  /*320-1389*/
	--fontSize70:  clamp(40px,calc( 2.81vw + 31.0px ), 70px);  /*320-1389*/
	--fontSize60:  clamp(25px,calc( 3.27vw + 14.6px ), 60px);  /*320-1389*/
	--fontSize50:  var(--wp--preset--font-size--vfs-50); 	   /*320-1389*/
	--fontSize5018:clamp(18px,calc( 2.99vw  + 8.5px ), 50px);  /*320-1389*/
	--fontSize40:  var(--wp--preset--font-size--vfs-40); 	   /*320-1389*/
	--fontSize36:  var(--wp--preset--font-size--vfs-36);        /*320-1389*/
	--fontSize30:  var(--wp--preset--font-size--vfs-30);       /*320-1389*/
	--fontSize3018:clamp(18px,calc( 1.12vw  + 14.4px), 30px);  /*320-1389*/
	--fontSize26:  var(--wp--preset--font-size--vfs-26);        /*320-1389*/
	--fontSize24:  var(--wp--preset--font-size--vfs-24);       /*320-1389*/
	--fontSize20:  var(--wp--preset--font-size--vfs-20);       /*320-1389*/
	--fontSize18:  var(--wp--preset--font-size--vfs-18);       /*320-1389*/
	--fontSize16:  var(--wp--preset--font-size--vfs-16);       /*320-1389*/
	--fontSize14:  var(--wp--preset--font-size--vfs-14);       /*320-1389*/
	--fontSize12:  var(--wp--preset--font-size--vfs-12);       /*320-1389*/
	--fontSize10:  10px;

	--contentWidth: 1300px;
	--maximumWidth: 100%;
	--billboardHeight: 100vh;
	--headerHeight: 70px;

	--variableSpaceS:  clamp(20px,calc( 4.8vw + 1.184px), 50px);
	--variableSpaceM:  clamp(40px,calc( 9.6vw + 2.368px),100px);
	--variableSpaceL:  clamp(60px,calc(14.4vw + 3.552px),150px);
	--variableSpaceXL: clamp(80px,calc(19.2vw + 4.736px),200px);

	--easeOutQuart: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
	--easeOutExpo: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

/*	Common Set Up
/* -------------------------------------------------------------------------- */
html{ font-size: 62.5%; } /* 1rem = 10px */

html , body{ margin: 0; padding: 0; border: none; }

body{
    font-size: var(--fontSize20);
    font-weight: 400;
    font-family: var(--gothicFont);
    color: var(--bodyFontColor);
    background: var(--bodyBgColor);
	line-height: 1.25;
	position: relative;
}

.editor-styles-wrapper{
	padding-left: 20px;
	padding-right: 20px;
}

body *{ box-sizing: border-box; }

li , ol , ul , form , label ,button ,
 caption , dl ,dt, dd{
	font-size: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit;
	border: none;
}


p{ line-height: 1.7; margin: 0 0 1em 0; letter-spacing: 0.05em;}

h1 , h2 , h3 , h4 , h5 , h6 {
	margin: 0;
	padding: 0;
	border: none;
	font-weight: var(--midiumFontWeight);
}

h1{ font-size: var(--fontSize40);}

button:focus{ outline: none; }

a{
	text-decoration: none;
	color: inherit;
	transition: color 0.3s ease;
}

a[tabindex="-1"]{
	pointer-events: none;
}
/* List Style setting
----------------------------------------------------------------------------- */
.reset-list-style{
	list-style-type: none;
}


ul[class^="mark-"] > li,
ul[class*="is-style-marked-list-"] > li{
	list-style-type: none;
	padding-left: 1.1em;
	position: relative;
	margin-bottom: 0.5em;
}

ul[class^="mark-"] > li::before,
ul[class*="is-style-marked-list-"] > li::before{
	width: 1em;
    display: block;
    position: absolute;
    left: 0;
}
/*1.arrow*/
ul.mark-arrow > li::before,
ul.is-style-marked-list-arrow > li::before{
	content: '〉';
}
/*2.asterisk*/
ul.mark-asterisk > li::before,
ul.is-style-marked-list-asterisk > li::before{
	content: '※';
}
/*3.circle*/
ul.mark-circle > li::before,
ul.is-style-marked-list-circle > li::before{
	content: '〇';
}
/*4.double-circle*/
ul.mark-double-circle > li::before,
ul.is-style-marked-list-double-circle > li::before{
	content: '◎';
}
/*5.diamond*/
ul.mark-double-diamond > li::before,
ul.is-style-marked-list-diamond > li::before{
	content: '◆';
}
/*6.disk*/
ul.mark-disk > li::before,
ul.is-style-marked-list-disk > li::before{
	content: '●';
}
/*7.dot*/
ul.mark-dot > li::before,
ul.is-style-marked-list-dot > li::before{
	content: '・';
}
/*8.square*/
ul.mark-square > li::before,
ul.is-style-marked-list-square > li::before{
	content: '■';
}
/*9.star*/
ul.mark-star > li::before,
ul.is-style-marked-list-star > li::before{
	content: '★';
}

ol.circle-num,ol.yamakakko,ol.pipe{
	list-style: none;
	counter-reset: num-counter;
	padding: 0;
}

ol.circle-num > li{
	padding-left: 1.5em;
	position: relative;
	line-height: 1;
	margin-bottom: 0.7em;
}

ol.circle-num > li::before{
	content: counter(num-counter);
	counter-increment: num-counter;
	width: 1.2em;
	height: 1.2em;
	font-size: var(--fontSizeS);
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid black;
	border-radius: 50%;
	position: absolute;
	left: 0;
}

ol.yamakakko > li{
	padding-left: 2.1em;
	position: relative;
	line-height: 1.2;
	margin-bottom: 0.7em;
}

ol.yamakakko > li::before{
	content: '〈'counter(num-counter)'〉';
	counter-increment: num-counter;
	width: 2.1em;
	height: 1.2em;
	font-size: inherit;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	left: 0;
}

ol.pipe > li{
	padding-left: 2em;
	position: relative;
	line-height: 1.2;
	margin-bottom: 0.7em;
}

ol.pipe > li::before{
	content: counter(num-counter);
	counter-increment: num-counter;
	width: 1.5em;
	height: 1.2em;
	font-size: inherit;
	position: absolute;
	left: 0;
}
ol.pipe > li::after{
	position: absolute;
	content: "|";
	top: 0;
	left: 1em;
	width: 1em;
	height: 1.2em;
	text-align: center;
	font-size: inherit;
	color: #555;
}
/* Link hover seetting
----------------------------------------------------------------------------- */
a{ text-decoration: none; color: inherit; }

a:hover , a:focus{ text-decoration: none; }

button:focus{ outline: none; }

[class^="hoverButton"]{ transition:all 0.3s ease;}

.hoverButton-1{ background-color: var(--buttonCyan1); color:var(--themeColor);}

.hoverButton-2{ background-color: var(--buttonYellow); color: var(--themeColor);}

.hoverButton-3{ background-color: var(--buttonCyan2); color: white;}

@media(hover: hover){
	.hoverButton-1:hover{ background-color: white; }

	.hoverButton-2:hover{ background-color: var(--buttonYellowHover);}

	.hoverButton-3:hover{ background-color: var(--buttonYellow); color: var(--themeColor);}
}

.link-hover{ transition: color 0.3s ease;}

.link-hover:hover{ color: var(--hoverColor);}

[class^="hoverType"]{ transition:all 0.3s ease;}

.hoverType-1{ }

@media(hover: hover){
	.hoverType-1:hover{ }

	.hoverType-2:hover{ background-color: var(--buttonYellowHover);}

	.hoverType-3:hover{ background-color: var(--buttonYellow);}

}
.gradient-button{
	background: linear-gradient(to bottom,#F7DBB0,#FF8900)}


/* Functional Setting
----------------------------------------------------------------------------- */
.nowrap{ display: inline-block; white-space: nowrap;}

.mb1{ margin-bottom: 1em; }

.mbS{ margin-bottom: var(--variableSpaceS)}

.mbM{ margin-bottom: var(--variableSpaceM);}

.mbL{ margin-bottom: var(--variableSpaceL);}

.mbXL{ margin-bottom: var(--variableSpaceXL);}

.mtS{ margin-top : var(--variableSpaceS);}

.ptS{ padding-top: var(--variableSpaceS)}

.ptM{ padding-top: var(--variableSpaceM)}

.ptL{ padding-top: var(--variableSpaceL)}

.ptXL{ padding-top: var(--variableSpaceXL);}

.pbS{ padding-bottom: var(--variableSpaceS)}

.pbM{ padding-bottom: var(--variableSpaceM)}

.pbL{ padding-bottom: var(--variableSpaceL)}

.pbXL{ padding-bottom: var(--variableSpaceXL)}

.pvS{ padding-block: var(--variableSpaceS); }

.pvM{ padding-block: var(--variableSpaceM); }

.pvL{ padding-block: var(--variableSpaceL); }

.wbka{ word-break: keep-all;}

.hidden{ display: none;}

.vfs100{ font-size: var(--fontSize100);}

.vfs80{ font-size: var(--fontSize80);}

.vfs50{ font-size: var(--fontSize50);}

.vfs5018{ font-size: var(--fontSize5018)}

.vfs40{ font-size: var(--fontSize40)}

.vfs36{ font-size: var(--fontSize36)}

.vfs30{ font-size: var(--fontSize30);}

.vfs3018{ font-size: var(--fontSize3018);}

.vfs26{ font-size: var(--fontSize26)}

.vfs24{ font-size: var(--fontSize24);}

.vfs20{ font-size: var(--fontSize20)}

.vfs18{ font-size: var(--fontSize18)}

.vfs16{ font-size: var(--fontSize16);}

.vfs14{ font-size: var(--fontSize14)}

.vfs12{ font-size: var(--fontSize12);}

.fs10{ font-size: 10px;}

.fwL{ font-weight: 300;}

.fwR{ font-weight: 400; }

.fwM{ font-weight: 500;}

.fwEX{ font-weight: 900;}

.fwB{ font-weight: 700;}

.lineHeight-1{ line-height: 1!important;}

.lineHeight-15{ line-height: 1.5!important;}

.lineHeight-2{ line-height: 2!important;}

.narrow-letter-spacing{ letter-spacing: -0.05em;}

.text-center{ text-align: center;}

.text-left{ text-align: left;}
/* Flex Setting
---------------------------------------------------------------------------*/
.flex-aligncenter{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	align-content: center;
}

.flex-aligncenter > *{
	flex-basis: 100%;
}

.flex-v-aligncenter{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
}

.flex-v-aligncenter > *{
	flex-basis: 100%;
}

.flex-h-aligncenter{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

body .is-layout-flex {
    gap: 3%;
}
/*	CONTENT WIDTH SETTING
/* -------------------------------------------------------------------------- */
.max400{ max-width: 500px!important; margin-inline: auto; }

.max500{ max-width: 500px!important; margin-inline: auto; }

.max600{ max-width: 600px!important; margin-inline: auto; }

.max700{ max-width: 700px!important; margin-inline: auto; }

.max750{ max-width: 750px!important; margin-inline: auto; }

.max800{ max-width: 800px!important; margin-inline: auto; }

.max850{ max-width: 850px!important; margin-inline: auto; }

.max900{ max-width: 900px!important; margin-inline: auto; }

.max1000{ max-width: 1000px!important; margin-inline: auto; }

.max1100{ max-width: 1100px!important; margin-inline: auto; }

.max1200{ max-width: 1200px!important; margin-inline: auto; }

.max1400{ max-width: 1400px!important; margin-inline: auto; }

.max1500{ max-width: 1500px!important; margin-inline: auto; }

.max1600{ max-width: 1600px!important; margin-inline: auto; }

.max1718{ max-width: 1718px!important; margin-inline: auto; }

.max1920{ max-width: 1920px!important; margin-inline: auto; }

.large{ font-size: 1.2em; }

.small{ font-size: 0.8em; }

b , strong{ font-weight: var(--boldFontWeight); }

/* List -----------------------------------------*/

/* Media ------------------------------------- */

figure{	display: block; margin: 0; }

iframe{ display: block; max-width: 100%; }

video{ display: block; }

svg , img , embed , object{ display: block; max-width: 100%; height: auto; margin: auto;}

figcaption a , .wp-caption-text a{ color: inherit; }

/* wp block */
.is-root-container{ margin-top: 30px;}

.wp-block-group.has-background{ padding: 1em 0;}

.has-rounded-font-family{ transform: rotate(0.1deg);}

.wp-block-gallery{
	gap: clamp(8px,1.5vw,20px)!important;
}
@media(max-width: 700px){
	[class*="has-vfs-"].minimum22{
		font-size: 22px!important;
	}
}

/*=========================================================================
  ORIGINAL BLOCK PATTERN SETTING
===========================================================================*/

/*bottom set*/
.to-top-button{
    display: block!important;
    text-align: center;
}


/*=========================================================================
  CONTENTS STYLE
===========================================================================*/


/*TABLE*/
.header-colored td{
	background-color: white;
}

.schedule-table{ margin-bottom: 0;}

.schedule-table table{ border: none;}

.schedule-table tbody tr td{
	border-width: 0 0 1px 0!important;
	border-color: #CEC2BA!important;
	border-style: solid!important;
}

.schedule-table tbody tr:last-child td{
	 border-width: 0 0 0 0!important;}

.schedule-table td{ padding: 0.2em;}

/* History Table
----------------------------------------------------------------------------- */
.history-table td{ padding: 0.2em 0; vertical-align: top;}

.history-table tr td:first-child{ width: 4em;}

.history-paragraph p,.history-table p{ padding-bottom: 0.17em;}

/*Recruitment Table
------------------------------------------------------------------------------ */
.recruitment-table{display: flex;flex-wrap: wrap; gap: 3px 20px; max-width: 1000px; margin-inline: auto;}

.recruitment-table > div:first-child{flex-basis: 100%;border: none; margin: 0; color: var(--themeColor); display: flex;}

.recruitment-table > div:first-child::before{ content: "●";}

.recruitment-table > div:first-child p{ margin-left: 0.2em!important;}

.recruitment-table > div:last-child{flex-basis: 100%; border: none; margin: 0; padding-left: 1em;}

.recruitment-table > div:last-child > *{ margin-left: 0!important;}

.recruitment-table > div:last-child ul li{ margin: 0 0 0.5em 0!important;}

@media(min-width: 600px){
	.recruitment-table > div:first-child{flex-basis: 10em;flex-shrink: 0; border: none; margin: 0; color: black;}

	.recruitment-table > div:first-child::before{ content: none;}

	.recruitment-table > div:last-child{
		flex-grow: 1;
		flex-shrink: 1;
		border: none;
		max-width: calc(100% - 10em - 20px)!important;
		margin: 0;
		padding-left: 0;
	}
}

.block-editor-block-patterns-list__list-item-synced{ display: none!important;}