@charset "utf-8";
/*
Theme Name: tpl_miyanichi
Description: Original template for MIYANICHI SHOJI
Author: design maf
Author URI: https://designmaf.com/
Version: 1.1
*/

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
img,abbr,acronym,fieldset{border:0;}
*,*:before,*:after{box-sizing:border-box}

html{
	scroll-behavior: smooth;
}

body{
	font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
	font-size: 16px;
	font-weight: 500;
	overflow-x: hidden;
	line-height: 2;
	letter-spacing: .01em;
	color: #222;
	word-break: break-all;
}

img{
	max-width: 100%;
	height: auto;
}

iframe{
	max-width: 100%;
}

input:not([type=checkbox],[type=radio]){
	-webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 0;
}

input[type=text],
input[type=email],
textarea{
	font-size: 1rem;
}


/* LINK
------------------------------------------------------------*/
a{
	color: #222;
	text-decoration: none;
	transition: .3s;
}

a:hover{
	opacity: .8;
}

a:active,
a:focus,
input:active,
input:focus{
	outline: none;
}

main a:not(.btn){
	color: #216EB7;
	border-bottom: 1px solid #216EB7;
}

main a:not(.btn):hover{
	border-color: transparent;
}

#bread a,
#ez-toc-container a,
.addtoany_shortcode a,
.addtoany_content a{
	border: 0 !important;
}


/* HEADER
------------------------------------------------------------*/
#header{
	position: relative;
	width: 100%;
	z-index: 100;
}

#panel a{
	position: relative;
  display: block;
  padding: 0 0 .2rem;
  line-height: 1.2;
  overflow: hidden;
  border-bottom: 1px solid transparent;
}

#panel li.current-menu-item a,
#panel a:hover{
	color: #216EB7;
  border-color: #216EB7;
}

#panel li.active a{
	position: relative;
  z-index: 1;
}



/* FOOTER
------------------------------------------------------------*/
#footer{
	padding: 2rem 0 1rem;
	color: #fff;
	background: #15467D;
}

#footer a{
	color: #fff;
}

#footer .active a{
	text-decoration: underline;
	text-decoration-color: #958383;
	text-underline-offset: .5em;
}

.footerLower{
	padding-top: 3rem;
	font-size: 1rem;
}

.footerLower div{
	font-family: "Outfit", sans-serif;
	font-weight: 300;
}

#footer .sns{
	display: flex;
}

#footer .sns li{
	margin: 1rem 1rem 0 0;
}

#top{
	position: fixed;
	bottom: 40px;
	right: 40px;
	text-align: right;
	z-index: 110;
}

#top a{
	position: relative;
	display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 1px solid #ccc;
	background: rgba(255, 255, 255, .5);
}

#top a:before{
	position: absolute;
	top: 50%;
	left: 50%;
	content: '';
	width: 10px;
	height: 10px;
	margin: -4px 0 0 -4px;
	border-top: solid 2px #216EB7;
	border-right: solid 2px #216EB7;
	transform: rotate(-45deg);
	transition: .3s ease-in-out;
}

#top a:hover{
	box-shadow: none;
}

#top a:hover:before{
	margin: -10px 0 0 -4px;
}



/* CONSULTATION BANNER & RECRUIT BANNER
------------------------------------------------------------*/
.consultBanner{
	position: relative;
	padding: 3.125rem 0;
	background: #E8F2FC;
}

.consultBanner h2{
	margin-bottom: 1rem;
	font-size: 3rem;
}

.consultBanner h2 em{
	display: inline-block;
	width: 4.375rem;
	height: 4.375rem;
	line-height: 4rem;
	border-radius: 50%;
	text-align: center;
	text-decoration: none;
	color: #fff;
	background: #216EB7;
}
.consultBanner h2 em:last-of-type{
	margin: 0 .3rem 0 -.5rem;
}

.consultBanner h3{
	margin-bottom: 1rem;
	line-height: 1.2;
	font-size: 2.25rem;
}

.consultBanner .tel{
	font-size: 3rem;
}

.consultBanner .upper{
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

.consultBanner .check{
	font-weight: 700;
	font-size: 1.5rem;
}

.consultBanner .lower{
	padding: 3.125rem 1rem;
	display: flex;
	justify-content: center;
	text-align: center;
	border: 4px solid #216EB7;
	border-radius: 20px;
	background: #fff;
}

.consultBanner .lower > div{
	display: flex;
	flex-direction: column;
}

.consultBanner .lower .btn{
	margin-top: auto !important;
}

.consultBanner .lower small{
	font-size: 1.25rem;
}

.consultBanner .icons{
	margin: 1rem auto;
	justify-content: center;
}

.consultBanner .icons li:not(:last-child){
	margin-right: 2rem;
}

.consultBanner .icons li:not(:last-child):after{
	position: absolute;
	top: calc(50% - 3px);
	right: -1.5rem;
	content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-top: solid 2px #FFC703;
  border-right: solid 2px #FFC703;
  transform: rotate(45deg);
}


/* company & recruit page */
main .consultBanner{
	background: transparent
}

main .consultBanner:after{
	content: none;
}

.consultBanner .recruitBanner header{
	margin: auto;
	padding: 20px 162px 0;
	min-height: 162px;
  width: fit-content;
	background: url(images/illustRecruit.webp) no-repeat 100% 100% / 160px 162px;
}

main .recruitBanner .lower{
	margin: auto;
	max-width: 800px;
	background: #f9fafa;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.consultBanner .recruitBanner h2{
	line-height: 1.6;
	margin-bottom: 0 !important;
}


/* recruit page */
#entryform .recruitBanner .lower{
	padding: 1rem;
	justify-content: center;
}

#entryform .consultBanner{
	padding: 0;
}

#entryform .consultBanner a{
	border: 0;
}

#entryform .recruitBanner h2{
	font-size: 2rem;
}



/* CONTENT
------------------------------------------------------------*/
#content{
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 1.875rem;
}

#bread{
	max-width: 1380px;
	margin-bottom: 1rem;
	display: flex;
	flex-wrap: wrap;
	font-size: 1rem;
}

#bread li{
	position: relative;
	padding: 0 1.5rem 0 0;
}

#bread li:after{
  content: "";
  position: absolute;
  top: 50%;
  width: 6px;
  height: 6px;
  margin: -3px 0 0 .5rem;
  border-top: solid 1px #222;
  border-right: solid 1px #222;
  transform: rotate(45deg);
}

#bread li:last-child:after{
	content: none;
}



/* COMMON
------------------------------------------------------------*/
.inner{
	width: 100%;
	max-width: 1440px;
	margin: auto;
	padding: 0 1.875rem;
}

.content{
	font-size: 1.125rem;
}

.content > section{
	position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: 7.5rem 0;
  background: #F9FAFA;
  border-top: 1px solid rgba(0, 0, 0, .1);
}
body:not(#toppage) .content > section{
	background: #fff;
}
body:not(#toppage) .content > section:not(#corporate):first-of-type{
	padding-top: 2rem;
	border: 0;
}
.content > section#since{
	padding-bottom: 0;
}
.content > section:nth-of-type(even){
	background: #fff;
}
body:not(#toppage) .content > section:nth-of-type(even),
body:not(#toppage) .content > section#corporate{
	background: #F9FAFA;
}
body:not(#toppage) .content > section#personal{
	background: #F8FCFF;
}

.content > section:after,
.consultBanner:after{
	content: '';
	position: absolute;
	top: -3px;
	left: calc(50% - 30px);
	width: 60px;
	height: 6px;
	border-radius: 3px;
	background: #7CA6D1;
}
body:not(#toppage) .content > section:first-of-type:after{
	content: none;
}

.content > section > div{
	margin: auto;
	padding: 0 1.875rem;
	max-width: 1440px;
	overflow: hidden;
}

main#post,
main#index{
	padding-bottom: 5rem;
}

main p{
	margin-bottom: 1rem;
	overflow-wrap: break-word;
	font-weight: 500;
}

main p:last-of-type{
	margin-bottom: 0;
}

main p:empty,
main ul:empty{
	display: none;
}

h1.wp-block-heading{
	margin: 0 0 1rem;
	position: relative;
	font-size: 3rem;
	line-height: 1.4;
}

h2.wp-block-heading{
	margin: 0 0 2rem;
	padding-left: .5em;
	font-size: 2rem;
	line-height: 1.2;
	border-left: 4px solid #216EB7;
}
#page h2.wp-block-heading{
	border: 0;
}

