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

全ての要素をリセット
各ブラウザの表示を統一するための設定です

*****************************************************/
html {overflow-y: scroll;scroll-behavior: smooth;}
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;outline:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style: normal;}
table {	border-collapse: collapse;border-spacing: 0;}
caption,p {text-align: left;}
h1,h2,h3,h4,h5,h6 {font-size: 100%;text-align:left;}
img,abbr,acronym,fieldset {border: 0;}
li {list-style-type: none;}
img{vertical-align:middle;}
.line {font-size:1px;line-height:1px;}

body {
	background:#f7f7f7;
    color: #231815;
    font-family: "Noto Sans JP","メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;
    line-height: 2em;
    letter-spacing: 0.05em;
    text-size-adjust: 100%;
}
table {border-collapse: collapse;}
.float_left {
    display: block;float: left;}
.float_right {
    display: block;float: right;}
.float_left_space {
    display: block;
    float: left;
    margin-right: 30px;
}
.float_right_space {
    display: block;
    float: right;
    margin-left: 30px;
}
.clear{clear:both;}
.w90{width:90%;}
.w80{width:80%;}
.w75{width:75%;}
.w70{width:70%;}
.w65{width:65%;}
.w60{width:60%;}
.w55{width:55%;}
.w50{width:50%;}
.w45{width:45%;}
.w40{width:40%;}
.w35{width:35%;}
.w30{width:30%;}
.w25{width:25%;}
.w20{width:20%;}
.min{font-family:"Noto Sans JP","游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}
.f-g{font-family:"Noto Sans JP","メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Osaka", "ＭＳ Ｐゴシック", "MS P Gothic", Verdana, Arial, Helvetica, sans-serif;}

.jyunbi {
    width: 95%;
    max-width: 1200px;
    margin: 0px auto;
    text-align: center;
    font-size: 2.5em;
    line-height: 1.8;
    padding: 15rem 0px;
}

.grecaptcha-badge {
    box-shadow: gray 0px 0px 0px !important;
}
.grecaptcha-logo {
    display: none;
}
/*****************************************************

コンテンツ

*****************************************************/
.wrap {
  width: 100%;
  height: auto;
  margin: 0px auto;
  overflow: hidden;
}

.recruite-area,
.wrap:has(.recruite-area) {
  overflow: visible !important;
}
.recruite-area {
  display: flow-root;
  width: 100vw;
  max-width: 100%;
  overflow-x: clip !important; 
}

a:link {
  color: #231815;
  text-decoration: none;
}

a:visited {
  color: #231815;
  text-decoration: none;
}

.page a:link, .page a:visited {
    color: #231815;
}

a:hover {
    text-decoration: none;
    color: #231815;
	opacity:0.6;
}

a:active {
    text-decoration: none;
    color: #231815;
}

.clear::after {
    visibility: hidden;
    display: block;
    font-size: 0px;
    content: " ";
    clear: both;
    height: 0px;
}

* html .clear {
    zoom: 1; }

:first-child + html .clear {
    zoom: 1; }

a, a img {
    transition: 0.3s ease-in-out;
}

a img:hover, .shopnav a:hover, .foot-nav a:hover {
    opacity: 0.6;
}

a[href^="tel:"] {
    pointer-events: none;
    color: #000;
}

@media screen and (max-width: 768px) {
    a[href^="tel:"] {
    pointer-events: auto !important;
}
}

.bt-a {
    text-align: center;
    margin: 20px auto;
}

.bt-a a {
    display: inline-block;
    text-align: center;
    border: 2px solid #000;
    background: rgb(255, 255, 255);
    box-sizing: border-box;
    padding: 5px 4em;
    font-size: 90%;
    border-radius: 50px;
    box-shadow: #000 2px 2px 0px 0px;
    transition: 0.3s ease-in-out;
}

.bt-a a:hover {
    box-shadow: #000 5px 5px 0px 0px;
}

.nen {
    font-size: 0.8em;
}
/*****************************************************

メインヘッダー

*****************************************************/

header {
  width: 100%;
  margin: 0 auto;
  position: relative;
  box-sizing: border-box;
  z-index: 10;
  position: fixed;
}


header .headutility-area {
  display: flex;
  justify-content: flex-end;
  position: relative;
  top: 0;
}
header .headtitle-area{
	width: 95%;
	max-width: 320px;
}

header .headtitle-area img {
  width: 100%;
}
@media screen and (max-width: 900px) {
  header .head-contents {
    align-items: flex-start;
  }
}
header.page-header {
  position: absolute;
}
header .head-contents {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem;
	
}

header .headutility-area {
  display: flex;
  justify-content: flex-end;
  position: relative;
  top: 0;
}

@media screen and (max-width: 900px) {
header .headtitle-area{
	width: 95%;
	max-width: 250px;
	margin:0 5% 0 0;
}
  header .head-contents {
    align-items: flex-start;
  }
}



header .headutility-area .gnav-area {
  display: flex;
  justify-content: flex-end;
}


/* ================================
   PCグローバルナビ
================================ */
header .gnav-pc ul {
  display: flex;
  align-items: center;
  font-size: 1rem;
  margin: 0 1.5rem 0 0;
  font-weight: 500;
}

header .gnav-pc ul li {
  margin: 0 0.6rem;
  position: relative;
	cursor:pointer;
}

header .gnav-pc ul li.toi-bt a{
  display:block;
  background: #003e8c;
  color:#fff;
  box-sizing:border-box;
  padding:0 1rem;
  border-radius:25vh;
	font-size:0.8em;
}

/* 下線アニメーション */
header .gnav-pc ul li::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background: #111;
  transition: 0.3s ease-in-out;
}

header .gnav-pc ul li:hover::before {
  width: 100%;
  background: #0067b4;
}
header .gnav-pc ul li.toi-bt:hover::before{
	width: 0%;
  height: 0px;
} 

header .gnav-pc ul li:hover > a {
  color: #0067b4;
}

header .gnav-pc ul li.toi-bt:hover > a {
  color: #fff;
}
/* PCサブメニュー */
header .gnav-pc ul li ul {
  display: block;
  position: absolute;
  top: 100%;
  left: 50%;
  min-width: 220px;
  margin-left: -110px;
  padding: 1rem;
  box-sizing: border-box;
  background: #fff;
  border-radius: 5px;
  box-shadow: 0 0 8px 2px rgba(0,0,0,0.2);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  pointer-events: none;
  z-index: 10;
}

header .gnav-pc ul li:hover > ul {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

header .gnav-pc ul li ul li {
  margin: 0;
  padding: 0.1rem 0;
}

header .gnav-pc ul li ul li::before {
  display: none;
}

header .gnav-pc ul li ul li a {
  display: block;
  color: #111 !important;
  line-height:1.5;
}

header .gnav-pc ul li ul li a:hover {
  opacity: 0.7;
  padding-left: 0.5rem;
}

/* 白背景用 */
.page-wrap header .gnav-pc ul li a {
  color: #fff;
}

.page-wrap header .gnav-pc ul li::before,
.page-wrap header .gnav-pc ul li:hover::before {
  background: #fff;
}


/* ================================
   メガメニュー
================================ */
.megamenu {
  overflow-y: auto;
  display: flex;
  justify-content: center;
  align-items: stretch;
  position: fixed;
  inset: 0;
  width: 100%;
  background: #efefef;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: -10;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s, z-index 0s linear 0.4s;
}

.megamenu.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 100;
  transition: opacity 0.4s ease, visibility 0s, z-index 0s;
}

.megamenu .menu-area {
  width: 100%;
  min-height: 100vh;
  margin: 3rem auto;
  padding: 0 6%;
  box-sizing: border-box;
  z-index: 1;
}

.megamenu .menu-area .title {
  font-size: 1.2rem;
  font-weight: 500;
  margin: 2rem 0;
}

.megamenu .menu-area ul li a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background: #fff;
  padding: 0.6rem 0.7rem;
  box-sizing: border-box;
  margin: 0 auto 0.75rem;
  border-radius: 0.5rem;
}

.megamenu .menu-area ul li a:hover {
  background: #ddd;
}


/* ================================
   メガメニュー内サブメニュー
================================ */
.megamenu .submenu ul {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.8s ease-in-out;
  padding-left: 2.3rem;
}

.megamenu .submenu.open ul {
  max-height: 500px;
}

.megamenu .submenu.open ul li a {
  padding: clamp(0.3rem, 4vw, 0.7rem);
  padding-left: 1.2rem;
  font-size: 0.92rem;
}

.megamenu .submenu > a {
  cursor: pointer;
  position: relative;
  padding-right: 2rem;
}

.megamenu .submenu > a::after {
  content: '+';
  position: absolute;
  right: 1.5rem;
  font-size: 1.5rem;
  color: #333;
  transition: transform 0.3s ease;
}

.megamenu .submenu.open > a::after {
  content: '−';
}


/* ================================
   閉じるボタン
================================ */
header .close-bt {
  display: none;
  position: fixed;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: #0067b4;
  transition: all 1s;
  top: 50px;
  right: 50%;
  margin-right: 30px;
  z-index: 2000;
  cursor: pointer;
}

.megamenu.active .close-bt {
  display: block;
}

header .close-bt span {
  display: inline-block;
  transition: all 0.8s;
  position: absolute;
  left: 17px;
  height: 1px;
  border-radius: 5px;
  background: #fff;
  width: 40%;
}

header .close-bt span:nth-of-type(1) {
  top: 21px;
  transform: translateY(6px) rotate(-45deg);
}

header .close-bt span:nth-of-type(2) {
  top: 33px;
  transform: translateY(-6px) rotate(45deg);
}

header .close-bt:hover span:nth-of-type(1) {
  transform: translateY(6px) rotate(315deg);
}

header .close-bt:hover span:nth-of-type(2) {
  transform: translateY(-6px) rotate(405deg);
}


/* ================================
   テキストメニュー
================================ */
header .txtmenu {
  margin: 1.5rem 0 !important;
}

header .txtmenu li a {
  position: relative;
  margin: 0 0 0 0.5rem !important;
  padding: 0.3rem 0.3rem 0.3rem 1.2rem !important;
  background: none !important;
  font-size: 0.95rem;
}

header .txtmenu li a::before {
  content: '>';
  margin-right: 0.25rem;
  position: absolute;
  left: 0;
  transition: 0.3s ease-in-out;
}

header .txtmenu li a:hover::before {
  left: 0.25rem;
}


/* ================================
   SNSメニュー
================================ */
header .snsmenu {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 5rem;
}

header .snsmenu li a {
  width: 40px;
  height: 40px;
  background: #fff;
  display: flex;
  justify-content: center !important;
  align-items: center !important;
  margin: 0 0 0 0.45rem !important;
  border-radius: 50% !important;
  padding: 0 !important;
  text-align: center !important;
}

header .snsmenu li:first-child img {
  width: 20px;
}



header .snsmenu li a:hover {
  opacity: 1;
  background: #0e8c3b !important;
}


/* ================================
   ハンバーガーボタン
================================ */
.openbtn-wrap {
  display: none;
  overflow: hidden;
  width: 50px;
  height: 55px;
  /* padding: 10px 0 0; */
}

.openbtn {
  position: fixed;
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #111;
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 15px;
  height: 1px;
  border-radius: 5px;
  background: #fff;
  width: 20px;
}

.openbtn span:nth-of-type(1) {
  top: 19px;
}

.openbtn span:nth-of-type(2) {
  top: 24.5px;
}

.openbtn span:nth-of-type(3) {
  top: 31px;
}

.openbtn:hover span:nth-of-type(1) {
  top: 17px;
}

.openbtn:hover span:nth-of-type(3) {
  top: 32px;
}


/* ================================
   オーバーレイ
================================ */
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0);
  z-index: -1;
  transition: background-color 1s ease, z-index 0s 1s;
}