section h2:first-child{
	margin-top: 0;
}

h2.wp-block-heading em{
	display: block;
	font-size: .6em;
	font-weight: 500;
	text-decoration: underline;
	text-underline-offset: .2em;
	text-decoration-thickness: 2px;
	color: #216EB7;
}

h2.wp-block-heading.heading em{
	font-size: .5em;
	font-family: "Outfit", sans-serif;
	text-transform: uppercase;
}

#page section > div > h2.wp-block-heading.heading{
	margin-bottom: 4rem;
}

h3.wp-block-heading{
	position: relative;
	margin-bottom: 1rem;
	padding-bottom: .2em;
	font-size: 1.5rem;
	line-height: 1.4;
}

h3.wp-block-heading.heading{
	font-size: 2.25rem;
	color: #216EB7;
	text-align: center;
}

h3.wp-block-heading.h2{
	font-size: 2.8rem;
}

h3.wp-block-heading.heading2,
h4.wp-block-heading.heading2{
	font-size: 1.875rem;
}

h4.wp-block-heading{
	margin-bottom: 1rem;
	font-size: 1.25rem;
}

h5{
	font-size: 1.375rem;
	font-weight: 400;
}

#post h2,
#post h3,
#post h4{
	margin-top: 3em;
}

#post .wp-block-columns,
#post .wp-block-image{
	margin: 1rem 0;
}

ul.wp-block-list{
  margin: 0 0 1em;
  list-style: disc;
}

.wp-block-list li{
	margin: 0 0 .5em 1em;
	line-height: 1.6;
}

ol li{
	padding-left: .2em;
}

.check li{
	padding-left: 2rem;
	background: url(images/iconCheck.svg) no-repeat 0 50%;
}

small{
	font-size: .75em;
}

.wp-element-caption{
	text-align: center;
}

#post .wp-element-caption{
	font-size: .875em;
}

blockquote{
	position: relative;
	margin: 1em 2em;
	padding-bottom: 2em;
}

blockquote:before,
blockquote:after{
  position: absolute;
  content: '';
  width: 20px;
  height: 15px;
  background: url(images/quote.svg) no-repeat 0 0 / cover;
}
blockquote:after{
	right: 0;
	bottom: 0;
}

blockquote p{
	margin-bottom: 0;
  padding-left:30px;
  color: #4B4B4B;
}
blockquote cite{
  font-size: .8em;
  color: #4B4B4B;
  text-align:right;
}

pre{
	line-height: 1.2;
}

.content strong{
	background: linear-gradient(transparent 70%, #EBB600 70%);
}

.content em{
	padding: 0 1px;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: .2em;
}

.imgRound img{
	border-radius: 20px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .15);
}

#toppage .imgRound{
	max-width: 580px;
}

.mt1{margin-top:1rem !important}
.mt2{margin-top:2rem !important}
.mt3{margin-top:3rem !important}
.mt5{margin-top:5rem !important}
.mb0{margin-bottom:0 !important}
.mb1{margin-bottom:1rem !important}
.mb2{margin-bottom:2rem !important}
.mb3{margin-bottom:3rem !important}
.pt0{padding-top: 0 !important}
.pt3{padding-top:3rem !important}
.pt5{padding-top:5rem !important}
.pb3{padding-bottom:3rem !important}
.pb0{padding-bottom: 0 !important}

.fontL{font-size: 1.5em !important}

.mainColor{color:#216EB7 !important}
.subColor1{color:#308AE5 !important}

.boxBorder,
.process > div{
	padding: .5rem 1rem;
  border: 4px solid #308AE5;
  border-radius: 20px;
}

.fit{
	margin: auto;
	width: fit-content;
}

table{
	width: 100%;
}

th,
td{
	padding: .5em .2em .5em .5em;
	line-height: 1.4;
	background: #fff;
	border: 1px solid #98999D;
}

th{
	background: #eee;
}

th.empty{
	border: 0;
	background: transparent;
}

main ol{
  margin: 0 20px 20px;
}

.tbl{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0;
  width: fit-content;
  margin: auto;
  line-height: 1.6;
  border-bottom: 1px solid #98999D;
}

.tbl dt{
	padding: 1rem 1rem 1rem 0;
  grid-column: 1;
  font-weight: 700;
  border-top: 1px solid #98999D;
}

.tbl dd{
	padding: 1rem 0;
  grid-column: 2;
  border-top: 1px solid #98999D;
}

.flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.col2 > div{
	line-height: 1.4;
}

.icons li{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 96px;
	border-radius: 50%;
	border: 4px solid #FFC703;
	background: #fff;
}

.tel{
	padding-left: 46px;
	line-height: 1;
	background: url(images/iconTel.svg) no-repeat 0 calc(50% + 5px) / 36px 36px;
}

.wp-block-embed > div{
  width: 100%;
  aspect-ratio: 16 / 9;
}
.wp-block-embed iframe{
  width: 100%;
  height: 100%;
}


.dlTbl{
	display: flex;
	flex-wrap: wrap;
}

.dlTbl dt{
	padding: 20px 0;
	width: 6em;
	border-top: 1px solid #98999D;
}

.dlTbl dd{
	padding: 20px 0;
	width: calc(100% - 6em);
	border-top: 1px solid #98999D;
}

.dlTbl dd a{
	position: relative;
	display: block;
	color: #222;
	border: 0 !important;
}

.bubbleWrap{
	text-align: center;
}

.bubbleWrap p{
	position: relative;
	display: inline-block;
	padding: 0 1rem;
	font-size: 1.5rem;
	border-radius: 6px;
	background: #EBB600;
}

.bubbleWrap p:after{
	content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 8px solid #EBB600
}

.bubbleBig{
	padding-bottom: 3rem;
}

.bubbleBig p{
	font-size: 2rem;
}

.bubbleWrap h3{
	margin: 1rem auto 3rem;
	line-height: 1.4;
	font-size: 3rem;
	border-bottom: 0;
}

.bubbleWrap h3 span em{
	display: inline-block;
	width: 4.375rem;
	height: 4.375rem;
	line-height: 4.375rem;
	border-radius: 50%;
	font-size: 3rem;
	text-align: center;
	color: #fff;
	background: #216EB7;
	text-decoration: none;
}

.accident .bubbleWrap h3 span em{
	background: #E10000;
}

.bubbleWrap h3 span em:last-of-type{
	margin-left: -.5rem;
}


/* BUTTON
------------------------------------------------------------*/
.content .wp-block-button__link,
.btn,
.btnTel,
.anchorLink a,
input[type="submit"],
input[type="button"]{
	display: flex;
	align-items: center;
	position: relative;
	min-width: 280px;
	padding: 0 2em 0 1em;
	height: 3.75rem;
	border-radius: 100vh;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	background: #216EB7;
	border: 2px solid #216EB7;
	transition: .3s ease-in-out;
}

input[type="button"]:hover{
	cursor: pointer;
}

input[type="button"].wpcf7-previous{
	background: #666;
	border-color: #666;
	justify-content: center;
}

input[type="button"].wpcf7-previous:hover{
	background: #888;
	border-color: #888;
}

a.btnConsult{
	color: #222;
	background: #FFC703;
	border-color: #FFC703;
}

a.btnPersonal,
a.btnGraduate{
	background: #308AE5;
}

a[class*='btn btn']{
	padding-left: 54px;
}

.content .wp-block-button__link:after,
.btn:not(.btnTel):after,
.anchorLink a:after,
#blogNew dd a:after,
.dlTbl dd a:after,
#sideCat a:after,
.postnav div a:after,
.pagination .prev a:after,
.pagination .next a:after,
main a.title:after{
	position: absolute;
	top: calc(50% - 3px);
	right: 1em;
	content: '';
  width: 10px;
  height: 10px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  transform: rotate(45deg);
  transition: .3s ease-in-out;
}
.dlTbl dd a:after,
#sideCat a:after,
.postnav div a:after,
.pagination .prev a:after,
.pagination .next a:after,
main a.title:after{
	top: auto;
	margin-top: .8em;
	border-color:#216EB7;
}

a.btn.btnConsult:after{
	border-color: #222;
}

main a.title:after{
	margin: .5em 0 0 .5em;
	right: auto;
}

.pagination .next a:after{
	right: calc(50% - 5px);
}

.pagination .prev a:after{
	right: calc(50% - 5px);
	transform: rotate(-135deg);
}

.anchorLink a:after,
.anchorLinkCompany a:after,
#service a.btnFlow:after,
#consultation .btnConsult:after{
	transform: rotate(135deg) !important;
}

input[type="submit"]:hover,
input[type="button"]:hover,
.btn:not(.btnTel):hover,
.btnConsult:hover,
#contents a:hover .btn{
	text-decoration: none;
	background: #1C7DDF;
	opacity: 1;
}