.overlay.show {
  background-color: rgba(0,0,0,0.6);
  z-index: 5;
  transition: background-color 0.5s ease;
}


/* ================================
   Responsive
================================ */
@media screen and (max-width: 1200px) {

  header .gnav-pc ul li {
    margin: 0 0.4rem;
  }

  header .gnav-pc ul .middle-menu {
    display: none;
  }
}

@media screen and (max-width: 900px) {
  header .gnav-pc {
    display: none;
  }

  .openbtn-wrap {
    display: block;
  }
}

@media screen and (max-width: 800px) {
  header .close-bt {
    right: 1.5rem;
    top: 1.5rem;
    left: auto;
    margin-right: 0;
  }
}

@media screen and (max-width: 700px) {
  .megamenu {
    display: block;
  }

  .megamenu-bg {
    display: none;
  }

  .megamenu .menu-area {
    width: 90%;
    padding: 0;
  }
}

@media screen and (max-width: 640px) {
  header .head-contents {
    padding: 1.2rem 1rem;
  }
}
/*****************************************************

フッター

*****************************************************/
footer {
    background: #322b29;
    padding: 5rem 0px;
}
footer .menu-area ul {
	display: flex;
	justify-content: center;
	align-items: center;
}
.sns a{width:20px;height:20px;display:none;}
.sns img{width:100%;}

footer .menu-area ul li {
	font-size: 0.88rem;
	margin: 0 0.75rem;
	font-weight: 500;
	position: relative;
}
footer .menu-area ul li:last-child {
	width:20px;
}
footer .menu-area ul li:last-child img{
	width:100%;
}
footer .menu-area ul li a{
	color:#fff!important;
}
footer .menu-area ul li:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0%;
	height: 1px;
	background: #111;
	transition: 0.3s ease-in-out;
}

footer .menu-area ul li:last-child:hover:before {
	display:none;
}

.ft-content{
	display: -webkit-flex;
	display: flex;
	align-items: center;
	max-width: 700px;
	margin:3rem auto;
	justify-content: center;
}
.ft-content .lbox {
	width: 35%;
	border-right:1px solid #fff;
}
.ft-content .rbox {
	width:65%;
	padding-left:5%;
	box-sizing:border-box;
}
.ft-content .lbox .logo-sp{
	width:100%;
	max-width:200px;
	margin:0 auto;
}
.ft-content .lbox .logo-sp img{
	width:100%;
}
.ft-content .rbox ul li a,
.ft-content .rbox ul li{
	color:#fff;
}
.ft-content .rbox ul li:nth-child(2){
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}
.ft-content .rbox ul li:nth-child(2) a{
	color:#322b29;
	background:#fff;
	padding:0.3rem 1rem;
	border-radius:25vh;
	box-sizing:border-box;
	margin-left:1rem;
	font-weight:600;
}
@media screen and (max-width:1000px) {
footer .addarea span{
	display:block;
}	
	footer .addarea span:before{
	content:'';
}	
}
@media screen and (max-width:850px) {
footer .menu-area{
	margin-bottom:5rem;
}
.ft-content{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	flex-direction: column;
}
footer .menu-area ul{
	display: block;
}
footer .menu-area ul li a{
	display:block;
	border-bottom:0.5px solid #fff;
	padding:0.5rem 0.7rem 0.5rem 1.75rem;
	position:relative;
}
footer .menu-area ul li:last-child{
	display:none;
}
footer .menu-area ul li:hover:before{
	width:0%;
}
footer .menu-area ul li a:before{
	content:'>';
	margin-right:0.75rem;
	font-size:0.8rem;
	left:0.5rem;
	position:absolute;
	transition: 0.3s ease-in-out;
}
footer .menu-area ul li a:hover:before{
	left:0.8rem;
}
footer .menu-area ul li ul {
    position: static;
    transform: none;
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, max-height 0.3s ease;
    background: none;
    box-shadow: none;
    padding: 0;
    text-align: center;
  }

.sns{
	width:90%;
	margin:1rem auto 0;
}
.sns a{width:20px;height:20px;display:block;}
.sns img{width:100%;}
	
  /* 子メニュー展開時（JSで .open クラスが付与される） */
  footer .menu-area ul li.open > ul {
    opacity: 1;
    max-height: 500px;
    pointer-events: auto;
    padding: 0.5rem 0 0 0;
  }

  /* 子メニュー項目 */
  footer .menu-area ul li ul li a {
    font-size: 0.85rem;
    padding: 0.25rem 1rem;
  }	
.ft-content .lbox {
	width:90%;
	margin-bottom:1.5rem;
	border-right:0px solid #fff;
	border-bottom:1px solid #fff;
	padding:0 0 2rem;
}
.ft-content .rbox {
	width:90%;
	padding:1rem 0 0;
}
.ft-content .rbox ul{
	width: 90%;
	margin:0 auto;
}
.ft-content .rbox ul li:nth-child(2)  .bt{
	margin: 0 0 0 1rem;
}
.ft-content .rbox ul li:nth-child(2) a{
	margin:0 auto;
}
}

@media screen and (max-width:600px) {
	footer .foot-logo{
	margin-bottom:1.5rem;
}
	footer .addarea{
	display: block;
}
	footer .addarea li{
	border-right:0;
	width:100%;
		background:#fff;
		box-sizing:border-box;
}
footer .addarea li,
footer .addarea li:first-child,
footer .addarea li:last-child{
	padding:1rem;
	margin-bottom:0.5rem;
	border-radius:5px;
}
footer .addarea span{
	display:inline;
}	
footer .addarea span:before{
	content:'／';
}
}
footer .foot-submenu,
footer .footbottom{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	align-items: center;
	margin: 1.5rem auto;
	font-size:0.8rem;
}
footer .foot-submenu .txtmenu{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}
footer .foot-submenu .txtmenu li{
	position:relative;
	margin:0 2rem 0 0;
	padding-left:1.0rem;
}
footer .foot-submenu .txtmenu a:hover{
	color:#009d8b;
}
footer .foot-submenu .txtmenu li a:before{
	content:'>';
	margin-right:0.25rem;
	position:absolute;
	left:0;
	transition: 0.3s ease-in-out;
}
footer .foot-submenu .txtmenu li a:hover:before{
	left:0.25rem;
}
footer .foot-submenu .snsmenu{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: center;
	align-items: center;
}
footer .foot-submenu .snsmenu li a{
	width:40px;
	height:40px;
	background:#fff;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	margin:0 0.25rem;
	border-radius:50%;
}
footer .foot-submenu .snsmenu li:first-child img{
	width:10px;
}
footer .foot-submenu .snsmenu li:nth-child(2) img{
	width:20px;
}
footer .foot-submenu .snsmenu li a:hover{
	opacity:1;
	background:#009d8b;
}
footer .pmark img{
	width:50px;
}
.copyright {
    width: 90%;
    max-width: 1200px;
    margin: 0px auto;
	font-size:0.7rem;
	font-weight:500;
	color:#fff;
	text-align:center;
}
@media screen and (max-width:700px) {
	footer .foot-submenu .txtmenu{
	display: block;
}
}
@media screen and (max-width:480px) {
	.ft-content .rbox ul li:nth-child(2) .bt{
	margin: 1rem auto;
}
}


/*****************************************************

video

*****************************************************/
#front-main {
  position: relative;
  height: 80vh;
  /* overflow: hidden; */
}

#front-main .inner {
  position: relative;
  margin-top: 0; /* ← -10remをやめる */
  height: 100%;
  max-height: 1200px;
}

.movie-box {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.frontmovie {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1; /* ← -1をやめる */
}

.frontmovie video {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 100%;
  width: 100%;
  object-fit: cover;
  transform: translate(-50%, -50%);
}
#front-main .inner .copy .maincopy-en {
    font-size: clamp(0.8rem, 1vw, 1.25rem);
	line-height:1.8em;
	margin:0 0 0.5rem;
}
#front-main .inner .copy {
  position: absolute;
  bottom: 14vw;
  left: 0;
  margin-left: 5vw;
  color: #fff;
  z-index: 3;
}

#front-main .top-baner {
  z-index: 4;
}

#cntentbox {
  width: 100%;
  position: relative;
  z-index: 2;
  padding: 5rem 0 0;
}

#front-main .inner .copy .maincopy{
	font-size:clamp(2.8rem,3.3vw,5.5rem);
	font-weight:800;
	line-height:1.3;
	letter-spacing:0.1rem;
}

@media screen and (min-width: 1400px) {
  #front-main {
    height: 100vh;
  }

  #front-main .inner {
    height: 90%;
  }

  #front-main .inner .copy {
    bottom: 5vw;
  }
}

@media screen and (max-width:640px) {

#front-main .inner .copy .maincopy{
	font-size: clamp(1.5rem,4vw,1.8em);
	line-height: 1.4;
}
  #front-main .inner .copy {
    bottom: 50vw;
  }
}
#front-main .top-baner{
	width: 22.5vw;
	position:absolute;
	right: 3rem;
	bottom: -5vw;
	min-width: 290px;
	z-index: 2;
}
#front-main .top-baner img{
	width:100%;
		border-radius:5px;
}
#front-main .top-baner img:hover{
	opacity:1;
}
@media screen and (max-width:800px) {
#front-main .top-baner{
	bottom: -15vw;
	right: 1rem;
}
	
}
/*****************************************************

メインコンテンツ

*****************************************************/

#cntentbox{
    width: 100%;
    position: relative !important;
	padding:5rem 0 0;
}
.mv-area{
	margin:0 0 5rem;
}
.copy-area{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	width:95%;
	max-width:690px;
	margin:3rem auto;
}
.txt-sub,.txt-main,.subcopy-area{
	display: block;
	writing-mode: vertical-rl;
	text-orientation: mixed;
}
.subcopy-area{
	-webkit-order: 1;
	order: 1;
	font-size:1.25em;
	line-height:2.5;
}
.subcopy-area  span{
	writing-mode:horizontal-tb;
	margin:-0.75rem 0;
}
.txt-main{
	-webkit-order: 2;
	order: 2;
	padding:0 2rem;
	font-size:2.0em;
	line-height:1.5;
}
.txt-sub{
	-webkit-order: 3;
	order: 3;
}
.scroll-a {
    overflow: hidden;
    width: 100%;
}
.scroll-b {
    overflow: hidden;
    width: 100%;
	position:absolute;
	bottom:-5em;
}
.scroll-list {
    display: flex;
    width: max-content;
    animation: 90s linear 0s infinite normal none running scroll-left;
    margin: 5rem 0px 4rem;
}
.scroll-list li {
    list-style: none;
    white-space: nowrap;
    padding: 0px 1rem;
    color: rgb(255, 255, 255);
    font-size: 3.5em;
    font-weight: 600;
}

@keyframes scroll-left {
    0% {
        transform: translateX(0px);
    }
    100% {
        transform: translateX(-50%);
    }
}

.mv-title{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	width:95%;
	max-width:550px;
	margin: 3rem auto;
}
.jigyo-area{
	margin:0 0 8rem;
}
.service-area .mv-title{
	display: block;
	width:100%;
	max-width: 0px;
	margin: 0;
}
.service-area{
	width: 95%;
	max-width:1200px;
	margin: 0 auto 1rem;
}
.service-area h2 {
    margin: 0px 0px 4rem;
    font-size: 1.8em;
}
.service-area .mv-title {
    display: block;
    width: 100%;
    max-width: 0px;
    margin: 0px 0px 1rem;
}
.service-ph-area ul{
	width: 95%;
	max-width:1200px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	margin: 0 auto;
}
.service-ph-area ul li{
	display:block;
	width:32%;
}
.service-ph-area ul li a{
	display:block;
	text-align:center;
	background:#23181594;
	border-radius:10px;
	height:100%;
	color:#fff;
}
.service-ph-area ul li a:hover{
	background:#23181500;
}
.service-ph-area ul li a div{
	padding:3rem 0 0;
}
.service-ph-area ul li a span{
	display:block;
	background:#fff;
	width:30%;
	min-width:150px;
	margin:1rem auto 0;
	padding:0.25rem 0;
	border-radius:25vh;
	color:#231815;
	font-size:0.85em;
}
.service-ph-area ul li{
	background:url(../image/front/doboku.jpg)no-repeat center;
	background-size:cover;
	height:30rem;
	border-radius:10px;
}
.service-ph-area ul li:nth-child(2) {
	background:url(../image/front/koji.jpg)no-repeat center;
	background-size:cover;
}
.service-ph-area ul li:last-child{
	background:url(../image/front/unso.jpg)no-repeat center;
	background-size:cover;
}

.toi-area ul{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	margin-top: clamp(5rem,12vw,10rem);
	margin-bottom:clamp(5rem,12vw,10rem);
	margin-left:auto;
	margin-right:auto;
	width:95%;
	max-width: 1000px;
}
.toi-area ul li{
	width:48%;
	text-align:center;
	color:#003e8c;
	background:#f7f7f7;
	border:1px solid#fff;
	padding: 3rem 0;
	box-shadow: 0 0 8px #80808040;
	position:relative
}
.toi-area ul li .ai{
	width:100%;
	max-width:30px;
	margin:0 auto 0.5rem;
}
.toi-area ul li .ai img{
	width:100%;
}
.toi-area ul li:first-child:before{
	content:"";
	position: absolute;
  left: 0px;
  top: 0px;
  border-width: 0 0 50px 50px;
  border-style: solid;
  border-color: #f7f7f7 #003e8c #f7f7f7;
}
.toi-area ul li:last-child:after{
	content:"";
	position: absolute;
  right: 0px;
  bottom: 0px;
  border-width: 0 0 50px 50px;
  border-style: solid;
  border-color: #f7f7f7 #f7f7f7 #0e8c3b;
}
.toi-area ul li p{
	text-align:center;
}
.toi-area ul li a{
	text-align:center;
	color:#003e8c;
	display:block;
	margin:1rem auto;
	font-size:clamp(1.6em, 7vw, 2.5em);
	font-weight:bold;
	line-height:1.4;
}
.toi-area ul li:first-child a{color:#003e8c;}

.toi-area ul li:last-child a{
	border:1px solid #fff;
	border-radius:25vh;
	width:90%;
	max-width:300px;
	box-shadow:0 0 8px #80808040;
	font-size:clamp(1em, 4vw, 1.25em);
	padding:0.25rem 0;
	position:relative;
}
.toi-area ul li:last-child a,
.toi-area ul li:last-child{
	color:#0e8c3b;
}
.toi-area ul li:last-child a:after{
    content:">";
  position:absolute;
    right:0.75rem;
	font-weight:400;
}
.info-area{
	width:100%;
	background:url(../image/front/ft-bg.jpg)no-repeat center;
	background-size:cover;
	padding:22rem 0 25rem;
	position:relative;
}
.callbox{
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
.callbox p{
	writing-mode: vertical-rl;
    margin: 0 auto 5rem;
    font-size: 2em;
    line-height: 1.5;
}
.callbox .bt a{
	 display:block;
	 background:#fff;
	color:#231815;
	 border-radius:25vh;
	min-width:200px;
	padding:0.25rem 0;
	text-align:center;
}


/* スマホ */
@media screen and (max-width: 800px) {
.mv-title{
	display: flex;
	justify-content: flex-start;
	max-width:800px;
	margin: 0rem auto;
}
.copy-area{
	display: flex;
	-webkit-justify-content: flex-end;
	width:95%;
	max-width:690px;
	margin:1rem auto;
	justify-content: flex-start;
	flex-direction: column;
}
.service-ph-area ul li{
	width:100%;
}
.service-ph-area ul li{
	height:14rem;
	margin:0 0 1.5rem;
}
.service-ph-area ul li:last-child{
	margin:0 0;
}
.txt-sub,.txt-main,.subcopy-area{
	display: block;
writing-mode: horizontal-tb;
  text-orientation: mixed;
}
.subcopy-area{
	order: 3;
}
.txt-main{
	order: 2;
	padding: 1rem 0;
}
.txt-sub{
	order: 1;
}
.subcopy-area br{
	display:none;
}
.info-area{
	width:100%;
	padding:13rem 0 15rem;
	position:relative;
}
}
@media screen and (max-width: 700px) {
 .toi-area ul li{
	width:100%;
	margin:0 auto 1.5rem;
}
}
@media screen and (max-width: 480px) {
.slick-img {
    min-height: 320px;
  }
.callbox p{
	margin:0 auto 3rem;
	font-size:2.0em;
}
}


.about-area{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 40px;
}
.about-area .mission-area {
	width: 60%;
	position:relative;
}
.about-area .mission-area .text {
  position: absolute;
  left: 50%;
  top: clamp(2rem, 10%, 5rem);
  z-index: 2;
  transform: translateX(-50%);
}
.about-area .mission-area .text .yoko{
	margin:0 auto;
	color:#fff;
	font-weight:600;
	font-size:3.0em;
	line-height:1.5;
	text-align:center;
	
}
.about-area .mission-area .text .yoko span{
	display:block;
}
.about-area .mission-area .text .tate {
  color: #fff;
  writing-mode: vertical-rl;
  margin: clamp(2rem, 5vw, 5rem) auto 0;
  font-size: clamp(1.1rem, 1.4vw, 1.5rem);
}
.about-area .staff-area {
  width: 40%;
}
.about-area .staff-area ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	margin:0 0 2rem;
	width:100%;
	max-width:500px;
}
.about-area .staff-area ul li{
	width:30%;
}
.about-area .staff-area ul li img{
	width:100%;
	border-radius:25vh;
}
.mission-area .container {
  width: 100%;
}
/* ==================================================
  ABOUT AREA
================================================== */
.about-area {
  width: 100%;
  background: #fff;
}

.about-area .inner {
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  gap: 0;
  position: relative;
}

/* ==================================================
  左：STAFF
================================================== */
.about-area .staff-area {
  width: 40%;
  background: #003e8c;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: clamp(3rem, 4vw, 5rem) clamp(2rem, 3vw, 4rem);
  box-sizing: border-box;
}

.about-area .staff-area h2 {
  font-size: clamp(2rem, 2.6vw, 3rem);
  font-weight: 800;
  letter-spacing: 0.05em;
  line-height: 1.2;
  text-align: center;
  margin: 0 0 clamp(2.5rem, 3vw, 4rem);
}

.about-area .staff-area h2 span {
  display: block;
  font-size: clamp(1rem, 1.2vw, 1.5rem);
  margin-top: 0.8rem;
  font-weight: 600;
}

.about-area .staff-area ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  max-width: 500px;
  margin: 0 0 2rem;
}

.about-area .staff-area ul li {
  width: 30%;
}

.about-area .staff-area ul li img {
  width: 100%;
  border-radius: 50%;
}

.about-area .staff-area .bt {
  text-align: center;
}

.about-area .staff-area .bt a {
  display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    background: rgb(255, 255, 255);
    color: rgb(51, 51, 51);
    border-radius: 999px;
    text-decoration: none;
    font-size: 0.9em;
    padding: 0.2rem 0px;
}

/* ==================================================
  右：MISSION
================================================== */
.about-area .mission-area {
  width: 60%;
  position: relative;
  overflow: hidden;
  background: #003e8c;
}

.about-area .mission-area .container {
  width: 100%;
  height: 100%;
  position: relative;
}

.about-area .mission-area .slider,
.about-area .mission-area .slider .slick-list,
.about-area .mission-area .slider .slick-track,
.about-area .mission-area .slick-img {
  height: 100%;
}

.about-area .mission-area .slick-img {
  position: relative;
  min-height: clamp(320px, 38vw, 500px);
}

.about-area .mission-area .slick-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 62, 140, 0.6);
  z-index: 1;
  pointer-events: none;
}

.about-area .mission-area .slick-img img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* MISSIONテキスト */
.about-area .mission-area .text {
  position: absolute;
left: calc(46% + 74px);
  top: clamp(2rem, 8%, 4rem);
  z-index: 2;
  transform: translateX(-50%);
  text-align: center;
  max-height: calc(100% - 4rem);
}
.about-area .mission-area .text .yoko {
  margin: 0 auto;
  color: #fff;
  font-weight: 600;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.5;
  text-align: center;
}

.about-area .mission-area .text .yoko span {
  display: block;
}

.about-area .mission-area .text .tate {
  color: #fff;
  writing-mode: vertical-rl;
  margin: clamp(1.2rem, 3vw, 3rem) auto 0;
  font-size: clamp(1rem, 1.2vw, 1.35rem);
  line-height: 1.6;
}

/* slick矢印 */
.about-area .mission-area .slider .slick-prev,
.about-area .mission-area .slider .slick-next {
  width: 64px;
  height: 44px;
  background: #000;
  z-index: 5;
  top: auto;
  bottom: 8%;
  transform: none;
}

.about-area .mission-area .slider .slick-prev {
  left: 46%;
}

.about-area .mission-area .slider .slick-next {
  left: calc(46% + 74px);
  right: auto;
}

.about-area .mission-area .slider .slick-prev::before,
.about-area .mission-area .slider .slick-next::before {
  font-size: 22px;
  color: #fff;
  opacity: 1;
}

/* ==================================================
  1400px以上
================================================== */
@media screen and (min-width: 1400px) {
  .about-area .inner {
    height: 800px;
  }

  .about-area .mission-area .slick-img {
    min-height: auto;
  }

  .about-area .mission-area .text {
    top: 50px;}
  .about-area .mission-area .text .tate {
    margin-top: 2.5rem;
    font-size: 1.35rem;
  }
}

/* ==================================================
  タブレット
================================================== */
@media screen and (max-width: 1024px) {
.about-area .staff-area {
    width: 42%;
  }
.about-area .mission-area {
    width: 58%;
  }
.about-area .mission-area .slick-img {
    min-height: clamp(300px, 45vw, 460px);
  }
.about-area .mission-area .text {
	left: calc(35% + 72px);
}
.about-area .mission-area .slider .slick-prev {
    left: 35%;
  }
.about-area .mission-area .slider .slick-next {
    left: calc(35% + 72px);
  }
	
}

/* ==================================================
  スマホ
================================================== */
@media screen and (max-width: 800px) {
  .about-area .inner {
    flex-direction: column;
  }

  .about-area .staff-area,
  .about-area .mission-area {
    width: 100%;
  }

  .about-area .staff-area {
    padding: 4rem 2rem;
  }

  .about-area .mission-area .slick-img {
    min-height: 360px;
  }

  .about-area .mission-area .text {
    top: clamp(2rem, 8vw, 4rem);
    width: 90%;
	   left: 50%;
  }

  .about-area .mission-area .text .yoko {
    font-size: clamp(1.8rem, 7vw, 2rem);
  }

  .about-area .mission-area .slider .slick-prev {
    left: 50%;
    transform: translateX(-72px);
  }

  .about-area .mission-area .slider .slick-next {
    left: 50%;
    transform: translateX(2px);
  }
}