a.btn.btnConsult:hover{
	background: #FFD754;
}


.btnTel{
	padding: 0 0 0 4rem;
	border-color: #216EB7;
	color: #222;
	background: #fff;
}

.btnTel div{
	position: relative;
	text-align: right;
}

.btnTel div:before{
	content: '';
	position: absolute;
	top: 5px;
	left: -40px;
	width: 36px;
	height: 36px;
	background: url(images/iconTel.svg) no-repeat 50% 0 / 36px;
}

.btnTel i{
	font-style: normal;
	font-size: .95rem;
}

.btnTel span{
	display: block;
	font-weight: 700;
	font-size: 2rem;
}

.btnTel:hover{
	background-position: 1rem 50%;
}

a[class*='btn btn']:before{
	content: '';
	position: absolute;
	left: 20px;
	width: 24px;
	height: 24px;
	background: url(images/iconMail.svg) no-repeat 50% 0 / cover;
}

a.btnConsult:before{background-image:url(images/iconConsult.svg)}
a.btnFlow:before{background-image:url(images/iconFlow.svg)}
a.btnPersonal:before{background-image:url(images/iconPersonal.svg)}
a.btnCorporate:before{background-image:url(images/iconCorporate.svg)}
a.btnAccess:before{background-image:url(images/iconAccess.svg)}
a.btnGraduate:before{background-image:url(images/iconGraduate.svg)}
a.btnCareer:before{background-image:url(images/iconCareer.svg)}

.btns > div{
	padding-top: 2rem;
	display: flex;
}

.btns p:first-of-type{
	margin-right: 1rem;
}

.btnSingle{
	margin: 2rem auto 0;
	max-width: 640px;
}


/* PAGES
------------------------------------------------------------*/
#title{
	padding: 2rem 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	line-height: 1.2;
}

#title h1{
	font-size: 3rem;
}

#title div{
	font-size: 10rem;
	font-weight: 500;
	color: #ccc;
	font-family: "Outfit", sans-serif;
	text-transform: uppercase;
}

#contact #title div,
#contact-confirm #title div,
#contact-thankyou #title div,
#consultation #title div,
#consultation-confirm #title div,
#consultation-thankyou #title div{
	font-size: 8rem;
}

#page h2{
	padding: 0;
	margin-bottom: 3rem;
	font-size: 3rem;
	line-height: 1.4;
	border: 0;
}

#page .is-layout-flex:not(.wp-block-buttons){
	justify-content: space-between;
}

#page .is-layout-flex:not(.wp-block-buttons) .txt{
	max-width: 710px;
	flex: 1;
}

#page .is-layout-flex:not(.wp-block-buttons) .img{
	max-width: 580px;
}

#page .is-layout-flex h2{
	margin-bottom: 2rem;
	font-size: 2.5rem;
}

.wp-block-buttons{
	padding-top: 3rem;
}


/* SERVICE
------------------------------------------------------------*/
.anchorLink{
	margin: 5rem 0;
}

.serviceList > div > div > div,
.partnerList > div > div > div{
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.serviceList > div > div > div > div{
	flex: 1;
}

.serviceList > div > div > div{
	display: flex;
	flex-wrap: wrap;
}

.serviceList > div > div > div > div > div{
	display: flex;
	flex-wrap: wrap;
	padding: 1rem;
	margin-bottom: 2rem;
	border: 2px solid #216EB7;
	border-radius: 0 0 10px 10px;
}

.serviceList .txt{
	flex: 1;
	padding-right: 1rem;
}

.serviceList figure{
	margin: 0;
	width: 45%;
	aspect-ratio: 1 / .66;
  overflow: hidden;
  border-radius: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .15);
}

.serviceList img{
	width: 100%;
}

.serviceList > div > div > .wp-block-group__inner-container > p{
	width: 100%;
	padding: .5em;
	margin-bottom: 0;
	font-weight: 700;
	font-size: 1.5rem;
	color: #fff;
	background: #216EB7;
	border-radius: 10px 10px 0 0;
}

.partnerList{
	padding-bottom: 3rem;
}

.partnerList > div > div{
	margin-bottom: 1.5rem;
	padding: 1rem;
	background: #fff;
	box-shadow: 0 0 10px rgba(0, 0, 0, .15);
	border-radius: 10px;
	border: 1px solid #ccc;
}

.partnerList p:first-of-type{
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
}

.partnerList figure{
	margin: 0;
}

.partnerList > div > div > div > div{
	width: calc(100% - 280px);
}

.nayamiList .bubble{
	width: calc(100% - 110px);
}

.bubble > div{
	position: relative;
	display: flex;
	align-items: center;
	min-height: 6.25rem;
	padding: .5rem .5rem .5rem 1rem;
	font-size: 1.25rem;
	border-radius: 6px;
	background: #e8f2fc;
}

.bubble > div:after{
	content: '';
  position: absolute;
  top: 50%;
  left: -30px;
  margin-top: -15px;
  border: 15px solid transparent;
  border-right: 15px solid #e8f2fc;
}

.nayamiList .answer{
	margin: 1rem 0 3rem;
	padding: 1rem 80px 0 0;
	min-height: 83px;
	text-align: right;
	border-bottom: 2px solid #216EB7;
	background: url(images/illustSolution.webp) no-repeat 100% 100% / 74px auto;
}

.imgCircle{
	margin: 2.5rem auto 2rem;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

.imgCircle img{
	z-index: 1;
}

.imgCircle:before{
	position: absolute;
	content: '';
	width: 100px;
	height: 100px;
	border: 4px solid #FFC703;
	border-radius: 100vh;
	background: #fff;
	z-index: 0;
}


/* CONSULTATION
------------------------------------------------------------*/
.telOnly{
	justify-content: center;
	align-items: center;
	gap: 1rem;
}

.telOnly h3{
	font-size: 2.25rem;
  color: #216EB7;
	line-height: 1.2;
}

.telOnly > div{
	width: 420px;
	height: 90px;
}

.telOnly .btnTel{
	transform: scale(1.5);
	transform-origin: top left;
}



/* ARCHIVE
------------------------------------------------------------*/
.list > li{
	margin-bottom: 2rem;
	padding-bottom: 1rem;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0 0 10px rgba(0, 0, 0, .15);
}

.list > li a{
	color: #222;
	border: 0;
}

.list img{
	width: 100%;
	aspect-ratio: 16 / 9;
  object-fit: cover;
}

.list .meta{
	display: flex;
	justify-content: space-between;
	padding: .5em .5rem 0 1rem;
}

.list h2,
#post .list h3{
	margin: 0;
	padding: 1rem;
	font-weight: 500;
	font-size: 1.25rem;
	line-height: 1.6;
}

.list > li h2 a,
.list > li h3 a{
	color: #216EB7;
	border-bottom: 1px solid #216EB7;
}

.list .tags{
	padding: 0 1rem 0 .8rem;
}

.list img{
	width: 100%;
	border-radius: 20px 20px 0 0;
}

.pagination{
	display: flex;
	justify-content: center;
	padding: 2em 0;
}

.pagination li{
	margin: 0 1rem;
}

.pagination span,
.pagination a{
	padding: 0 .5rem;
	position: relative;
	display: block;
	text-align: center;
	letter-spacing: normal;
	border: 0 !important;
}

.pagination a{
	color: #216EB7;
	background: #fff;
}

.pagination a:hover,
.pagination .current span{

}


.meta{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.meta .cat{
	min-width: initial;
}
.meta time{
	margin: 0 .5em;
}

.list .meta time{
	margin-left: 0;
}

time{
	font-family: "Outfit", sans-serif;
	font-weight: 400;
}

.cats{
	display: flex;
	flex-wrap: wrap;
	padding: 2rem 0;
}

.cats li a,
.cat{
	margin: 0 .5rem .5rem 0;
	padding: .5em 1em;
	display: inline-block;
	min-width: 160px;
	font-size: .875rem;
	line-height: 1.2;
	text-align: center;
	color: #216EB7 !important;
	background: rgba(255,255,255,.8);
	border: 1px solid #216EB7 !important;
	border-radius: 100vh;
}

.cat-wrap .cat{
	margin-bottom: 0;
}

#index .cats li a{
	font-size: 1rem;
}