/* ==================================================
  小さめスマホ
================================================== */
@media screen and (max-width: 480px) {
  .about-area .mission-area .slick-img {
    min-height: 320px;
  }

 .about-area .mission-area .text {
    width: 90%;
    max-height: none;
  }
  .about-area .mission-area .text .tate {
    writing-mode: horizontal-tb;
    margin: 1.2rem auto 0;
    font-size: 1rem;
    line-height: 1.6;
    text-align: center;
  }
}
/* ==================================================
  ページ
================================================== */
.page .content{
    width: 100%;
	padding:10rem 0 0;
}
#page-head{
	width:95%;
	max-width:1200px;
	margin:0 auto 5rem;
}
#page-head .inner h1,
#page-head .inner .news-midashi{
	font-size: clamp(2.2rem, 3.5vw, 2.5rem);
	margin-bottom:clamp(0.2rem,3vw,0.75rem);
	line-height: 1.3;
	letter-spacing: 0.1rem;

}
#page-head .inner .midashi-en{
	margin-left: 0.15rem;
    font-size: clamp(0.8rem, 1.3vw, 0.9rem);
    line-height: 1;
	font-weight:600;
}
#page-head .inner h2{
	margin-top: 2rem;
	margin-left:0.15rem;
	font-size: clamp(1.3rem, 1.2vw, 1.8rem);
	line-height: 1.5;
}
#page-head .inner h2 span{
	display:block;
}
#page-head .inner .pk-area{
	position:relative;
	top:-2rem;
	width:100%;
}
#page-head .inner .pk-area,
#page-head .inner .pk-area a{
	font-size: clamp(0.75rem, 1.3vw, 0.9rem);
	color:#231815;
}
#page-head .inner .pk-area ul{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	-webkit-align-items: center;
	align-items: center;
	width:100%;
}
#page-head .inner .pk-area ul li{
}
#page-head .inner .pk-area ul li:not(:last-child)::after{
	content:'|';
	margin: 0 0.35rem;
}

/* ==================================================
  共通
================================================== */
#page-contents{
	position:relative;
}
.about-message .blue-obi{
	position: absolute;
	z-index: -1;
	top: 50%;
	right: 0%;
	transform: translate( 50%);
	width: 35vw;
	height: 60%;
	background: #003e8c;
}
.about-message,.about-rinen,.history-area{
	width:95%;
	max-width:1200px;
	margin: 0 auto 5rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	position:relative;
}
.moji{
	position:absolute;
	top:-50px;
	right:0;
	font-size:6em;
	color:#fff;
	z-index:-1;
}
.inner-box img{
	width:100%;
}
.tate-kz{
	flex: 1;
	display: flex;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	align-items: center;
	border-radius: 8px;
	position:relative;
	padding-top:5rem;
}
.tate-kz p{
	writing-mode: vertical-rl;
	white-space: nowrap;
}
.tate-kz p span{
	margin-top:1rem;
	font-size:0.8em;
}
.tate-kz:before{
	content: "";
	background: #003e8c;
	top:0rem;
	height: 4rem;
	left: 0;
	margin: auto;
	position: absolute;
	right: 0;
	width: 5px;
}
.inner-box{
	width: 90%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
.txt-area{
	width:50%;
}
.txt-area{
	margin-left:0.15rem;
	font-size:1.0em;
	line-height: 1.8;
}
.txt-area h3{
	margin-bottom:1rem;
	font-size:1.2em;
}
.photo-area{
	width:45%;
}
.hito{
	width:100%;
	margin:2rem 0;
}
.hito dl{
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;	
}
.hito dl dt{
	width:50%;
	border-radius:5px;
}
.hito dl dt img{
	border-radius:5px;
}
.hito dl dd{
	width:45%;
	padding-left:5%;
	font-size:0.8em;
}
.hito dl dd span{
    display:block;
}
.rine-area{
	width:80%;
	margin-right:10%;
}
.rine-area dl{
	border-bottom:0.5px solid #898989;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	padding:1rem 0 1rem;
}
.rine-area dl dt{
	width:25%;
	margin-left:5%;
}
.rine-area dl dd{
	width:60%;
	margin-left:10%;
}

.hoshin-area .inner-box{
	width:95%;
	max-width:1200px;
	margin:0 auto 10rem;
	background:#fff;
	border-radius:10px;
	padding:4rem 3rem;
	box-sizing:border-box;
	display:block;
}
.hoshin-area .hako{
	border-bottom:1px dotted #4c4948;
	padding:0 0 5rem;
	margin:0 0 3rem;
}
.hoshin-area .hako .ph{
	width:100%;
	max-width:150px;
	margin:0 auto;
}
.hoshin-area .hako img{width:100%;}
.hoshin-area .hako p{
	border:1px solid #231815;
	writing-mode: vertical-rl;
    white-space: nowrap;
	margin: 2rem auto;
	padding:1rem 0.25rem;
}

.hoshin-area .hako h2{
	text-align:center;
	font-size:1.5em;
}
.kankyo,.quality{
	margin:0 auto 3rem;
	padding:0 0 3rem;
	border-bottom:1px dotted #4c4948;
}

.hoshin-area dl{
	width:95%;
	margin: 0 auto 1.5rem;
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:center;
	padding: 0 0 0 1rem;
	border-left:5px solid #003e8c;
	box-sizing:border-box;
}
.hoshin-area dl:before{
	content:"";
	border-left:5px solid #003e8c;
	padding-right:1rem;
}
.hoshin-area dl dt{
	width: 30%;
	color:#003e8c;
	font-size:1.8em;
	font-weight:500;
}
.hoshin-area dl dd{
	width:65%;
}
.bluebox{
	width:95%;
	margin:0 auto;
	background:#003e8c;
	border-radius:10px;
	padding: 3rem 3rem;
	box-sizing:border-box;
}

.bluebox ol li{
	color:#fff;

	padding:1rem 0;
	border-bottom:1px dotted #fff;
	padding-left: 3em;
	text-indent: -3em;
}
.bluebox ol li:last-child{
	border-bottom:0px dotted #fff;
}
.bluebox ol li span{
	font-size:1.5em;
	margin:0 1rem 0 0.5em;
}
.bluebox ol li div.gyomu > div{
	padding-left: 0em;
	text-indent: 0em;
	line-height:1.8;
}
.bluebox ol li div.gyomu div span{
	font-size:1.0em;
	margin:0 auto;
}
.bluebox ol li div.gyomu {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 1rem 0;
}

.bluebox ol li div.gyomu > div {
	background: #fff;
	color: #003e8c;
	border-radius: 10px;
	box-sizing: border-box;
	padding: 3rem 1rem;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	flex-direction: column;
	font-weight: 500;
	width: calc((100% - 3rem) / 4);
}

.qualitybox ul {
	width: 95%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	padding: 1rem 0 1rem;
}

.qualitybox ul li {
	box-sizing: border-box;
	background: #f7f7f7;
	border-radius: 10px;
	padding: 3rem;
	width: calc((100% - 3rem) / 3);
}

.qualitybox ul li .ph {
	width: 120px;
	margin: 0 auto 2rem;
}

.qualitybox ul li img {
	width: 100%;
	height: auto;
	display: block;
}

.activities ul {
	width: 95%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 3.5rem;
	padding: 1rem 0 1rem;
}

.activities ul li {
	box-sizing: border-box;
	border-radius: 10px;

	/* 2列 */
	width: calc((100% - 3.5rem) / 2);
}

.activities ul li .ph {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin: 0 0 1.5rem;
}

.activities ul li .ph > * {
	width: calc((100% - 1rem) / 2);
}

.activities ul li .text span {
	display: block;
	text-align: center;
	padding: 0 0 1.5rem;
	font-size: 1.5rem;
}

.history-area {
	width: 100%;
	position:relative;
}

.history-bg{
	width: auto;
	height:auto;
	background:url(../image/about/history-bg.png)no-repeat center;
	background-size:cover;
	padding: 15rem 17rem;
	position:absolute;
	top:0;
	right:0;
}

.history-area .inner-box{
	width: 100%;
	max-width:1200px;
	margin: 0 auto 5rem;
	padding:0;
	box-sizing:border-box;
	display:block;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
}
.history-area .inner-box ul{
	width:90%;
}
.history-area .inner-box ul li{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    margin: 1rem 0px;
    position: relative;
    z-index: 1;
}
.history-area .inner-box ul li:before {
    content: "";
    width:86%;
    border-bottom: 0.25px solid #003e8c;
    position: absolute;
    top: 50%;
    right: 0%;
    z-index: -1;
}
.history-area .inner-box ul li .nen {
    padding: 2rem 1rem;
    border-radius: 100%;
    color: #231815;
    font-size: 1.5em;
    text-align: center;
    line-height: 0.7em;
    box-sizing:border-box;
}
.history-area .inner-box ul li .en {
    padding:2rem 2rem;
    border-radius: 100%;
    background: #003e8c;
    font-size: 130%;
    text-align: center;
}
.history-area .inner-box ul li .naiyo {
    width: 70%;
    line-height: 2.8em;
    padding: 1rem 2rem;
	box-sizing:border-box;
}
.toi-area .inner-box{
	width:95%;
	max-width:1200px;
	margin:0 auto;
	box-sizing:border-box;
}

.page-ft-bg{
	width:100%;
	background:url(../image/front/ft-bg.jpg)no-repeat bottom;
	background-size:cover;
	padding:30rem 0 0;
	position:relative;
}
.page-ft-bg:before{
	content:"";
	display:block;
	background:#00000073;
	background-size:cover;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
}
.page-ft-bg .text{
	position:absolute;
	bottom:3vw;
	right: 0%;
	margin-right: 5vw;
	color:#fff;
	font-size:clamp(1.0rem,1.5vw,2.8rem);
	font-weight:500;
	line-height:2.5;
	letter-spacing:0.1rem;
}
.page-ft-bg .text span{
	display:block;
	font-size:clamp(0.7rem,1.0vw,1.8rem);
	text-align:right;
	position:relative;
}
.page-ft-bg .text span:before{
	content:"";
	width:35%;
	border-bottom: 0.25px solid #fff;
	position: absolute;
	top: 50%;
	left: 10%;
	/* z-index: -1; */
}
/* タブレット */
@media screen and (max-width: 900px) {
	.bluebox ol li div.gyomu > div {
		width: calc((100% - 1rem) / 2);
	}

	.qualitybox ul li {
		width: calc((100% - 1.5rem) / 2);
	}
}
@media screen and (max-width: 800px) {
.hito dl{
	display:block;
}
.hito dl dt{
	width:100%;
	margin:0 0 1rem
}
.hito dl dd{
	width:100%;
	font-size:1.0em;
	text-align:center;
	padding-left:0;
}
.txt-area,.photo-area{
	width:100%;
}

.about-message .blue-obi{
	display:none;
}
.moji{
	font-size:3em;
}
.inner-box{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}

.tate-kz:after{
	content: "";
	background: #003e8c;
    height: 3px;
    position: absolute;
    top:50%;left:0;
    width:100%;
	z-index:-1;
}
.tate-kz:before{
	content: "";
    height:0;
    width:0px;
}
.tate-kz{
	width:100%;
	writing-mode:horizontal-tb;
	padding:0;
}
.tate-kz p{
	background:#f7f7f7;
	display:inline-block;
	writing-mode:horizontal-tb;
	padding: 0 1rem 0 0;
}
.tate-kz p span{
	margin-top:0;
	margin-left:1rem;
	font-size:0.8em;
}
.about-message,.about-rinen,.history-area{
	margin: 0 auto 5rem;
}
.photo-area .box{
	width: 90%;
	margin: 0 auto 1rem;
}
.photo-area img{
	box-shadow: 50px 50px #003e8c;
}
.rine-area{
	width:100%;
	margin-right:0%;
}

.rine-area dl dt{
	width:100%;
	margin-left:0%;
}
.rine-area dl dd{
	width:100%;
	margin-left:0%;
}
.hoshin-area .inner-box{
	padding: 3rem 1.0rem;
	box-sizing:border-box;
	display:block;
}
.hoshin-area dl{
	width:100%;
	padding: 0 0 0 0rem;
	border-left:0px solid #003e8c;
}
.hoshin-area dl dt:before{
	content:"";
	width:100%;
	padding: 0 1.0rem 0 0;
	border-left:5px solid #003e8c;
}
.hoshin-area dl dt{
	width:100%;
}
.bluebox{
	width:100%;
	padding:1.5rem;
}
.hoshin-area dl dd{
	width:100%;
	margin-top:1rem;
}
.history-area .inner-box{
		width:95%;
		margin: 0 auto 0;
	}
.history-area .inner-box ul{
	width:100%;
}
	.history-area .inner-box ul li{
		flex-wrap:wrap;
	}

	.history-area .inner-box ul li:before{
		width: calc(100% - 5.6rem);
		top: 2.5rem;
		right:0;
	}

	.history-area .inner-box ul li .naiyo{
		width:100%;
		flex:none;
		line-height:2em;
		padding: 1rem 1rem;
	}
}
/* スマホ */
@media screen and (max-width: 600px) {
.bluebox ol li div.gyomu > div {
	width: 100%;
	padding: 2rem 1.5rem;
}
.qualitybox ul li {
	width: 100%;
	padding:2rem;
}
.activities ul li {
	width: 100%;
}
.activities ul li .ph > * {
	width: 100%;
}
.history-area .inner-box ul li .nen {
    padding: 1.0rem 1rem;
}
.history-area .inner-box ul li .en {
    padding:1.5rem 1.5rem;
}
.history-area .inner-box ul li:before{
	width: calc(100% - 5.6rem);
	top: 1.5rem;
	right:0;
}
.page-ft-bg{
	padding:20rem 0 0;
	position:relative;
}
}
/* ==================================================
  service 事業内容
================================================== */
.page-service img{
	width:100%;
}
.service-maiin-area{
	width:100%;
	margin: 0 auto 0rem;
	position:relative;
}
.service-maiin-area .blue-obi{
	position: absolute;
	z-index: -1;
	top: 60%;
	left: 0%;
	transform: translate(0%);
	width: 45vw;
	height: 50%;
	background: #003e8c;
}
.service-maiin-area .leftbox{
	width:35%;
	padding: 1rem;
	box-sizing:border-box;
}
.service-maiin-area .rightbox{
	width:65%;
	background:url(../image/service/service-main.jpg)no-repeat center;
	background-size:cover;
	padding: 16rem 0;
	position:relative;
}
.service-maiin-area .rightbox .text{
	position:absolute;
	bottom:0.5vw;
	right: 0%;
	margin-right: 2vw;
	color:#fff;
	font-size:clamp(1.0rem,1.5vw,2.8rem);
	font-weight:500;
	line-height:2.5;
	letter-spacing:0.1rem;
}

.service-maiin-area .leftbox ul li:first-child{
	writing-mode: vertical-rl;
	margin: 0 auto 5rem;
	font-size: clamp(1.5rem,1.8vw,2.0rem);
	line-height:1.8;
}
.service-maiin-area .leftbox ul li:last-child{
	line-height:1.8;
	margin: 0 auto;
	color:#fff;
}
.service-maiin-area .inner-box{
	width: 95%;
	max-width:1200px;
	margin:0 auto;
	box-sizing:border-box;
}
#content1{
	margin: 0 0 8rem;
}
#about-page #content1{
	margin: 0 auto 8rem;
}
#service01,#service02,#service03{
	background: #f8f6f3;
	padding: 7rem 0 5rem;
	overflow: hidden;
	width: 100%;
}
#service03{
	padding: 7rem 0 0;
}
#service01 .inner,
#service02 .inner,
#service03 .inner{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: flex-start;
	align-items: flex-start;
}
.service-info{
	width: calc(100% - 120rem);
	padding-left: 15%;
	padding-right:0%;
	padding-top:2rem;
	margin-right: 4rem;
}
.service-slide{
	width: 120rem;
	overflow:hidden;
	padding: 2.5rem 3rem 2.5rem;
	position: relative;
	margin: 0;
	box-sizing: border-box;
	background:#fff;
	border-radius: 10px 0 0 10px;
	box-shadow: 1px 1px 15px 1px #00000024;
}
.service-slide .textarea{
	width: 100%;
	margin: 0 auto 2rem;
}
.service-slide h2{
	color:#003e8c;
	font-size:1.5em;
	line-height:1.5;
	margin:0 0 1rem;
}
@media screen and (max-width:1200px) {
.service-maiin-area .leftbox ul li:last-child br{
	display:none;
}
}
@media screen and (max-width:800px) {
#content1{
	margin: 0 0 3rem;
}
#about-page #content1{
	margin: 0 auto 8rem;
}
#service01,#service02,#service03{
	padding: 3rem 0 3rem;
	overflow: hidden;
	width: 100%;
}
.service-maiin-area .blue-obi{
	display:none;
}
.service-slide h2 br{
	display:none;
}
.service-maiin-area .leftbox ul li:first-child{
	writing-mode: vertical-rl;
	margin: 0 auto 3rem;
	font-size: clamp(1.5rem,1.8vw,2.0rem);
	line-height:1.8;
}
.service-maiin-area .leftbox{
	width: 100%;
	margin:0 auto;
	padding: 0rem;
	box-sizing:border-box;
}
.service-maiin-area .rightbox{
	width:100%;
	padding:10rem 0;
	position:relative;
}
.service-maiin-area .leftbox ul li:last-child{
	background:#003e8c;
	/* margin:0 0 3rem; */
	box-sizing:border-box;
	padding:2rem;
}
#service01 .inner,
#service02 .inner,
#service03 .inner{
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-direction: column;
}
.service-info{
	width:100%;
	padding: 0%;
	margin: 0 0 3rem 3rem;
}
.service-slide{
	width:100%;
	padding: 2.5rem 1.5rem 2.5rem;
	border-radius: 0;
}
}
/* ==================================================
  service01~03.スライド
================================================== */
.swiper-s {
    width: 100%;
	padding:0 0;
}
.swiper-s .swiper-slide{
	margin:2rem 0;
	transform: scale(0.9)!important;
	background:#f7f7f7;
	height:auto;
}
.swiper-s .is-active-slide{
	transform: scale(0.9)!important;
	left:0;
}

.swiper-s .swiper-slide img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.swiper-s.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-s .swiper-pagination-progressbar.swiper-pagination-horizontal {
	height: 6px;
	top: auto;
	right:0!important;
	left:unset!important;
	width:95%;
	max-width:1200px;
}

.swiper-s .swiper-pagination-progressbar {
    background-color: #dedfdf;
}

.swiper-s .swiper-pagination-progressbar-fill {
    background-color: #003e8c!important;
}
.service-box{
	border-radius:15px;
	padding: clamp(1.0rem,7vw,3rem);
}
.service-box h3{
	text-align:center;
	font-size:clamp(1.3rem,1.5vw,1.8rem);
	line-height:1.5;
}
.service-box .image{
	width:100%;
	height: auto;
	padding:1rem 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
.service-box .image img{
width:100%;
}
.service-box .txt{
	font-size:clamp(0.93rem,2.0vw,1.1rem);
	line-height:1.7;
	padding: 0 0rem;
	min-height: 4rem;
	width:100%;
	margin: 0 auto;
}
.movie-bt{
	text-align:center;
	width:100%;
	max-width:250px;
	margin:3rem 0 0;
}

.movie-bt a{
	display:block;
	background:#fff;
	box-sizing:border-box;
	border-radius:25vh;
	padding:0.5rem 1rem 0.5rem 2.8rem;
	position:relative;
}

.movie-bt a:before{
	content:"";
	background:url(../image/common/ic-click-red.svg) no-repeat center;
	background-size:contain;
	width:22px;
	height:20px;
	position:absolute;
	top:50%;
	left:1rem;
	transform:translateY(-50%);
}
.prev-s,
.next-s{
    color: #c1c2c2;
    position: absolute;
    z-index: 2;
    width:2.5rem;
    height:2.5rem;
    text-align:center;
    line-height:2.5rem;
    font-size:1.25rem;
    cursor:pointer;
    transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.prev-s:hover,
.next-s:hover{
    color: #003e8c;
}
.prev-s {
    left: 5.0rem;
	box-shadow: 1px 1px 10px 1px #00000024;
	border-radius:25vh;
	background:#fff;
}
.next-s{
    left: 8.5rem;
	box-shadow: 1px 1px 10px 1px #00000024;
	border-radius:25vh;
	background:#fff;
}
.slide-bt{
	background:#003e8c;
	color:#fff;
	text-align:center;
	border-radius:5px;
	margin:1.25rem auto 1.25rem;
	padding:0.25rem 0;
	max-width:200px;
}
@media screen and (max-width:800px) {
.swiper-a .swiper-slide{
	transform: scale(0.85)!important;
	transition: transform 0.3s ease;
}
.swiper-a .is-active-slide{
	transform: scale(0.95)!important;
	left:0;
}
.prev-s {
    left: 1.0rem;
}
.next-s{
   left:4.5rem;
}
}


.achiev-area .inner-box {
  width: 100%;
}

.achiev-area ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;

  width: 95%;
  max-width: 1200px;
  margin: clamp(5rem, 12vw, 10rem) auto;
  padding: 0;
  list-style: none;
}

.achiev-area ul li:first-child {
  width: 52%;
  flex: 0 0 52%;
}

.achiev-area ul li:last-child {
  width: 38%;
  flex: 0 0 38%;
}

.achiev-area ul li .ai {
  position: relative;
  width: 100%;
}

.achiev-area ul li .ai img {
  position: relative;
  top: auto;
  left: auto;

  display: block;
  width: 115%;
  max-width: none;
  height: auto;

  transform: translateX(-12%);
}

.achiev-area ul li:last-child .box {
  text-align: center;
  color: #003e8c;
  background: #f7f7f7;
  border: 1px solid #fff;
  padding: 3rem 2rem;
  box-shadow: 0 0 8px #80808040;
  position: relative;
  margin: 1.5rem 0 0;
}

.achiev-area ul li:last-child .box::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 50px 50px 0 0;
  border-color: #003e8c transparent transparent transparent;
}

.achiev-area ul li:last-child .box p {
  text-align: center;
  font-weight: 700;
  font-size: 1.5em;
  margin: 0 0 1rem;
  letter-spacing: 0.05em;
}

.achiev-area ul li:last-child a {
  border: 1px solid #fff;
  border-radius: 25vh;
  width: 90%;
  max-width: 300px;
  margin: 0 auto;
  box-shadow: 0 0 8px #80808040;
  font-size: 1.25em;
  padding: 0.25rem 0;
  color: #003e8c;
  display: block;
  position: relative;
  text-decoration: none;
  background: #fff;
}

.achiev-area ul li:last-child a::after {
  content: ">";
  position: absolute;
  right: 1rem;
}

/* タブレット */
@media screen and (max-width: 1024px) {
  .achiev-area ul {
    width: 94%;
    gap: 3rem;
  }

  .achiev-area ul li:first-child {
    width: 52%;
    flex: 0 0 52%;
  }

  .achiev-area ul li:last-child {
    width: calc(48% - 3rem);
    flex: 0 0 calc(48% - 3rem);
  }

  .achiev-area ul li .ai img {
    width: 120%;
    transform: translateX(-16%);
  }
}

/* スマホ：横並び維持 */
@media screen and (max-width: 800px) {
  .achiev-area ul {
    width:100%;
    gap: 1.5rem;
    align-items: center;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: column;
}
  .achiev-area ul li:first-child {
    width: 100%;
    flex: 0 0 50%;
	  order: 2;
  }

  .achiev-area ul li:last-child {
    width: calc(100% - 1.5rem);
    flex: 0 0 calc(50% - 1.5rem);
	  order: 1;
  }

  .achiev-area ul li .ai img {
    width: 135%;
    transform: translateX(-28%);
  }

  .achiev-area ul li:last-child .box {
    padding: 2rem 1rem;
  }

  .achiev-area ul li:last-child .box::before {
    border-width: 35px 35px 0 0;
  }

  .achiev-area ul li:last-child .box p {
    font-size: 1.05em;
  }

  .achiev-area ul li:last-child a {
    width: 100%;
    font-size: 0.9em;
    padding: 0.35rem 0;
  }
}

/* ==================================================
  staff 社内紹介
================================================== */
.head-block,.ft-block{
	position:relative;
}