.cats li a:hover,
.cats li.current-cat a,
.cat:hover{
	color: #fff !important;
	background: #308AE5 !important;
}

.cats li.current-cat a{
	pointer-events: none;
}

.cats li a{
	min-width: initial;
	margin: 0 .5rem 1rem 0;
}

.tags{
	display: flex;
	flex-wrap: wrap;
}

.tags a{
	margin-left: .5em;
	border: 0 !important;
	font-size: .875em;
}

#post header + .size-post-thumbnail{
  width: 100%;
  margin-bottom: 2em;
  border-radius: 20px;
}


#archive h2.wp-block-heading{
	margin-top: 0;
}



/* SINGLE
------------------------------------------------------------*/
.single-header{
	margin-bottom: 2rem;
	padding: 1rem 0;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
}

.single-header .addtoany_shortcode{
	margin-top: .5rem;
}

#ez-toc-container{
	max-width: 640px;
	margin: 2rem 0 -2rem;
	padding: 1rem;
	border: 1px solid #ccc;
	border-radius: 10px;
	background: #F9FAFA;
}

.ez-toc-title-container{
	display: flex;
	justify-content: space-between;
}

.ez-toc-counter nav ul{
	counter-reset: item;
}
.ez-toc-counter nav ul ul{
	padding-left: 1.5rem;
}

.ez-toc-counter nav > ul > li:not(:last-child){
	border-bottom: 1px dashed #ccc;
}

.ez-toc-counter nav ul li a{
	position: relative;
}

.ez-toc-counter nav ul li a:before{
	content: counters(item, '.', decimal) '. ';
  display: inline-block;
  counter-increment: item;
  flex-grow: 0;
  flex-shrink: 0;
  margin-right: .5em;
  color: #222;
}

main div#ez-toc-container ul li{
	margin-bottom: .2em;
}

main .addtoany_header{
	margin: 3rem 0 0;
}

aside h4{
	padding-bottom: .4em;
	margin-bottom: 1rem;
	font-size: 1.25rem;
	font-weight: 400;
	border-bottom: 1px solid #666;
}

#sideCat{
	margin-bottom: 2rem;
}

#sideCat a{
	position: relative;
	display: flex;
	justify-content: space-between;
	padding: .5em 0;
	border-bottom: 1px solid #eee;
}

#sideCat a:after{
	right: 0;
}

#sideCat a span{
	margin-right: 20px;
	font-family: "Outfit", sans-serif;
}

aside .tag-cloud-link{
	margin: 0 1em 1em 0;
	position: relative;
	font-size: 1rem !important;
}

aside .tag-cloud-link:before{
	content: '#';
	position: asbolute;
}

.postnav{
	margin: 5rem 1rem 0;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 60px;
}


.postnav .next{
	text-align: right;
}

main .postnav div a{
	position: relative;
	border: 0;
	color: #222;
}

.postnav .next a:after{
	top: -.2em;
	right: -1em;
}

.postnav .prev a:after{
	margin-left: 0;
	top: -.2em;
	left: -.8em;
	transform: rotate(-135deg);
}

.postnav .btn{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}

#related{
	padding-top: 5rem;
}

#post #related h2{
	margin: 0;
	padding: 0;
	border: 0;
	margin-bottom: 1em;
}



/* toppage main visual
------------------------------------------------------------*/
#mainImg{
	width: 100%;
	max-width: 1440px;
	height: 600px;
	display: flex;
	align-items: center;
	margin: auto;
	background: url(images/mainImgTest.webp) no-repeat 100% 50%;
}

#mainImg h1{
	margin-top: 1rem;
	line-height: 1.6;
	font-size: 3.125rem;
}

#mainImg h1 i{
	display: inline-block;
	padding: .2em .5em;
	margin-bottom: 1em;
	font-size: 1.625rem;
	font-weight: 500;
	font-style: normal;
	color: #fff;
	background: #308AE5;
	border-radius: 6px;
}

#mainImg h1 em{
	font-size: 3.75rem;
	color: #216EB7;
	text-decoration: none;
}

#mainImg h1 em:last-of-type{
	color: #222;
	letter-spacing: -.03em;
}

#mainImg h1 span em{
	display: inline-block;
	width: 5.625rem;
	height: 5.625rem;
	line-height: 5.625rem;
	border-radius: 50%;
	text-align: center;
	color: #fff;
	background: #216EB7;
}

#mainImg h1 span em:last-of-type{
	color: #fff;
	margin-left: -.8rem;
}


/* reason
------------------------------------------------------------*/
.reason h3{
	margin: 1.25rem 0;
	font-size: 1.5rem;
	border: 0;
	color: #216EB7;
}

.reason h3 span{
	margin-right: 5px;
	padding: 0 5px;
	display: inline-block;
	color: #222;
	background: #EBB600;
	font-size: .875rem;
	font-weight: 400;
	font-family: "Outfit", sans-serif;
	border-radius: 6px;
}

.reason h3 span i{
	font-style: normal;
	font-size: 1.875rem;
}

.reason img{
	width: 360px;
}

.reason p{
	font-size: 1.125rem;
}


/* toppage insurance companies
------------------------------------------------------------*/
.companies-wrap h3{
	margin-bottom: 0;
	padding-bottom: 0;
	line-height: 1.2;
	border-bottom: 0;
	text-align: center;
}

.companies-wrap{
	padding: 2rem 1rem;
	border: 1px solid #E8F2FC;
	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
	border-radius: 20px;
}

.companies-wrap:first-of-type{
	margin-bottom: 2rem;
}

.companies-wrap figure{
	margin-bottom: 0 !important;
}

.companies .wp-block-columns{
	text-align: center;
}


/* accident flow
------------------------------------------------------------*/
.accident .flow{
	font-size: 1.5rem;
	line-height: 1.4;
}

.accident .flow > div{
	display: flex;
	min-height: 5rem;
	margin-bottom: 1.25rem;
}

.accident .flow > div div{
	justify-content: center;
	font-size: 2.5rem;
	border-radius: 0 20px 20px 0;
}

.accident .flow > div div span{
	padding: 8px 80px;
	background-image: url(images/iconAttention.svg), url(images/iconAttention.svg);
	background-repeat: no-repeat, no-repeat;
	background-position: 0 50%, 100% 50%;
}

.accident .flow dt{
	display: flex;
}
.accident .flow > div div,
.accident .flow dt > div{
	flex: 1;
	display: flex;
	align-items: center;
	color: #fff;
	background: #E10000;
}

.accident .flow dt div{
	padding-left: .5rem;
}

.accident .flow dt b{
	font-size: 1.6em;
}

.accident .flow p{
	display: flex;
	align-items: center;
	margin: 0;
	background: #EBB600;
	border-radius: 20px 0 0 20px;
}

.accident .flow i{
	display: block;
	width: 3.125rem;
	font-family: "Outfit", sans-serif;
	font-size: 2.5rem;
	text-align: center;
	font-style: normal;
}

.accident .flow dd{
	margin-bottom: 1.25rem;
	padding: .5rem 1rem;
	min-height: 5rem;
	display: flex;
	align-items: center;
	width: calc(100% - 18.75rem);
	border: 2px solid #E10000;
	border-radius: 0 20px 20px 0;
	background: #fff;
}

.accident .flow dt em{
	color: #fff;
	font-size: 1.4em;
	text-decoration: none;
}

.accident .flow dd em{
	color: #E10000;
	text-decoration: none;
}

.accident .flow dd:first-of-type em{
	font-size: 1.4em;
}


/* voice
------------------------------------------------------------*/
.voices{
	margin-top: 5rem;
}

.voices > div > div{
	border-bottom: 4px solid #216EB7;
}

.voices .wp-block-image .alignleft{
	margin-bottom: 0;
}

.voices p{
	font-size: 1rem;
}


/* company
------------------------------------------------------------*/
.anchorLinkCompany .btn{
	min-width: initial;
}

.tblCompany i{
	display: inline-block;
	font-style: normal;
}

.tblCompany dd i{
	width: 8em;
}

.history dt i{
	width: 2.2em;
	text-align: right;
}

#access .headOffice > div,
#access .wp-block-column-is-layout-flow{
	padding-top: 1rem;
	display: flex;
	justify-content: space-between;
	border-top: 6px solid #216eb7;
}

#access .txt{
	flex: 1;
}