/* 青帯 */
.head-block .blue-obi,
.ft-block .blue-obi{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:30%;
	height:clamp(140px, 42vw, 520px);
	background:#003e8c;
	z-index:-1;
}

.head-block .blue-obi{left:0;}
.ft-block .blue-obi{right:0;}
.intervew-area{
	position:relative;
	margin: 0 0 15rem;
}

/* 画像3枚横並び */
.staff-area .head-block ul,
.intervew-area .ft-block ul{
	display:flex;
	align-items:stretch;
	width:100%;
	margin:0;
	padding:0;
	list-style:none;
}
.staff-area .head-block ul{
	justify-content:flex-start;
}
.intervew-area .ft-block ul{
	justify-content:flex-end;
}

.staff-area .head-block ul li,
.intervew-area .ft-block ul li{
	width:calc(100% / 3);
}
.staff-area .head-block ul li:nth-child(2),
.intervew-area .ft-block ul li:nth-child(2){
	padding: 0 0.5rem;
	box-sizing:border-box;
}

.staff-area .head-block img,
.intervew-area .ft-block img{
	width:100%;
	height:100%;
	display:block;
	object-fit:cover;
}
.text-block{
	max-width:1200px;
	margin: 8rem auto 3rem;
}
.text-block h1{
	text-align:center;
	font-size:clamp(1.6em, 6vw, 2.5em);
	margin:0 0 2rem;
	line-height:1.4;
}
.text-block h1 span{
	display:block;
	font-size:0.4em;
	padding:1.5rem 0 0;
}
.text-block p{
	width:fit-content;
	max-width:90%;
	margin:0 auto;
	text-align:left;
	line-height:2;
}
.interview-title{
	position:relative;
	width:fit-content;
	margin:4rem auto;
	padding:2rem 1.5rem;
	text-align:center;
	font-size:1.5rem;
	line-height:1.4;
}

.interview-title::before,
.interview-title::after{
	content:"";
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	width:280px;
	height:5px;
	background:#000;
}
.interview-title::before{top:0;}
.interview-title::after{bottom:0;}

.intervew-block ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:stretch;
	margin:0 auto 15rem;
	width:95%;
	max-width:900px;
}

.intervew-block ul li{
	width:calc(100% / 3);
	display:flex;
	flex-direction:column;
	align-items:center;
	box-sizing:border-box;
}

.intervew-block ul li p{
	text-align:center;
	line-height:1.8;
	margin:0 0 1rem;
}

.intervew-block ul li p span{
	display:block;
	background:#fff;
	margin:0 auto 1rem;
	width:100px;
	font-size:0.8em;
}

.intervew-block ul li .bt{
	width:150px;
	margin-top:auto;
}

.intervew-block ul li .bt a{
	display:block;
	background:#003e8c;
	color:#fff;
	text-align:center;
	border-radius:25vh;
	padding:0.4rem 0;
}
.intervew-block ul li .ph{
	background:url(../image/front/ic-muhamad.jpg) no-repeat center;
	background-size:cover;
	width:clamp(160px, 16vw, 200px);
	height:clamp(160px, 16vw, 200px);
	margin:0 auto 1.5rem;
	border-radius:50%;
}
.intervew-block ul li:nth-child(2) .ph{
	background:url(../image/front/ic-yamaguchi.jpg) no-repeat center;
	background-size:cover;
}

.intervew-block ul li:last-child .ph{
	background:url(../image/front/ic-baba.jpg) no-repeat center;
	background-size:cover;
}



@media screen and (min-width:1400px){

.head-block .blue-obi,
.ft-block .blue-obi{
		height:520px;
		top:50%;
		transform:translateY(-50%);
	}	
.staff-area .head-block ul,
.intervew-area .ft-block ul{
		justify-content:center;
		max-width:1200px;
		margin:0 auto;
}
.staff-area .head-block ul li,
.intervew-area .ft-block ul li{
		height:360px;
}
.staff-area .head-block img,
.intervew-area .ft-block img{
		height:100%;
		object-fit:cover;
}

}

@media screen and (max-width:800px){
.head-block .blue-obi,
	.ft-block .blue-obi{
		width:45%;
		height:clamp(140px, 42vw, 520px);
		top:50%;
	}

}
@media screen and (max-width:600px){
.intervew-area{
		margin:0 0 8rem;
	}

	.staff-area .head-block ul li,
	.intervew-area .ft-block ul li{
		height:clamp(110px, 30vw, 170px);
	}

	.staff-area .head-block ul li:nth-child(2),
	.intervew-area .ft-block ul li:nth-child(2){
		padding:0 0.3rem;
	}

	

	.intervew-block ul{
		display:flex;
		flex-wrap:wrap;
		padding:0 1rem;
		margin:0 auto 5rem;
	}

	.intervew-block ul li{
		width:50%;
		display:flex;
		flex-direction:column;
		align-items:center;
		margin-bottom:3rem;
		box-sizing:border-box;
	}

	.intervew-block ul li .ph{
		width:clamp(120px, 38vw, 180px);
		height:clamp(120px, 38vw, 180px);
		margin:0 auto 1rem;
		border-radius:50%;
	}

	.intervew-block ul li p{
		margin:0 0 1rem;
		text-align:center;
		line-height:1.6;
		font-size:0.9em;
	}

	.intervew-block ul li p span{
		width:90px;
		margin:0 auto 0.8rem;
		font-size:0.75em;
	}

	.intervew-block ul li .bt{
		width:130px;
		margin-top:auto;
	}

	.intervew-block ul li .bt a{
		padding:0.45rem 0;
		font-size:0.85em;
	}
.interview-title{
		margin:3rem auto;
		padding:1.5rem 1rem;
		font-size:1.25rem;
		line-height:1.4;
	}

	.interview-title::before,
	.interview-title::after{
		width:220px;
		height:5px;
	}

}
/* ==================================================
  スタッフインタビュー
================================================== */
#content1.mainph-area,
.shosai-area{
	width:95%;
	max-width:1200px;
	margin:0 auto;
	position:relative;
}

/* メイン画像 */
.main-ph{
	width:100%;
	padding-top:3rem;
}
.main-ph img{
	width:100%;
	display:block;
}

/* 青タイトル */
.ao-title{
	position:absolute;
	top:0;left:-5%;
	width:clamp(300px, 32%, 400px);
	height:110px;
	background:#003e8c;
	color:#fff;
	text-align:center;
	z-index:2;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	font-size:1.4rem;
	font-weight:bold;
	line-height:1.5;
	box-sizing:border-box;
	padding:1rem;
}

.ao-title span{
	display:block;
	font-size:0.55em;
	font-weight:normal;
	letter-spacing:0.05em;
	margin-bottom:0.25rem;
}
.comment{
	margin-top:1.5rem;
	font-size:1.5rem;
	text-align:center;
	margin:3rem 0;
}
.shosai-area{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	margin:0 auto 8rem;
}
.shosai-area .leftbox{
	width:46%;
}
.shosai-area .rightbox{
	width:46%;
}
.shosai-area .leftbox h1{
	background:#fff;
	box-shadow: 0 0 8px #80808040;
	padding:3rem;
	margin:0 0 3rem;
	font-size:2.0em;
	font-weight:500;
	text-align:center;
	line-height:1.5;
}

.shosai-area .leftbox h1 span{
	display:block;
	font-size:0.5em;
	margin-top:2rem;
	color:#003e8c;
}
.rightbox dl.first{
	border-top:1px solid #bfc0c0;
	margin-top:1rem;
}
.rightbox dl.first:before{
	content:"";
	position:absolute;
	left:0;
	top:-1px;
	width:30%;
	border-top:1px solid #003e8c;
	z-index:2;
}
.rightbox dl{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-start;
	align-items:center;
	padding:1rem 0;
	border-bottom:1px solid #bfc0c0;
	position:relative;
}

.rightbox dl:after{
	content:"";
	position:absolute;
	left:0;
	bottom:-1px;
	width:30%;
	border-bottom:1px solid #003e8c;
	z-index:2;
}

.rightbox dl dt{
	width:30%;
	padding:0 0 0 1em;
	box-sizing:border-box;
	color:#003e8c;
}

.rightbox dl dd{
	width:70%;
	padding:0 0 0 1em;
	box-sizing:border-box;
}
.riyu-area{
	background:url(../image/front/slider-about01.jpg)no-repeat center;
	background-size:cover;
	padding:8rem 3rem;
	position:relative;
}
.page-yamaguchi .riyu-area{
	background:url(../image/staff/bg-yamaguchi.jpg)no-repeat center;
	background-size:cover;
}
.page-baba .riyu-area{
	background:url(../image/staff/bg-baba.jpg)no-repeat center;
	background-size:cover;
}
.riyu-area:before{
	content:"";
	display:block;
	background:#00000099;
	background-size:cover;
	width:100%;
	height:100%;
	position:absolute;
	top:0;left:0;
}
.riyu-area .box-a{
	position:relative;
	z-index:1;
}
.riyu-area .box-b{
	position:relative;
	z-index:1;
}
.riyu-area h2{
	text-align:center;
	font-size:clamp(1.3em, 5vw, 2.0em);
	margin:0 0 2rem;
	line-height:1.4;
	color:#fff;
}
.riyu-area .box-b p,
.riyu-area .box-a p{
	width:fit-content;
	max-width: 50%;
	margin:0 auto;
	text-align:left;
	line-height:2;
	color:#fff;
}
.riyu-area .phbox{
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
	margin-top: clamp(3rem,10vw,5rem);
	margin-bottom:clamp(5rem,15vw,8rem);
	margin-left:auto;
	margin-right:auto;
	width:95%;
	max-width: 1000px;
}
.riyu-area .phbox div{
	width:48%;
	box-sizing:border-box;
	border:10px solid #fff;
}
.riyu-area .phbox img{
	width:100%;
}
.message-area{
	width:100%;
	padding: 15rem 0 0;
}
.message-area h2{
	width:100%;
	text-align:center;
	font-size:clamp(3.2em, 9vw, 6.5em);
	font-weight:700;
	margin:0 0 clamp(8rem, 12vw, 12rem);
	color:#fff;
	line-height:1;
}
.message-area .waku{
	width:95%;
	max-width:1000px;
	margin: 0 auto 8rem;
	box-sizing:border-box;
	border: 2rem solid #fff;
	background:#fff;
	position:relative;
	padding: 8rem 0 3rem;
}
.message-area .waku .ph{
	width:200px;
	margin:0 auto;
	position:absolute;
	top: -7rem;
	left:50%;
	margin-left:-100px;
}
.message-area .waku .ph img{
	width: 100%;
  border-radius: 50%;
}
.message-area .waku p{
	width:fit-content;
	max-width: 70%;
	margin:0 auto;
	text-align:left;
	line-height:2;
}
.team{
	width:100%;
	margin:0 auto;
	padding:8rem 0;
	position:relative;
	background:#003e8c;
	box-sizing:border-box;
}

.team .title{
	position:absolute;
	top:-1.5rem;
	left:10%;
	width:clamp(300px, 32%, 400px);
	height:110px;
	background:#322b29;
	color:#fff;
	text-align:center;
	z-index:2;

	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;

	font-size:1.4rem;
	font-weight:bold;
	line-height:1.5;
	box-sizing:border-box;
	padding:1rem;
}

.team .title span{
	display:block;
	font-size: 0.85em;
	font-weight: 300;
	letter-spacing:0.05em;
	margin-bottom:0.25rem;
}

.team .box{
	display:flex;
	justify-content:space-between;
	align-items:stretch;
	flex-wrap:wrap;
	width:95%;
	max-width:1000px;
	margin:0 auto;
}

.left-bt,
.right-bt{
	width:48%;
	display:flex;
	justify-content:center;
	align-items:center;
	gap:1.5rem;
	box-sizing:border-box;
}

.left-bt{
	border-right:1px dotted #fff;
}

.left-bt .ph,
.right-bt .ph{
	width:clamp(120px, 15vw, 150px);
	aspect-ratio:1 / 1;
	border-radius:50%;
	overflow:hidden;
	flex-shrink:0;
}

.left-bt .ph img,
.right-bt .ph img{
	width:100%;
	height:100%;
	display:block;
	object-fit:cover;
	border-radius:50%;
}

.left-bt div p,
.right-bt div p{
	color:#fff;
	text-align:center;
	font-size:1.25em;
	margin:0 0 1rem;
	line-height:1.5;
}

.left-bt div .bt,
.right-bt div .bt{
	margin:0;
	text-align:center;
}

.left-bt div .bt a,
.right-bt div .bt a{
	display:inline-block;
	color:#003e8c;
	background:#fff;
	border-radius:25vh;
	padding: 0.25rem 2rem;
	font-size: 0.8em;
	text-decoration:none;
}

@media screen and (max-width:800px){

.main-ph{
	width:100%;
	padding-top:4rem;
	}
.ao-title{
	width:100%;
	height:70px;
	font-size:1.0rem;
	left:0;
}
.ao-title span{
	font-size:0.55em;
	}
.comment{
	font-size:1.1rem;
	margin-top:1rem;
	line-height:1.6;
}
.shosai-area .leftbox,.shosai-area .rightbox{
	width:100%;
}
.shosai-area{
	margin:0 auto 5rem;
}
.shosai-area .leftbox{
	margin:0 0 2rem;
}
.riyu-area{
	padding:8rem 2rem;
}
.riyu-area .box-b p,
.riyu-area .box-a p{
	max-width: 100%;
}
.riyu-area .phbox div{
	border:5px solid #fff;
}
.left-bt div .bt,.right-bt div .bt{
	color:#fff;
	margin:1rem;
}
.message-area .waku p{
	max-width: 100%;
}
.team{
		padding:7rem 0 6rem;
	}

	.team .title{
		left:5%;
		width:clamp(260px, 55vw, 360px);
		height:95px;
		font-size:1.2rem;
	}

	.team .box{
		width:92%;
	}

	.left-bt,
	.right-bt{
		width:50%;
		gap:1rem;
		padding:0 1rem;
	}

	.left-bt .ph,
	.right-bt .ph{
		width:clamp(100px, 18vw, 130px);
	}

	.left-bt div p,
	.right-bt div p{
		font-size:1.1em;
	}

	.left-bt div .bt a,
	.right-bt div .bt a{
		padding:0.45rem 1.5rem;
		font-size:0.75em;
	}
}

@media screen and (max-width:700px){

	.team{
		padding:6rem 0 4rem;
	}

	.team .title{
		top:-1.2rem;
		left:50%;
		transform:translateX(-50%);
		width:85%;
		height:85px;
		font-size:1.05rem;
	}

	.team .box{
		width:94%;
		display:flex;
	}

	.left-bt,
	.right-bt{
		width:50%;
		display:flex;
		flex-direction:column;
		justify-content:flex-start;
		align-items:center;
		gap:1rem;
		padding:0 0.75rem;
	}

	.left-bt{
		border-right:1px dotted #fff;
		border-bottom:none;
	}
	.left-bt .ph,
	.right-bt .ph{
		width:clamp(95px, 30vw, 130px);
	}
	.left-bt div p,
	.right-bt div p{
		font-size:0.95em;
		margin:0 0 0.8rem;
	}
.left-bt div .bt,.right-bt div .bt{
	margin:0;
}
	.left-bt div .bt a,
	.right-bt div .bt a{
		padding:0.25rem 1.2rem;
		font-size:0.72em;
	}

}
/* ==================================================
  実績
================================================== */
/* タブ表示 */
.works-box {
  width: 95%;
  max-width: 1200px;
  margin: 0 auto;
  display: none;
}
.head-bg {
  width: 100%;
  min-height: 520px;
  background: url(../image/works/works-head-bg.jpg) no-repeat center center;
  background-size: cover;
  position: relative;
  margin: 0 0 5rem;
}

.head-bg h2 {
  position: absolute;
  top: 8%;
  left: 5%;
  margin: 0;
  font-size: clamp(1.4rem, 1.6vw, 2.4rem);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.12em;
  writing-mode: vertical-rl;
}

.head-bg h2 span {
  display: inline-block;
  background: #fff;
  padding: 1.2em 0.5em;
  margin: 0 0.5rem;
}

/* 1400px以上：大画面で固定 */
@media screen and (min-width: 1400px) {
  .head-bg {
    min-height: 560px;
  }
  .head-bg h2 {
    top: 60px;
    left: 70px;
    font-size: 2.2rem;
  }
.head-bg h2 span {
  margin: 0.1rem 0.5rem;
}

}

/* 800px以下 */
@media screen and (max-width: 800px) {
  .head-bg {
    min-height: 420px;
    margin-bottom: 4rem;
  }

  .head-bg h2 {
    top: 6%;
    left: 5%;
    font-size: clamp(1.3rem, 3vw, 2rem);
    line-height: 1.9;
  }

  .head-bg h2 span {
    padding: 1em 0.5em;
    margin: 0 0.4rem;
  }
}

/* 600px以下 */
@media screen and (max-width: 600px) {
  .head-bg {
    min-height: 320px;
    background-position: center center;
    margin-bottom: 3rem;
  }

  .head-bg h2 {
    top: 6%;
    left: 5%;
    font-size: 1.2rem;
    line-height: 1.8;
    letter-spacing: 0.08em;
  }

  .head-bg h2 span {
    padding: 0.9em 0.45em;
    margin: 0 0.3rem;
  }
}

.head-bg h2 {
    top: 6%;
    left: 5%;
    padding: 0.9em 0.5em;
    font-size: 1.2rem;
    line-height: 1.8;
    letter-spacing: 0.08em;
  }
/* ==========================================================================
   全体レイアウト・テキスト
   ========================================================================== */
.works-menu p {
  width: fit-content;
  max-width: 90%;
  margin: 0 auto;
  text-align: left;
  line-height: 2;
}

.works-menu h3 {
  color: #003e8c;
  padding: 1rem 0;
  display: flex;
  align-items: center;
}

/* 見出しの左側の青い縦線バグを修正 */
.works-menu h3::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 1.2em;
  background: #003e8c;
  margin-right: 0.5em;
}

/* ==========================================================================
   上部タブメニュー（4つのボタン）
   ========================================================================== */
.worksmenu-txt {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: stretch;
  gap: 10px; /* ボタン同士の隙間 */
  width: 95%;
  max-width: 600px;
  margin: 3rem auto;
  padding: 0;
  list-style: none;
}

/* 4つのタブが綺麗に均等に並ぶように修正 */
.worksmenu-txt li {
  flex: 1; 
  text-align: center;
}

.worksmenu-txt li a {
  display: block;
  background: #003e8c;
  color: #fff !important;
  padding: 1rem 0;
  border-radius: 25vh;
  font-size: 0.8em;
  text-decoration: none;
  transition: opacity 0.3s;
	cursor:pointer;
}

.worksmenu-txt li a:hover {
  opacity: 0.8;
}

/* ==========================================================================
   実績リスト（3カラム）
   ========================================================================== */
.works-box {
  display: none; 
}

.works-box.is-active {
  display: block;
}

.works-box ul {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: stretch;
  gap: 2%;
  margin: 1rem 0 3rem;
  padding: 0;
  list-style: none;
}
.works-box ul li {
  width: 32%; 
}
.works-box ul li a {
  text-decoration: none;
  color: inherit;
}

.works-box ul li .image {
  box-sizing: border-box;
  border: 10px solid #fff;
  margin: 0 0 1rem;
  box-shadow: 0 0 8px rgba(0,0,0,0.1); 
}

.works-box ul li img {
  width: 100%;
  height: auto;
  display: block;
}

.works-box ul li .title {
  line-height: 1.8;
  margin-bottom: 1rem;
  font-weight: bold;
}

.works-box ul li .nichiji {
  font-size: 0.8em;
  line-height: 1.5;
}

.works-box ul li .client {
  font-size: 0.8em;
  line-height: 1.5;
  color: #666;
}

/* ==========================================================================
   画像拡大モーダル
   ========================================================================== */
.img-modal {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.img-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.img-modal-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  cursor: pointer;
}

.img-modal-content {
  position: relative;
  z-index: 1000;
  max-width: 90%;
  max-height: 90%;
  transform: scale(0.95);
  transition: transform 0.3s ease;
}

.img-modal.is-open .img-modal-content {
  transform: scale(1);
}

.img-modal-content img {
  max-width: 100%;
  max-height: 90vh;
  object-fit: contain;
  display: block;
}

/* 閉じるボタン（×） */
.img-modal-close {
  position: absolute;
  top: -40px;
  right: 0;
  background: none;
  border: none;
  color: #fff;
  font-size: 40px;
  cursor: pointer;
  line-height: 1;
}

/* 800px以下：2列 */
@media screen and (max-width: 800px) {
  .works-box ul {
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .works-box ul li {
    width: 48%;
    margin-bottom: 30px;
  }
}

/* 600px以下：1列 */
@media screen and (max-width: 600px) {
  .works-box ul {
    display: block;
  }

  .works-box ul li {
    width: 100%;
    margin-bottom: 30px;
  }

  .works-box ul li:last-child {
    margin-bottom: 0;
  }
}

/* ==================================================
採用情報
================================================== */

.top-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 95%;
  max-width:1200px;
  margin: 0 auto 8rem;
	
}

.leftbox {
  width: 38%;
}

.leftbox h2 {
  margin: 0;
  font-size: clamp(1.3rem, 1.75vw, 2.0rem);
  margin-bottom:clamp(0.2rem,3vw,0.75rem);
  line-height: 1.8;
  font-weight:400;
}

.leftbox h2 span {
  display: block;
}

.rightbox {
  position: relative;
  width: 58%;
}

.rightbox .ph {
  position: relative;
  z-index: 2;
}

.rightbox .ph img {
  width: 100%;
  height: auto;
  display: block;
}

.rightbox .blue-obi {
  position: absolute;
  z-index: -1;
  top: 50%;
  right: 0%;
  transform: translate( 50%);
  width: 50vw;
  height: 60%;
  background: #003e8c;
}

.recruite-box{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 95%;
  max-width:1200px;
  margin: 0 auto;
  flex-wrap: nowrap;
}

.mainbox{
  width: 76%;
  background:#fff;
  border-radius:10px;
  box-sizing:border-box;
  padding:3rem 3rem;
}

.recruite-box .mainbox h2{
  font-size: clamp(1.3rem, 1.75vw, 2.0rem);
  margin-bottom:clamp(0.2rem,3vw,0.75rem);
  line-height: 1.3;
  font-weight:500;
  letter-spacing: 0.1rem;
}
.recruite-box .mainbox .minibox{
  margin-bottom:clamp(2.5rem,3vw,5rem);
}
.recruite-box .mainbox h3{
  color:#003e8c;
  padding:1rem 0 1rem;
}
.recruite-box .mainbox h3:before{
  content:"";
  background:#003e8c;
  border-left:4px solid #003e8c;
  margin:0 1em 0 0;
}

.recruite-box .mainbox dl.first{
  border-top:3px solid #003e8c;
  margin-top:1rem;
}

.recruite-box .mainbox dl{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  align-items:center;
  padding:1rem 0;
  border-bottom:1px solid #bfc0c0;
  position:relative;
}

.recruite-box .mainbox dl:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:30%;
  border-bottom:1px solid #003e8c;
  z-index:2;
}

.recruite-box .mainbox dl dt{
  width:30%;
  padding:0 0 0 1em;
  box-sizing:border-box;
  color:#003e8c;
}

.recruite-box .mainbox dl dd{
  width:70%;
  padding:0 0 0 1em;
  box-sizing:border-box;
}
.recruite-box .mainbox dl dd span{
  display:block;
  position: relative;
  padding:0 0 0 1em;
}