#access .mapWrap{
	width: 60%;
}

#access .headOffice .mapWrap{
	width: auto;
	flex: 1;
	margin: 0 0 5rem 5rem;
}

.map{
  position: relative;
  width: 100%;
  height: 0;
  padding-top: 75%;
}

.map iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.philosophy{
	position: relative;
	text-align: center;
}

.philosophy header{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto auto -50px;
	width: 270px;
	height: 270px;
	border: 6px solid #308AE5;
	border-radius: 100vh;
	background: #fff;
	line-height: 1.2;
	z-index: 10;
}

.philosophy header h3{
	margin: -.5em 0 .5rem;
	font-size: 2.25rem;
	line-height: 3.125rem;
}

.philosophy header h3 i{
	margin-right: .1em;
	display: inline-block;
	width: 3.125rem;
	height: 3.125rem;
	color: #fff;
	background: #216EB7;
}

.philosophy header span{
	display: block;
	font-size: 1.5rem;
}

.philosophy .philoM > div,
.philoV{
	display: flex;
	justify-content: center;
	gap: 1rem;
}

.philoAnswer{
	width: 350px;
	position: relative;
	padding: 1rem;
	font-size: 1rem;
	border: 2px solid #216EB7;
	border-radius: 10px;
	background: #F9FAFA;
	z-index: 10;
}

.philoV{
	padding-top: 110px;
}

.philosophy .philoOur,
.philosophy:after{
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 440px;
	height: 440px;
	border-radius: 100vh;
	color: #fff;
	background: #216EB7;
	z-index: 0;
}

.philosophy:after{
	content: '';
	width: 480px;
	height: 480px;
	border: 6px solid #308AE5;
	background: transparent;
}

.philosophy i{
	font-family: "Outfit", sans-serif;
	text-transform: uppercase;
	font-weight: 300;
	font-style: normal;
}

.philoOur i{
	display: block;
	font-size: 1.5rem;
}

.philoOur h3{
	margin-top: 7rem;
	padding-bottom: 80px;
	font-size: 2.5rem;
	line-height: 1.2;
	background: url(images/logoMarkWhite.svg) no-repeat 50% 100%;
}



/* recruit
------------------------------------------------------------*/
#recruit-info section.btns{
	padding-top: 4rem;
	padding-bottom: 4rem;
}

#recruit-info .btns > div{
	display: flex;
	flex-wrap: nowrap;
}

#recruit-info section.btns > div{
	justify-content: center;
}

#recruit-info section.btns > div p{
	width: 48%;
}

#recruit-info section.btns > div .btn{
	min-width: initial;
}



/* steps & process
------------------------------------------------------------*/
.steps > div{
	position: relative;
	padding: .5rem 1.5rem 1.5rem;
	border: 4px solid #308AE5;
	border-radius: 20px;
	background: #f9fafa;
}

.steps > div:not(:last-child):after{
	position: absolute;
	top: calc(50% - .8rem);
	right: -2.2rem;
	content: '';
  width: 1.6rem;
  height: 1.6rem;
  border: 0;
  border-top: solid 4px #216EB7;
  border-right: solid 4px #216EB7;
  transform: rotate(45deg);
}

#flow .steps > div,
#flow .steps > div:not(:last-child):after{
	border-color: #FFC703;
}

#flow .steps h3{
	font-size: 1.5rem;
	color: #216EB7;
	text-align: center;
}

#graduates .steps h3{
	margin-bottom: 1rem;
	color: #216EB7;
	text-align: center;
	line-height: 1.4;
	border-bottom: 2px solid #216EB7;
}

.steps h3 i,
.process h3 i{
	padding: 0 .1em;
	font-size: 2.5em;
	font-style: normal;
	font-family: "Outfit", sans-serif;
}

#flow .steps h3 i{
	margin-right: .2em;
	font-size: 1.65em;
}

.process > div{
	margin-bottom: 3rem;
	padding-bottom: 1rem;
	background: url(images/iconProcess01.webp) no-repeat calc(100% - .5rem) .5rem / 100px 100px;
}
.process > div:nth-of-type(2){background-image:url(images/iconProcess02.webp)}
.process > div:nth-of-type(3){background-image:url(images/iconProcess03.webp)}
.process > div:nth-of-type(4){background-image:url(images/iconProcess04.webp)}
.process > div:nth-of-type(5){background-image:url(images/iconProcess05.webp)}
.process > div:nth-of-type(6){background-image:url(images/iconProcess06.webp)}

.process > div:first-of-type .btn{
	min-width: initial;
}

.process > div:first-of-type .btn:after{
	transform: rotate(135deg);
}


/* topics
------------------------------------------------------------*/
.topicsList dt{
	display: flex;
	border-top: 1px solid #ccc;
}

.topicsList dt time,
.topicsList dt div{
	margin-right: 1rem;
	height: 100%;
	display: flex;
	align-items: center;
}

.topicsList dt div{
	flex: 1;
	margin: 0;
}

.topicsList dd h3{
	font-weight: 500;
	font-size: 1.125rem;
}

.topicsList dt:first-of-type,
.topicsList dd:first-of-type{
		border: 0;
}

.topicsList dt .cat{
	margin: 0;
}

.topicsList .wp-block-buttons{
	padding: 0;
}


main a.title{
	position: relative;
	display: inline-block;
	color: #222;
	border: 0;
}



/* CONTACT
------------------------------------------------------------*/
.wpcf7-form input[type="text"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea{
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid #ccc;
  color: inherit;
  font-family: inherit;
  font-size: 1.125rem;
  padding: .75em;
  width: 100%;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  color: #222;
  background: #fff;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus{
  border: 1px solid #999;
  box-shadow: none;
  outline: none;
}

.wpcf7-form input[type="checkbox"]{
  transform: scale(1.2);
  margin-right: 10px;
}

.wpcf7-form input[type="submit"]{
	padding: 15px 60px;
	margin: 0 auto;
	cursor: pointer;
	font-size: 1.125rem;
	justify-content: center;
}

input:disabled{
	background: #ccc !important;
	border-color: #ccc !important;#
}

.wpcf7 dt span{
	margin-left: 5px;
	padding: 0 .5em;
	font-size: 1rem;
	color: #fff;
	background: #E10000;
	border-radius: 3px;
}

.wpcf7 dt i{
	font-style: normal;
	font-size: .85em;
}

.wpcf7 .btns > div{
	justify-content: center;
}

.wpcf7 .wpcf7-spinner{
	margin: 1rem auto;
	display: block;
	background-color: #216eb7;
}

.wpcf7 .tbl{
	border: 0;
}

.privacyBox{
	height: 200px;
	padding: .75em;
	font-size: 1rem;
	border: 1px solid #ccc;
  box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  overflow-y: scroll;
}

.privacyBox h5{
	font-size: 1rem;
	font-weight: 700;
}


@media screen and (min-width: 960px){
	.tbShow,
	#menu{
		display: none;
	}
	#headerUpper .inner{
		width: 96%;
    max-width: 1380px;
		padding: 1rem 0;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	#header #logo{
		display: flex;
		align-items: center;
		flex: 1;
	}
	#header .contactBtns{
		display: flex;
	}
	#header .contactBtns a{
		margin-left: 1rem;
	}
	#header.navFix{
		padding: 0;
		position: fixed;
		top: 0;
		left: 0;
		background: #fff;
		box-shadow: rgba(0, 0, 0, .1) 0 0 20px 0;
	}
	#header.navFix #panel{
		display: none;
	}
	#panel .inner{
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 96%;
		max-width: 1380px;
		padding: 0 2rem;
		background: #E9F0F7;
		border-radius: 100vh;
	}
	#panel li{
		position: relative;
		display: flex;
		align-items: center;
		min-height: 70px;
		text-align: center;
	}
	#panel li i{
		display: none;
	}
	#panel .sub-menu{
    visibility: hidden;
    opacity: 0;
    min-width: 10rem;
    height: 0;
    position: absolute;
    top: 70px;
    left: 0;
    transition: .3s ease-in-out;
    text-align: left;
	}
	#panel .sub-menu li{
		text-align: left;
	}
	#panel li:hover > .sub-menu{
    visibility: visible;
    opacity: 1;
    height: auto;
    background: #e9f0f7;
    border-radius: 0 0 6px 6px;
    z-index: 100;
	}
	#panel .sub-menu a{
		width: 100%;
		padding: 1em;
		font-size: 1rem;
		white-space: nowrap;
		border: 0;
	}
	#panel .sub-menu a:before{
		content: none;
	}

	#content{
		flex-wrap: wrap;
		display: flex;
		justify-content: space-between;
		max-width: 1440px;
	}

	#content main{
		width: 72%;
		padding-top: 5rem;
	}

	#content main#index{
		width: 100%;
		padding: 3rem 0 5rem;
	}

	main#toppage,
	main#page{
		margin: auto;
		padding: 0 1.875rem;
		max-width: 1440px;
	}

	#content aside{
		width: 25%;
		padding: 5rem 0;
	}

	.consultBanner .lower > div{
		width: 48%;
		max-width: 600px;
		margin: 0 1rem;
	}

	.consultBanner .recruitBanner .lower > div{
		width: 100%;
	}

	.consultBanner .lower > div div{
		padding-top: 1rem;
	}

	.consultBanner .check{
		padding: 0 1rem 1rem 0;
	}

	.footerNav,
	.footerLower ul{
		display: flex;
	}

	.footerNav > ul{
		padding-left: 2.5rem;
	}

	.footerNav li{
		padding-bottom: .2rem;
	}

	.footerUpper,
	.footerLower{
		display: flex;
		justify-content: space-between;
	}

	.footerLower li{
		margin-left: 1rem;
	}

	main .consultBanner .recruitBanner header{
		padding: 50px 162px 10px;
	}

	main .consultBanner .recruitBanner header p{
		margin-bottom: .5rem !important;
	}

	main .recruitBanner .lower .btn{
		width: 100%;
	}

	.wpcf7-form dt p{
		padding-top: .5em;
	}

	.wpcf7 .confirm dd p{
		min-width: 400px;
		padding: .5em;
  	min-height: 3rem;
	}


}

@media screen and (max-width: 1200px){
	#header .btn:not(.btnTel){
		min-width: initial;
	}
	.consultBanner h3{
		font-size: 2.5vw;
	}
	.serviceList figure{
		aspect-ratio: initial;
		box-shadow: none;
		border-radius: 0;
	}
	.serviceList figure img{
		border-radius: 6px;
	}
	.partnerList > div > div > div > div{
		width: auto;
		padding-left: 1rem;
	}
	.partnerList figure{
		flex: 1;
	}
	.steps > div:not(:last-child):after{
		top: calc(50% - .7vw);
		right: -2.5vw;
  	width: 1.4vw;
  	height: 1.4vw;
	}
}

@media screen and (max-width: 1400px){
	#mainImg{
		padding: 5rem 1rem;
		height: auto;
		background-position: 98% 50%;
		background-size: 40vw auto;
	}
	#mainImg h1{
		font-size: 4vw;
	}
	#mainImg h1 i{
		font-size: 2vw;
	}
	#mainImg h1 em{
		font-size: 1em;
	}

	#mainImg h1 span em{
		width: 1.5em;
		height: 1.5em;
		line-height: 1.5em;
	}
	#mainImg h1 span em:last-of-type{
		margin-left: -.2em;
	}

	h2.heading br:not(.spShow){
		display: none;
	}

	main#post .content{
		padding-top: 1rem;
	}
	#title{
		flex-wrap: wrap;
		justify-content: center;
		text-align: center;
	}
	#title div{
		width: 100%;
		font-size: 5rem !important;
	}
	#bread{
		margin-bottom: 0;
	}
}


@media screen and (max-width: 959px){
	body{
		font-size: 14px;
	}
	.pcShow{
		display: none;
	}
	#header + div,
	main#page{
		padding-top: 7rem;
	}
	#header{
		position: fixed;
		bottom: 0;
		left: 0;
	}
	#header div.inner{
		padding: 0;
	}
	#header #logo{
		position: fixed;
		width: 100%;
		top: 0;
		padding: 1rem 0 .5rem;
		text-align: center;
	}
	#header.navFix #logo{
		display: none;
	}
	#header .contactBtns{
		width: calc(100vw - 60px);
		display: flex;
		justify-content: space-between;
	}
	#header .contactBtns .btn{
		border-width: 1px;
	}
	#header .contactBtns a{
		display: block;
		border-radius: 0;
		letter-spacing: 0;
		text-align: center;
	}
	#header .contactBtns a.btnConsult{
		padding: 34px 0 0;
		flex-shrink: 0;
		width: 70px;
		order: 1;
		font-size: .675rem;
		border-top: 1px solid #216EB7;
		border-bottom: 1px solid #216EB7;
	}
	#header .contactBtns .btnTel{
		min-width: initial;
		display: flex;
		align-items: center;
		flex: 1;
		order: 2;
		justify-content: center;
		padding-right: 2rem;
		border-right: 0;
	}
	#header .contactBtns a.btnContact{
		padding: 43px 0 0;
		flex-shrink: 0;
		width: 70px;
		order: 3;
		font-size: .675rem;
	}
	#header .btnTel div{
		text-align: center;
	}
	#header .btnTel span{
		font-size: 1.5rem;
	}
	#header .btnTel i{
		font-size: .75rem;
		word-break: break-spaces;
	}
	#header .contactBtns a.btn:after{
		content: none;
	}

	#header a.btnContact:before,
	#header a.btnConsult:before{
		top: 5px;
		left: 50%;
		transform: translateX(-50%);
	}

	#header a.btnContact:before{
		top: 10px;
	}

	#menu{
		position: fixed;
		bottom: 0;
		right: 0;
		width: 60px;
		height: 60px;
		background: #fff;
		text-align: center;
		cursor: pointer;
		z-index: 900;
		border: 1px solid #216EB7;
	}

	#menu:before,
	#menu:after{
		display: block;
		position: absolute;
		top: 18px;
		left: 15px;
		width: 30px;
		height: 2px;
		content: '';
		background: #216EB7;
		transition: .5s ease-in-out;
	}

	#menu:after{
		top: 28px;
	}

	#menu.isOpen:before{
		top: 24px;
  	transform: translateY(0) rotate(45deg);
	}

	#menu.isOpen:after{
		top: 34px;
  	transform: translateY(-10px) rotate(-45deg);
	}

	#menu > div{
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		text-align: center;
		font-weight: 700;
		font-size: .675rem;
	}

	#panel{
		position: fixed;
		top: 0;
		right: -100%;
		opacity: 0;
		width: 100%;
		height: calc(100% - 60px);
		padding: 1em 0 0;
		transform: translateX(250px);
		transition: .3s;
		overflow: scroll;
		z-index: 800;
		background: #fff;
	}

	#panel.isOpen{
		right: 0;
		opacity: 1;
		transform: translateX(0);
	}

	#panel .inner{
		padding: 1rem;
	}

	#panel li{
		position: relative;
		border-top: 1px solid #98999D;
	}
	#panel li br{
		display: none;
	}
	#panel li:first-child{
		border-top: 0;
	}

	#panel a{
		padding: 1.5em 0;
		font-size: 1rem;
	}
	#panel a:before{
		content: none;
	}

	#panel li.current-menu-item a{
		border: 0;
	}

	.menu-item-has-children{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		width: 100%;
	}
	.menu-item-has-children > a{
		width: calc(100% - 40px);
	}

	.submenu-toggle{
		position: relative;
		width: 40px;
		height: 40px;
	}
	.submenu-toggle:before,
	.submenu-toggle:after{
		position: absolute;
		top: 20px;
		right: 10px;
		content: '';
		width: 20px;
		height: 1px;
		background: #216EB7;
	}
	.submenu-toggle:after{
		transform: rotate(90deg);
	}
	.submenu-toggle.isOpen:after{
		display: none;
	}
	.sub-menu{
		display: none;
		width: 100%;
		margin: 0 0 1em;
	}
	#panel .sub-menu li{
		border: 0;
	}
	#panel .sub-menu a{
		padding: 1em 0 1em 1em;
	}

	.consultBanner .inner{
		padding-right: 1rem;
		padding-left: 1rem;
	}

	.consultBanner h3{
		font-size: 1.5rem;
	}

	.consultBanner .lower{
		padding: 0 1rem;
		display: block;
	}

	.consultBanner .lower > div{
		margin: 2rem auto;
		max-width: 640px;
	}

	.consultBanner .recruitBanner header{
		padding: 0 0 20vw;
		min-height: initial;
		background-size: auto 20vw;
		background-position: 50% 100%;
	}

	.consultBanner .recruitBanner h2{
		font-size: 6vw;
	}

	#footer{
		margin-bottom: 60px;
	}
	#footer .inner{
		padding: 1rem;
		text-align: center;
	}
	#footer .sns{
		justify-content: center;
	}
	#footer .sns li{
		margin: 1rem .5rem 0;
	}

	.footerNav{
		display: none;
	}
	.footerLower,
	.footerLower ul{
		padding-top: 1rem;
		display: flex;
		flex-wrap: wrap;
		font-size: .75rem;
	}
	.footerLower div{
		width: 100%;
		order: 1;
	}
	.footerLower ul{
		width: 100%;
		order: 0;
		justify-content: center;
	}
	.footerLower li{
		margin-right: 1rem;
	}
	#top{
		bottom: 60px;
		right: 10px;
	}
	#top a{
  	width: 40px;
  	height: 40px;
  	border-radius: 50%;
	}

	#bread,
	.content{
		padding-right: 1rem;
		padding-left: 1rem;
	}

	.anchorLink{
		margin: 2rem 0;
	}
	:where(.wp-block-columns.is-layout-flex).anchorLink{
		gap: 1em;
	}
	.anchorLink .btn{
		min-width: initial;
	}

	.wp-block-columns.is-not-stacked-on-mobile.anchorLinkCompany{
		flex-wrap: wrap !important;
	}
	.wp-block-columns.is-not-stacked-on-mobile.anchorLinkCompany > .wp-block-column{
		flex-basis: 30%;
	}

	:where(.wp-block-columns.is-layout-flex.anchorLinkCompany){
		gap: .5rem !important;
	}

	.wpcf7-form dl{
		width: 100%;
		display: block;
	}

	.wpcf7-form dt{
		margin-bottom: 0;
		text-align: left;
	}
	.wpcf7-form dt br{
		display: none;
	}

	.wpcf7-form dd{
		border: 0;
		margin-bottom: 2rem;
	}

	main .recruitBanner .lower{
		padding: 1rem .5rem;
	}
	main .recruitBanner .lower .btn{
		width: 49%;
		min-width: initial;
	}
	#graduates main .recruitBanner .lower .btn{
		width: 100%;
	}
	#graduates #entryform h2{
		margin-bottom: 1rem !important;
	}

	.steps > div{
		width: 100%;
		margin-bottom: 2rem;
	}

	.steps > div:not(:last-child):after{
		right: calc(50% - .5rem);
		top: calc(100% + .5rem);
		bottom: 0;
		width: 1rem;
  	height: 1rem;
		transform: rotate(135deg);
	}

	.process > div{
		width: 49%;
		margin-bottom: 1rem;
	}

	.telOnly > div{
		width: auto;
		height: auto;
	}

	.telOnly .btnTel{
		transform: scale(1);
	}

	#content aside{
		padding-bottom: 2rem;
	}

}