.recruite-box .mainbox dl dd span:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #003e8c;
  transform: translateY(-50%);
}
.side-manu{
  width: 18%;
  border-top:3px solid #003e8c;
  padding:1rem 0;
  box-sizing:border-box;
  position: sticky;
  top: 100px;
  height: max-content;
}
.side-manu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.side-manu ul li a {
  position: relative;
  display: inline-block;
  padding-left: 18px;
  color:#aaabab!important;
}

.side-manu ul li a,
.side-manu ul li a:before {
  transition: 0.3s;
}

.side-manu ul li a:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #aaabab;
  transform: translateY(-50%);
}

.side-manu ul li a:visited {
  color: #aaabab;
}

.side-manu ul li a:hover {
  color: #003e8c!important;
  opacity: 1;
}

.side-manu ul li a:hover:before {
  background: #003e8c;
}

.toi-area{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 95%;
  max-width:1200px;
  margin:0 auto 8rem;
}

.toi-area .hako{
  width: 76%;
  box-sizing: border-box;
  padding: 3rem 3rem;
  background:#f0f0f0;
}

.toi-area .hako img{
  width:100%;
  max-width: 80px;
}

.toi-area .hako h2{
  color:#003e8c;
}

.toi-area .hako .ichiran{
  border-left:3px solid #003e8c;
  margin:1.5rem 0;
}

.toi-area .hako .ichiran p{
  color:#003e8c;
  padding:0.5rem 0;
  width:90%;
  max-width:900px;
  margin:0 auto;
}

.toi-area .hako dl{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  align-items:center;
  padding: 0.5rem 0 1.5rem;
  color:#003e8c;
  width:90%;
  max-width:900px;
  margin:0 auto;
}

.toi-area .hako dl.first{
  border-bottom:1px dotted #003e8c;
  padding: 0.5rem 0 2rem;
  margin: 0 auto 1rem;
}

.toi-area .hako dl dt{
  width: 15%;
  box-sizing:border-box;
}

.toi-area .hako dl dd{
  width: 85%;
  box-sizing:border-box;
  font-size:1.5em;
}

.toi-area .hako dl.first dd {
  width: 85%;
  box-sizing: border-box;
  font-size: clamp(2.2rem, 6vw, 3.5rem);
  font-weight: 700;
}

.toi-area .hako dl.first dd span {
  display: block;
  font-size: clamp(0.85rem, 2vw, 1.05rem);
  font-weight: 500;
  padding-top: clamp(0.5rem, 2vw, 1rem);
}

.toi-area .hako dl.last dd a{
  box-sizing:border-box;
  font-size:1.05em;
  font-weight:700;
  color:#003e8c;
  display:block;
  width:100%;
  max-width:400px;
  text-align: center;
  padding:1rem 0;
  background:#f7f8f8;
  border:1px solid #fff;
  border-radius:25vh;
  position:relative;
  box-shadow: 1px 1px 15px 1px #00000024;
}

.toi-area .hako dl.last dd a:after{
  content:">";
  color:#003e8c;
  position:absolute;
  right:5%;
}

.p-1{
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (max-width: 800px) {
  .leftbox {
    width: 36%;
  }

  .rightbox {
    width: 60%;
  }
	
.rightbox .blue-obi {
   width: 100%;
  }
 .recruite-box {
    width: 92%;
    display: block;
  }

  .mainbox {
    width: 100%;
    padding: 2rem 1.5rem;
  }

  .side-manu {
    width: 100%;
    margin-top: 2rem;
  }

  .side-manu ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
  }

  .rightbox .blue-obi {
    width: 70vw;
    height: 45%;
    right: 0;
    transform: translateX(35%);
  }
.toi-area {
	width:92%;
    margin: 0 auto 6rem;
  }
  .toi-area .hako {
    width: 100%;
    padding: 2rem 1.5rem;
  }
  .toi-area .hako dl dt {
    width: 20%;
  }

  .toi-area .hako dl dd,
  .toi-area .hako dl.first dd {
    width: 80%;
  }

  .toi-area .hako dl.first dd {
    font-size: 2.8em;
  }

  .toi-area .hako dl dd {
    font-size: 1.3em;
  }

}


@media screen and (max-width: 600px) {
  .top-box {
    display: block;
  }

  .leftbox,
  .rightbox {
    width: 100%;
  }

  .leftbox {
    margin-bottom: 2rem;
  }
 .recruite-box {
    width: 90%;
  }

  .mainbox {
    width: 100%;
    padding: 1.5rem 1rem;
    border-radius: 8px;
  }

  .recruite-box .mainbox h2 {
    font-size: 1.3rem;
    line-height: 1.5;
    letter-spacing: 0.05rem;
  }

  .recruite-box .mainbox h3 {
    padding: 0.75rem 0;
  }

  .recruite-box .mainbox dl {
    display: block;
    padding: 1rem 0;
  }

  .recruite-box .mainbox dl:after {
    width: 100%;
  }

  .recruite-box .mainbox dl dt {
    width: 100%;
    padding: 0 0 0.4rem;
    font-weight: 500;
  }

  .recruite-box .mainbox dl dd {
    width: 100%;
    padding: 0;
  }

  .side-manu {
    width: 100%;
    padding: 1rem 0 0;
  }

  .side-manu ul {
    display: block;
  }

  .side-manu ul li {
    margin-bottom: 0.6rem;
  }

  .side-manu ul li a {
    display: block;
    padding-left: 18px;
  }

  .rightbox .blue-obi {
    width: 85vw;
    height:50%;
    top: 60%;
    right: 0;
    transform: translateX(45%);
  }
 .toi-area {
	 width: 90%;
	 margin: 0 auto 4rem;
	 }

  .toi-area .hako {
	  display:block;
	  width: 100%;
	  margin:0 auto;
	  padding: 1.5rem 1rem;
	 }

  .toi-area .hako img {
    max-width: 60px;
	  
  }

  .toi-area .hako h2 {
    font-size: 1.3rem;
    line-height: 1.5;
  }

  .toi-area .hako .ichiran {
    margin: 1rem 0;
  }

  .toi-area .hako .ichiran p {
    padding: 0.4rem 0 0.4rem 1rem;
    box-sizing: border-box;
  }

  .toi-area .hako dl {
    display: block;
    padding: 0.5rem 0 1.2rem;
  }

  .toi-area .hako dl.first {
    padding: 0.5rem 0 2rem;
    margin: 0 auto 1rem;
  }

  .toi-area .hako dl dt {
    width: 100%;
    margin:0 auto 1rem;
	  text-align:center;
  }

  .toi-area .hako dl dd,
  .toi-area .hako dl.first dd {
    width: 100%;
	  
  }

  .toi-area .hako dl dd {
    font-size: 1.1em;
  }

  .toi-area .hako dl.first dd {
    font-size: 1.5em;
	  text-align:center;
    line-height: 1.2;
  }
.toi-area .hako dl.first dd a{
    color:#003e8c;
  }
  .toi-area .hako dl.first dd span {
    font-size: 0.8em;
    line-height: 1.5;
    padding-top: 0.6rem;
  }

  .toi-area .hako dl dd a {
    max-width: 100%;
    font-size: 1em;
    padding: 0.9rem 2rem 0.9rem 1rem;
  }

  .toi-area .hako dl dd a:after {
    right: 1rem;
  }
.toi-area .hako dl.last dd a{
	box-sizing:border-box;
	font-size:0.85em;
	padding:0.5rem 0;
}
}
/* ==================================================
お問い合わせ
================================================== */
.call-area#content1{
	margin:0 auto 5rem;
}
.email-area#content2{
	margin:0 auto 8rem;
}
.call-area .hako,.email-area .hako{
	width:95%;
	max-width:900px;
	margin:0 auto 0;
	text-align:center;
	background:#fff;
	padding: 3rem;
	box-shadow: 0 0 8px #80808040;
	box-sizing:border-box;
}

.email-area .hako .ph,
.call-area .hako .ph{
	width:100%;
	max-width:60px;
	margin:0 auto 1rem;
}
.email-area .hako .ph img,
.call-area .hako .ph img{
	width:100%;
}

.email-area .hako p.text,
.call-area .hako p{
	color: #003e8c;
	text-align: center;
}
.call-area .hako p.number{
	text-align: center;
    color: #003e8c;
    display: block;
    margin: 1rem auto 0;
    font-size: clamp(1.6em, 7vw, 2.5em);
    font-weight: bold;
    line-height: 1.4;
}
.call-area .hako p span{
	display:block;
	font-size: 0.4em;
	padding:1rem 0 0 0;
}
#content1.thanks-area{
	width:90%;
	max-width:1200px;
	margin:5rem auto;
}
@media screen and (max-width: 800px) {
	.call-area .hako,
	.email-area .hako {
		width: 92%;
		padding: 2.5rem 2rem;
	}
}
@media screen and (max-width: 600px) {
	.call-area .hako,
	.email-area .hako {
		width: 90%;
		padding: 2rem 1.25rem;
	}
}
.recruit {
    width: 100%;
    overflow: hidden;
}

.recruit .main h2 {
    font-size: 1.5em;
    text-align: center;
    margin: 0px 0px 3rem;
}

.recruit .main {
    position: relative;
    background: rgb(242, 241, 234);
    margin-top: 15rem;
    padding: 3rem 0px 5rem;
}

.recruit .main::before {
    content: "";
    position: absolute;
    width: 160vw;
    height: 40vw;
    left: 50%;
    transform: translateX(-50%);
    top: -15vw;
    background: rgb(242, 241, 234);
    border-radius: 50%;
    z-index: -1;
}

@media (min-width: 1200px) {
    .recruit .main::before {
        width: 4000px;
        height: 560px;
        top: -150px;
    }

    .recruit .main {
        position: relative;
        background: rgb(242, 241, 234);
        margin: 18rem 0px 0px;
        padding: 3rem 0px 5rem;
    }
}
/* ==================================================
個人情報保護方針
================================================== */
#policy-page #page-contents{
	position:relative;
	width:100%;
}

#policy-page .inner-box{
	width: 90%;
	max-width:1200px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin:0 auto;
}
.pv-area{
	margin:5rem auto;
	font-size:0.95rem;
}
.pv-area h2{
	font-size:1.5rem;
	margin:5rem 0 2rem;
	position:relative;
	padding-left:1.8rem;
}
.pv-area h2:before{
	content:'';
	width:1rem;
	height:1rem;
	background:#003e8c;
	position:absolute;
	border-radius:50%;
	left:0;
	top:50%;
	margin-top:-0.3rem;
	transform: skewY(-20deg);
}
.pv-area h3{
	font-size:1.1rem;
	margin:3rem 0 2rem;
	background:#efefef;
	padding:1rem 1.5rem;
	text-indent: -1.3rem; 
    padding-left: 2.5rem;
}
.pv-area ul {
  margin:1rem 0;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding:1rem;
}
.pv-area li {
  list-style-type: none;
  position: relative;
  padding-left: 1em;
}

.pv-area li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.9em;
  width: 0.3em;
  height: 0.3em;
  background-color: black;
  border-radius: 50%;
}

.pv-table {
    display: grid;
    grid-template-columns: 10% 40% 50%;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    width: 100%;
    font-size: 0.9rem;
	line-height:1.6;
	margin:2rem 0;
}
.pv-table .header,
.pv-table .row {
    display: contents;
}
.pv-table div {
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 1rem ;
}
.pv-table .header div {
    background-color: #f0f0f0;
    text-align: center;
}
.pv-table .cell-center {
    text-align: center;
	    padding: 1rem 0;

}
.pv-area .madoguchi{
	border:1px solid #ccc;
	padding:2rem 2rem;
}
.pv-area .madoguchi .title{
	font-weight:600;
	margin-bottom:0.5rem;
}