@media screen and (min-width: 782px){
	.topicsList .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column:last-of-type{
		flex-grow: 1.7;
	}
	.companies-wrap > div{
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.companies-wrap h3{
		width: 5em;
	}
	.companies-wrap .wp-block-columns{
		width: calc(100% - 5em);
	}
	.topicsList dl{
		display: flex;
		flex-wrap: wrap;
	}

	.topicsList dt{
		padding: 1.5rem 0;
		width: 280px;
	}

	.topicsList dt .cat{
		width: 160px;
	}

	.topicsList dd{
		width: calc(100% - 280px);
		padding: 1.5rem 0;
		border-top: 1px solid #ccc;
	}

	main .topicsList a.title:after{
		margin-top: .8em;
	}

	.accident .flow dl{
		display: flex;
		flex-wrap: wrap;
	}
	.accident .flow dt{
		margin-bottom: 1.25rem;
		width: 18.75rem;
		min-height: 5rem;
	}

	.voices > div{
		display: flex;
		justify-content: space-between;
	}
	.voices > div > div{
		width: 33%;
		max-width: 400px;
	}

	.col3 > *{
		width: 31%;
	}

	.list:after,
	.col3:after{
		content: '';
		width: 31%;
	}

	.col2 > div{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.col2 > div > div{
		width: 49%;
		max-width: 670px;
	}

	.tblCompany dt{
		padding-right: 5rem;
	}
	.history dt{
		padding-right: 2rem;
	}

	a.btnCareer,
	a.btnGraduate{
		height: 5rem;
		padding-left: 66px;
	}
	a.btnCareer:before,
	a.btnGraduate:before{
		width: 36px;
		height: 36px;
	}
}


@media screen and (max-width: 781px){
	#mainImg{
		padding: 2rem .5rem 65vw;
		justify-content: center;
		background-position: 50% 80%;
		background-size: auto 50vw;
		text-align: center;
	}
	#mainImg h1{
		margin-top: 0;
		font-size: 7vw;
	}
	#mainImg h1 i{
		margin-bottom: 1rem;
		font-size: 4vw;
	}
	.topicsList dt{
		margin-top: 1rem;
		padding-top: 1rem;
	}
	.topicsList dt time{
		width: 6em;
	}
	main a.title:after{
		margin-top: .8em;
	}

	.btns > div{
		flex-wrap: wrap;
		justify-content: center;
	}

	#page .is-layout-flex .txt{
		order: 0;
	}

	#page .is-layout-flex:not(.wp-block-buttons) .img{
		margin: auto;
		order: 1;
	}

	.reason h3{
		margin-top: 2rem;
		font-size: 1.25rem;
		text-align: center;
	}
	.reason h3 span i{
		font-size: 1.5rem;
	}
	.reason p{
		font-size: 1rem;
	}
	.reason > div,
	.companies-wrap h3{
		margin-bottom: 2rem;
	}

	.accident .flow{
		font-size: 1.25rem;
	}
	.accident .flow div{
		min-height: initial;
	}
	.accident .flow > div div{
		padding: .8rem;
		font-size: 1.4em;
		line-height: 1.2;
		border-radius: 0 10px 10px 0;
	}
	.accident .flow > div div span{
		padding: 0 35px;
		background-size: 30px 30px, 30px 30px;
	}
	.accident .flow p{
		border-radius: 10px 0 0 0;
	}
	.accident .flow div p{
		border-radius: 10px 0 0 10px;
	}
	.accident .flow dt > div{
	 	border-radius: 0 10px 0 0;
	}
	.accident .flow dd{
		width: 100%;
		border: 2px solid #E10000;
		border-top: 0;
		border-radius: 0 0 10px 10px;
	}
	.accident .flow i{
		width: 2.125rem;
		font-size: 2rem;
	}

	.voices > div > div{
		margin-bottom: 2rem;
		overflow: hidden;
		line-height: 1.7;
	}

	.partnerList > div > div > div > div{
		flex: 1;
	}
	.partnerList figure{
		width: 210px;
		flex: initial;
	}

	.nayamiList img{
		width: 80px;
		height: auto;
	}
	.nayamiList .bubble{
		width: calc(100% - 80px);
	}
	.nayamiList .bubble > div{
		padding: 1em;
		min-height: initial;
		font-size: 1.125rem;
	}

	.boxBorder figure{
		text-align: center;
	}

	#access .headOffice .headTxt{
		flex: 1;
	}
	#access .headOffice .mapWrap{
		width: 60%;
		flex: initial;
	}

	main p{
		margin-bottom: .5rem;
	}

	.content{
		font-size: 1rem;
	}
	.content > section{
		padding: 5rem 0;
	}

	.content > section > div{
		padding: 0 1rem;
	}

	.postnav{
		font-size: .875em;
	}

	.consultBanner .upper{
		justify-content: center;
		flex-wrap: wrap;
	}
	.consultBanner .upper .check{
		margin-bottom: 1rem;
	}

	#page .is-layout-flex h2{
		margin-bottom: 1rem;
		font-size: 1.6rem;
	}

	h2.wp-block-heading.heading em{
		font-size: .62em;
	}

	.topicsList .wp-block-buttons{
		justify-content: center;
	}

	.topicsList h2{
		text-align: center;
	}

	h1.wp-block-heading,
	h3.wp-block-heading.heading{
		font-size: 1.5rem;
	}

	.col3 > *{
		width: 100%;
	}

	.mt1{margin-top:.5rem !important}
	.mt2{margin-top:1rem !important}
	.mt3{margin-top:1.5rem !important}
	.mt5{margin-top:2.5rem !important}
	.mb3{margin-bottom:1.5rem !important}
	.pt3{padding-top:1.5rem !important}
	.pt5{padding-top:2.5rem !important}
	.pb3{padding-bottom:1.5rem !important}

	#title h1{
		font-size: 2rem;
	}

	#title div{
		font-size: 3rem !important;
	}

	.bubbleWrap p{
		font-size: 1.125rem;
	}

	.philosophy header{
		width: 47vw;
		height: 47vw;
		margin-bottom: -13vw;
	}

	.philosophy header h3,
	.philoOur h3{
		font-size: 6.7vw;
		line-height: 1.2;
	}

	.philosophy header h3 i{
		width: 9vw;
  	height: 9vw;
  	line-height: 9vw;
	}

	.philosophy header span{
		font-size: 4vw;
	}

	.philoAnswer{
		margin: 0 auto;
		padding: .5rem;
		width: 46vw;
		font-size: .875rem;
		line-height: 1.6;
		text-align: left;
	}

	.philoAnswer br{
		display: none;
	}

	.philoV{
		padding-top: 20vw;
	}

	.philosophy .philoOur{
		width: 90vw;
		height: 90vw;
	}

	.philosophy:after{
		width: 98vw;
		height: 98vw;
	}

}

@media only screen and (max-width: 640px){
	.consultBanner h2{
		font-size: 2rem;
	}
	.consultBanner h2 em{
		width: 3rem;
		height: 3rem;
		line-height: 2.8rem;
	}
	.check li{
		font-size: 1.25rem;
	}
	.consultBanner .icons li{
		width: 80px;
		height: 80px;
	}
	.consultBanner .icons li img{
		width: 70%;
		height: auto;
	}
	.consultBanner .tel{
		padding-left: 30px;
		font-size: 2rem;
		background-size: 28px 28px;
	}
	#page h2{
		font-size: 2rem;
		margin-bottom: 1rem;
	}
	h2.wp-block-heading em{
		margin-bottom: .2rem;
		font-size: 1rem;
	}
	h3.wp-block-heading.h2{
		font-size: 1.65rem;
		text-align: left;
	}
	.has-text-align-center.spLeft{
		text-align: left;
	}
	.bubbleWrap h3{
		font-size: 2rem;
		margin-bottom: 1rem;
	}
	.bubbleWrap h3 span em{
		width: 3rem;
		height: 3rem;
		line-height: 3rem;
		font-size: 2rem;
	}
	.anchorLink .btn{
		flex-direction: column;
		padding: 35px 10px 45px;
		font-size: 1rem;
		text-align: center;
	}
	.anchorLinkCompany .btn{
		padding-top: 10px;
	}
	.anchorLink .btn:before{
		top: 5px;
		left: calc(50% - 12px);
	}
	.anchorLink .btn:after{
		top: auto;
		left: calc(50% - 5px);
		bottom: 10px;
	}
	.nayamiList .answer{
		padding: 1rem 80px 0 120px;
		text-align: left;
	}
	.answer br{
		display: none;
	}
	.anchorLinkCompany .btn{
		font-size: 1rem;
	}
	#recruit-info .btns > div{
		justify-content: space-between !important;
	}
	#recruit-info .btns p{
		width: 48%;
	}
	#recruit-info .btns .btn{
		min-width: initial;
		width: 100%;
	}

}


@media only screen and (min-width: 561px){
	.spShow{
		display: none;
	}
}

@media only screen and (max-width: 560px){
	#header #logo img{
		width: 160px;
	}
	#mainImg h1 i{
		font-size: 4.53vw;
	}
	#header .contactBtns a{
		padding: 0;
		font-size: .625rem;
	}
	#header .btnTel span{
		line-height: 1.2;
		font-size: 5.5vw;
	}
	#header .contactBtns .btnTel{
		padding: 0 5px 0 6vw;
	}
	#header .contactBtns .btnTel div{
		text-align: left;
	}
	#header .contactBtns .btnTel div:before{
		left: -6vw;
		width: 5vw;
		height: 5vw;
		background-size: 5vw;
	}
	#content{
		padding: 0 0 3em;
	}
	#header + div,
	main#page{
		padding-top: 5rem;
	}
	main section{
		padding: 2em 5%;
	}
	#index,
	#related,
	aside{
		padding-right: 1rem;
		padding-left: 1rem;
	}

	#footer .logo{
		width: 160px;
	}

	#index #title h1{
		font-size: 1.7rem;
	}
	#title{
		padding-top: 0;
	}
	#title div{
		font-size: 2rem !important;
	}
	h2.wp-block-heading,
	h2.title{
		font-size: 1.5rem;
	}
	.postnav{
		border-radius: 0;
	}
	.postnav .btn{
		top: auto;
		min-width: 110px;
		height: 3rem;
		font-size: inherit;
	}
	.btns p:first-of-type{
		margin-right: 0;
	}
	.btns > div{
		display: block;
	}

	.wpcf7-form .btns > div{
		display: flex;
	}

	.wpcf7-form .btns input{
		min-width: 120px;
		margin: 0 .5rem;
		padding: 0;
		justify-content: center;
	}

	.voices img{
		width: 100px;
	}

	.topicsList .wp-block-button{
		width: 100%;
	}
	.consultBanner .btn{
		min-width: initial;
	}
	.consultBanner .icons li{
		width: 70px;
		height: 70px;
	}
	.check li{
		padding-left: 1.2rem;
		font-size: 1rem;
		background-size: 1rem auto;
	}
	.wp-block-columns.is-not-stacked-on-mobile.anchorLink{
		flex-wrap: wrap !important;
	}
	.wp-block-columns.is-not-stacked-on-mobile.anchorLink > div{
		width: 45%;
		flex-basis: initial;
	}
	.nayamiList .bubble > div{
		font-size: 1rem;
	}
	.nayamiList .answer{
		padding: 1rem 80px .5rem 0;
	}
	.serviceList > div > div > div{
		display: block;
	}
	.serviceList figure{
		margin-top: 1rem;
		width: 100%;
	}
	.partnerList > div > div{
		padding: .75rem;
	}
	.partnerList figure{
		width: 120px;
	}

	.process > div{
		width: 100%;
	}
	.process .btn br.tbShow{
		display: none;
	}
	#entryform .recruitBanner h2{
		font-size: 1.5rem;
	}

	.wp-block-columns.is-not-stacked-on-mobile.anchorLinkCompany > .wp-block-column{
		flex-basis: 48%;
	}

	#access .headOffice > div,
	#access .wp-block-column-is-layout-flow{
		display: block;
	}
	#access .mapWrap{
		margin: 1rem 0 0 !important;
		width: 100% !important;
	}
	.philosophy header{
		padding-top: 9vw;
		margin-bottom: -17vw;
		align-items: flex-start;
	}
	.philoAnswer{
		min-height: 8em;
	}
	.philoOur h3{
		margin-top: 20vw;
		padding-bottom: 12vw;
		background-size: auto 12vw;
	}

	main .recruitBanner .lower{
		flex-wrap: wrap;
	}
	main .recruitBanner .lower .btn{
		width: 100%;
	}

	.tblSp{
		display: block;
	}
	.tblSp dt{
		width: 100%;
		padding-bottom: 0;
	}
	.tblSp dd{
		width: 100%;
		padding-top: 0;
		border: 0;
	}
	.sp-align-left{
		text-align: left !important
	}
}

@media only screen and (max-width: 374px){
	#header .contactBtns a.btnContact,
	#header .contactBtns a.btnConsult{
	 	width: 60px;
	}
	#header .contactBtns .btnTel{
	 	padding-left: .5em;
	}
	#header .contactBtns .btnTel div:before{
		top: 1vw;
		left: 0;
		width: 5vw;
	}
	#header .contactBtns .btnTel span{
		padding-left: 5vw;
	}
	.content{
		font-size: .875rem;
	}
	.content > section > div{
		padding: 0 .5rem;
	}
	h2.wp-block-heading,
	h2.title,
	h3.wp-block-heading,
	#page .is-layout-flex h2{
		font-size: 1.25rem;
	}
	.reason h3 span{
		letter-spacing: -.05em;
	}
	.reason h3,
	.reason h3 span i{
		font-size: 1.125rem;
	}
	.consultBanner .lower{
	 	padding: 0 .5rem;
	}
	.consultBanner .icons li{
		width: 60px;
		height: 60px;
	}
	.philoAnswer{
		padding-right: .25rem;
		font-size: 4vw;
	}
	.philoOur h3{
		margin-top: 28vw;
		padding-bottom: 12vw;
		background-size: auto 12vw;
	}
}