/*
 * Theme Name: ブリッジ様テーマ
 * Author: 長野システム開発株式会社
 * Author URI: https://naganosd.com
 * Version: 1.0
 */

@charset "UTF-8";
/* CSS Document */
/* clearfix */
.clearfix:after,
.clearfix:before {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}

/*-----------------common------------------*/
body{
	font-family: 'Noto Sans JP';
	color: #333333;
	-webkit-text-size-adjust: 100%;
}
.wrapper{
	overflow: hidden;
	width: 100%;
}
img {
	max-width:100%;
	height:auto;
	border-style:none;
}
a {
	text-decoration: none;
	color: #333333;
}
strong{font-weight: bold;}
.border:after{
	content: "";
	width: 60px;
	height: 6px;
	background-color: #d3c597;
	border-radius: 3px;
}
/*-----ヘッダー-----*/
.sub_header_wrap{
   width: 100%;
   background-color: #fff;
   position: fixed;
	top: 0;
	z-index: 99;
}
.sub_header{
	width: 100%;
	height: 68px;
	max-width: 1365px;
	margin:0 auto;
	display: flex;
	
}
.sub_header a{
	color: #333333;
}
.sub_header a:hover{
	color: #08bde4;
}
.sub_logo{
	display:inline-block;
	height: 80px;
	line-height: 80px;
	margin-right: auto;
}
.sub_logo img{
	vertical-align: middle;
}
.nav-button {
  display: none;
}
.sub_nav ul{
	max-width: 718px;
	height: 80px;
	box-sizing: border-box;
	float: right;
}
.sub_nav li {
    height: 80px;
	line-height: 80px;
	display: inline-block;
	font-size: 16px;
	font-weight: bold;
	margin-left: 50px;
  }
.current a{
	color: #08bde4;
}
/*-----フッター----*/
.footbox01 {
	width: 100%;
	height: 280px;
	border-top: solid #d0d1ce 1px;
}
.btn_wrap {
	max-width: 980px;
	width: 100;
	margin: 0 auto;	
}
.contact_btnbox {
	width: 50%;
	height: 280px;
	border-right: 1px solid #d0d1ce;
	box-sizing: border-box;
	position: relative;
	float: left;
}
.recruit_btnbox {
	width: 50%;
	height: 280px;
	position: relative;
	float:right;
}
.recruit_btnbox .btn03{
	position: absolute;
	right: 0;
}
.btn03{
	width: 385px;
	height: 120px;
	display:flex;
	align-items: center;
	padding-left: 59px;
	box-sizing: border-box;
	background-image: url( "images/link_arrow_g.png");
	background-position: 244px 53px;
	background-repeat: no-repeat;
	border: 1px solid #d0d1ce;
	color: #333333;
	position: absolute;
	top:50%;
	transform: translateY(-50%);
}
.btn03:hover{
	background-position: 284px 53px;
	transition: all .2s;
}
.btn03 p{
	text-align: center;
	font-size: 24px;
}
.btn03 p span{
	font-size: 18px;
	display: block;
	margin-top: 13px;
}

.footbox02 {
	width: 100%;
	height: 415px;
	background-color: #193249;
}
.footbox02 a{
	color: #fff;
}
.footbox02 a:hover{
	color: #08bde4;
}
.foot_inner {
	max-width: 980px;
	width: 100%;
	margin:0 auto;
	padding: 91px 0 19px 0;
	position: relative;
	display: flex;
}

.foot_logo {
	width: 320px;
	min-width: 320px;
	height: 72px;
	display: flex;
	align-items: center;
	vertical-align: middle;
	object-fit: contain;
}
.foot_inner ul{
	width: 100%;
	display: flex;
	justify-content: end;
	flex-wrap: wrap;
	vertical-align:top;
	min-height: 72px;
	box-sizing: border-box;
	text-align: right;
}
.foot_inner ul li{
	height: 72px;
	line-height: 72px;
	display: inline-block;
	color: #FFF;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.06em;
	margin-left:6.23%;
}
.sub_menu {
	max-width: 980px;
	width: 100%;
	text-align: right;
	margin: 0 auto 38px;
	color: #fff;
	font-size: 14px;
	letter-spacing: 0.03em;
}
.sub_menu ul{
	display: flex;
	justify-content: flex-end;
}
.sub_menu ul li{
	padding: 0 27px;
	border-right: 1px solid #fff;
}
.sub_menu ul li:last-child{
	padding-right: 0;
	border-right: none;
}
.copy{
	max-width: 980px;
	width: 100%;
	text-align: right;
	margin: 0 auto;
	font-size: 13px;
	color: #ffffff;
}

.to_top {
	width: 80px;
	height: 80px;
	background-color: #193249;
	position: absolute;
	top:-80px;
	right: -193px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.to_top img {
	vertical-align: middle;
}
/*-------------------トップページ------------------*/
/*オープニング*/
/*
.openwrap{
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  z-index: 99;
}
.open {
  display:inline-block;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  background-image: url("images/logo_opening.png");
  background-repeat: no-repeat;
  background-size: 691px;
  background-position: center center;
  background-color:#193249;
}
.open02 {
  opacity: 0;
  width: 100vw;
  height: 100vh;
  color: #ffF;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #193249;
  border-top: 80px solid #9d9f11;
  box-sizing: border-box;
}
*/

/*keyframesの設定*/
/*文字が消えている状態から現れるアニメーション*/
/*
@keyframes fadeIn {
    0% {
      opacity: 1;
		transform: translateY(-80px);
    }
    100% {
      opacity: 1;
		transform: translateY(100vh);
    }
  }

/*はじめにブロックを伸ばすアニメーション*/

/*
@keyframes secondaryImageOverlayIn {
    0% {
       opacity: 1;
		height: 0;
    }
    100% {
      opacity: 1;
		height: 100vh;
    }
  }

/*スライダー*/
.ZoomSlide{
  width:100%;
  height:780px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;          /* ← 背景に戻す */
  overflow: hidden;
  background-color: #000;
}


.ZoomSlide .SImg{
  width: 100%;
  height: 780px;
  position: absolute;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  opacity: 0;
}

/* 1枚目：即表示（0%から表示） */
.ZoomSlide .SImg:nth-child(1){
  background-image: url("images/top-image.jpg");
  animation: ImgAnimeFirst 18s linear infinite 0s;
}

/* 2枚目・3枚目 */
.ZoomSlide .SImg:nth-child(2){
  background-image: url("images/top_image02.jpg");
  animation: ImgAnime 18s linear infinite 0s;
  animation-delay: 6s;
}
.ZoomSlide .SImg:nth-child(3){
  background-image: url("images/top_image03.jpg");
  animation: ImgAnime 18s linear infinite 0s;
  animation-delay: 12s;
}

/* 1枚目専用：開始直後から見せる */
@keyframes ImgAnimeFirst { 
  0%   { opacity: 1; transform: scale(1.1); }
  12.5%{ opacity: 1; }
  20%  { opacity: 1; }
  27.5%{ opacity: 1; }
  40%  { opacity: 0; transform: scale(1.0); }
  100% { opacity: 0; transform: scale(1.0); }
}

/* 2枚目以降用：これを1個だけ残す（ImgAnimeは重複させない） */
@keyframes ImgAnime { 
  0%   { opacity: 0; transform: scale(1.1); }
  12.5%{ opacity: 1; }
  20%  { opacity: 1; }
  27.5%{ opacity: 1; }
  40%  { opacity: 0; transform: scale(1.0); }
  100% { opacity: 0; transform: scale(1.0); }
}

/* ↓↓↓ これは削除 or コメントアウトしてください（重複定義で後勝ちになる） */
/*
@keyframes ImgAnime { 
  0% {
    opacity: 0;
    transform: scale(1.1);
    animation-timing-function: ease-in;
  }
  12.5% {
    opacity: 1;
    animation-timing-function: ease-in-out;
  }
  20% { opacity: 1; }
  27.5% { opacity: 1; }
  40% {
    opacity: 0;
    transform: scale(1.0);
  }
  100% {
    opacity: 0;
    transform: scale(1.0);
  }
}
*/

.top_catch_wrap{
	display: block;          /* ← none を block に変更 */
	width: 100vw;
	height: 780px;
	padding-top: 46px;
	box-sizing: border-box;
	position: relative;
	z-index: 10;
}

.top_img01{
	width: 100vw;
	height: 100%;
	position: absolute;
	top: 0;
	z-index: -1;
}
.head_wrap{
	z-index: 9999;
	width: 100%;
	height: 68px;
	position: fixed;
	left: 0;
	right: 0;
	top: 46px;
}

/* トップヘッダー：初期からスクロール後の状態に固定 */
.head_wrap{
  top: 0 !important;
}

.head_wrap.chenge{
  transition: none !important;
  transition-delay: 0s !important;
}

.head_wrap.chenge img{
  transition: none !important;
}

.top_header{
	width: 100%;
	height: 68px;
	max-width: 1365px;
	margin:0 auto;
	display: flex;
	align-items: center;
	
}
.chenge{
    background-color: #fff;
	transition-duration: 1s;
	transition-delay: 1s;
	top: 0;
}
.chenge img{
   width: 70%;
   transition-duration: 1s;
}
.top_header a{
	color: #333333;
}
.top_header a:hover{
	color: #08bde4;
}
.top_logo{
	/*
	display:inline-block;
	vertical-align: middle;
	margin-right: 20.73%;
	margin-left: 3.07%;
*/
	display:inline-block;
	height: 80px;
	line-height: 80px;
	margin-right: auto;
} 
.nav-button {
  display: none;
}
.nav ul{
	max-width: 718px;
	height: 68px;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: 0;
}
.nav li {
    height: 68px;
	line-height: 68px;
	display: inline-block;
	font-size: 16px;
	font-weight: bold;
	margin-right: 50px;
  }

.nav-wrap.show {
  display: block;
}
.nav-wrap.close {
  display: none;
}
.top_catch{
	width:830px;
	margin: 123px auto 0;
	font-size: 0;
}
.curten {
  display:inline-block;
  overflow:hidden;
  position:relative;
  height: 125px;
  margin-bottom: 4px;
}
.curten:after{  
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color:#071a33;
}
.curten p {
  display:inline-block;
  font-size: 72px;
  padding: 0 54px 0 54px;
  line-height: 125px;
  height: 125px;
  color: #fff;
}
.curten p span{
	font-size: 63.5px; 
}
/* .c01:after{
	animation:layin 0.5s 0.5s cubic-bezier(.77,0,.175,1),
            layout 0.5s 1s cubic-bezier(.77,0,.175,1);
  animation-fill-mode: both;
} */
.c01 p{
	background-color: rgba(7, 26, 51, 0.65);
	/* animation:fadein 0.1s 1s;
	animation-fill-mode: both; */
}
/* .c02:after{
	animation:layin 0.5s 1.3s cubic-bezier(.77,0,.175,1),
              layout 0.5s 1.8s cubic-bezier(.77,0,.175,1);
    animation-fill-mode: both;
} */
.c02 p{
	background-color: #071a33;
	/* animation:fadein 0.1s 1.8s; 
    animation-fill-mode: both; */
}
/* .c03:after{
	animation:layin 0.5s 2.1s cubic-bezier(.77,0,.175,1),
              layout 0.5s 2.6s cubic-bezier(.77,0,.175,1);
    animation-fill-mode: both;
} */
.c03 p{
	background-color: rgba(7, 26, 51, 0.65);
	/* animation:fadein 0.1s 2.6s; 
    animation-fill-mode: both; */
}
/* .c04:after{
	animation:layin 0.5s 2.9s cubic-bezier(.77,0,.175,1),
              layout 0.5s 3.4s cubic-bezier(.77,0,.175,1);
    animation-fill-mode: both;
} */
.c04 p{
	background-color: #071a33;
	/* animation:fadein 0.1s 3.4s; 
    animation-fill-mode: both; */
}
.top_catch div:nth-child(2){
	margin-bottom: 26px;
}
@keyframes fadein {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
@keyframes layin {
    0% {
      width: 0;
    }
    100% {
      width:  100%;
    }
  }
  @keyframes layout {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(102%);
    }
  }

.topics{
	background-color: #193249;
	height: 50px;
	width: 100%;
	border-bottom: 6px solid #16c9e4;
}
.topics a{
	color: #87bcc4;
}
.topics dl{
	margin: 0 auto;
	max-width: 980px;
	width: 100%;
	height: 50px;
    display: flex;
	align-items: center;
}
.topics dl dt{
	color: #87bcc4;
	padding-left: 40px;
	margin-right:1em;
	position: relative;
}
.topics dl dt:before{
	width: 24px;
	height: 24px;
	content: "";
	background: url("images/info_icon.png")no-repeat center center;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.top_content01{
	width: 100%;	
}
.box1{
	max-width: 980px;
	width: 100%;
	margin: 0 auto 173px;
	padding: 75px 0 0 0;
	position: relative;
}
.box1 h2{
	font-size: 52px;
	position: relative;
	display: inline-block;
	margin-bottom: 134px;
}
.box1 h2:after{
	content: "Vision";
	color: #baa44d;
	font-size: 28px;
	font-weight: 500;
	position: absolute;
	bottom: -48px;
	right:0;
}
.fade_up_top{
    opacity: 0;
	transform: translate(0px,100px); 
	transition-duration: 1.5s;
	transition-delay: 2s;
}

.box1 h3{
	font-size: 36px;
	font-weight: 400;
	line-height: 56px;
	position: relative;
	margin-bottom: 43px;
}
.box1 h3:after{
	position: absolute;
	bottom: -23px;
	left: 0;
}
.top_text {
	max-width: 980px;
	width: 100%;
	margin: 0 auto;
	padding-top: 37px;
	box-sizing: border-box;
	position: relative;
}
.top_text p {
	font-size: 18px;
	line-height: 30px;
}
.vision_text{
	max-width: 980px;
	width: 100%;
	height: 300px;
	margin: 0 auto;
	padding-top: 37px;
	box-sizing: border-box;
	position: relative;
}
.vision_text:after{
	content: "";
	width: 100vw;
	height: 300px;
	background-color: #f5f2e4;
	position: absolute;
	right: -149px;
	top: 0;
	z-index: -1;
}
.vision_text p{
	width: 46.53%;
	height: 168px;
	font-size: 18px;
	line-height: 30px;
}
.vision_image {
	position: absolute;
	right: -98px;
	top:-132px;
  width: 570px;
}

/*------カーテンアニメーション画像共通--------*/
/* === カーテンアニメーション画像 共通：停止（表示は維持） === */
.block .curtain,
.block .curtain:before,
.block .curtain:after{
  display: none !important;   /* カーテン自体を消す */
}

/* .active が付かなくても画像を表示 */
.block img{
  opacity: 1 !important;
  transition: none !important;
}

/* 念のため：active時の指定も無効化 */
.block.active img{
  opacity: 1 !important;
  transition: none !important;
}
.block.active .curtain,
.block.active .curtain:before,
.block.active .curtain:after{
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/*---------------カーテンここまで----------*/


.block.active .vision_img{
	box-shadow: 1px 3px 10px 0px rgba(0, 0, 0, 0.25);
}
.vision_img{
	opacity: 0;
}
.btn_box01{
	position: absolute;
	bottom:-23px;
	left:354px;
}
.btn01{
	width: 290px;
	height: 70px;
	display:flex;
	align-items: center;
	padding-left: 60px;
	box-sizing: border-box;
	background-image: url("images/link_arrow.png");
	background-position: 206px 29px;
	background-repeat: no-repeat;
	background-color: #413a47;
	color: #fff;
	font-size: 20.65px;
	
}
.btn01:hover{
	background-position: 232px 29px;
	transition: all .2s;
}
.box2{
	max-width: 980px;
	width: 100%;
	margin: 0 auto 186px;
}
.box2 h2{
	text-align: right;
	font-size: 52px;
	position: relative;
	margin-bottom: 133px;
}
.box2 h2:after{
	content: "Service";
	color: #baa44d;
	font-size: 28px;
	font-weight: 500;
	position: absolute;
	bottom: -48px;
	right:0;
}
.box2 h3{
	text-align: right;
	font-size: 36px;
	font-weight: 400;
	line-height: 56px;
	position: relative;
	margin-bottom: 43px;
}
.box2 h3:after{
	position: absolute;
	bottom: -23px;
	right: 0;
}
.service_text{
	max-width: 980px;
	width: 100%;
	height: 425px;
	margin: 0 auto;
	padding-top: 37px;
	box-sizing: border-box;
	position: relative;
}
.service_text:after{
	content: "";
	width: 100vw;
	height: 425px;
	background-color: #f5f2e4;
	position: absolute;
	left: 492px;
	top: 0;
	z-index: -1;
}
.service_text p{
	width: 404px;
	height: 228px;
	font-size: 18px;
	line-height: 30px;
	margin-right: 0;
	margin-left: auto;
}

.btn_box02{
	position: absolute;
	bottom:-23px;
	right:0;
}
.img_bg01{
	width: 960px;
	height: 680px;
	background-color: #193249;
	position: absolute;
	top: -219px;
	left: -468px;
	z-index: -1;
}
.service_flow{
	height: 536px;
	background-color: #fff;
	position: absolute;
	top:-219px;
	left:-173px; 
	display: flex;
	transition-delay: 1s;
	
}
.flow_box{
	font-size: 36px;
	width: 210px;
	height: 134px;
	background-color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-flow: column;
	position: relative;
}
.flow_box span {
	display: block;
	font-size: 24px;
	margin-top: 14px;
}
.flow_box:after{
	content: "";
	width: 60px;
	height: 6px;
	background-color: #d3c597;
	border-radius: 3px;
	position: absolute;
	bottom: -3px;
	right: 0;
	left: 0;
	margin: 0 auto;
	z-index: 1;
	
}
.flow_box:last-child:after{
	background-color: transparent;
}
.box3 {
	max-width: 980px;
	width: 100%;
	margin: 0 auto 148px;
}

.box3 h2 {
	font-size: 52px;
	position: relative;
	display: inline-block;
	margin-bottom: 134px;
}
.box3 h2:after{
	content: "Factory";
	color: #baa44d;
	font-size: 28px;
	font-weight: 500;
	position: absolute;
	bottom: -48px;
	right:0;
}
.box3 h3{
	font-size: 28px;
	line-height: 56px;
	position: relative;
	margin-bottom: 28px;
}
.box3 h3:after{
	position: absolute;
	bottom: -23px;
	left: 0;
}
.box4{
	max-width: 980px;
	width: 100%;
	margin: 0 auto 28px;
}
.box4 h2{
	text-align: right;
	font-size: 52px;
	position: relative;
	margin-bottom: 82px;
}
.box4 h2 span{
	display: block;
	margin-bottom: 17px;
}
.our-values_text{
	max-width: 980px;
	width: 100%;
	height: 525px;
	margin: 0 auto;
	padding-top: 37px;
	box-sizing: border-box;
	position: relative;
}
.our-values_text:after{
	content: "";
	width: 100vw;
	height: 525px;
	background-color: #f5f2e4;
	position: absolute;
	left: 492px;
	top: 0;
	z-index: -1;
}
.our-values_text p{
	width: 404px;
	font-size: 18px;
	line-height: 30px;
	margin: 18px 0 28px auto;
}
.our-values_text h3{
	width: 404px;
	font-size: 28px;
	line-height: 30px;
	margin-right: 0;
	margin-left: auto;
}

.work_bg {
	width: 100%;
	height: 470px;
	position: relative;
}

.work_bg02 {
	height: 144px;
	margin: 0 -500%;
	padding: 0 500%;
	background-color: #f5f2e4;
	position: relative;
	z-index: -1;
}

.workimg01 {
	width: 100%;
	height: 496px;
	position: absolute;
	top: 0;
	left: -468px;
}
.block.active img{
	opacity: 1;
	transition-delay: 1s;
	transition-duration: 3.5s;
}
.workimg01 img{
	opacity: 0;
}
.workimg02 {
	height: 471px;
	position: absolute;
	top:-23px;
	right: -193px;
}
.workimg02 img{
	opacity: 0;
}
.workimg02.active img{
	transition-delay: 2s;
	transition-duration: 3.5s;
}
.workimg02.active .curtain{
	width: 0;
  transition: width 1s cubic-bezier(.77,0,.175,1)1.8s;
}
.workimg02.active .curtain:before {
 width: 100%;
  transition: width 1s cubic-bezier(.77,0,.175,1) 1s;
}
.workimg02.active .curtain:after {
  width: 100%;
  transition: width 1s cubic-bezier(.77,0,.175,1) 1.4s;
}
.img_bg02 {
	width: 960px;
	height: 787px;
	background-color: #193249;
	position: absolute;
	top: -221px;
	right: -470px;
	padding: 46px 56px;
	box-sizing: border-box;
}

.img_bg02 p {
	width: 571px;
	color: #ffffff;
	font-size: 18px;
	line-height: 30px;
}

.btn_box03 {
	position: absolute;
	top: 472px;
	z-index: 1;
}

.topic_bg {
	width: 100%;
	height: 405px;
	background: url( "images/news_bg.jpg") no-repeat;
	background-size: cover;
	margin-bottom: 93px;
}
/*お知らせページと共通*/
.topic_box {
	max-width: 980px;
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
}
.topic_box li {
	width: 33.33333333333333333%;
	height: 405px;
	position: relative;
}
.topic_box li span{
	display: block;
	width: 100%;
	height: 405px;
	background-color: #fff;
	position: absolute;
	top: 0;
	z-index: 3;
}
.topic_box li:hover{
	transform: scale(1.1);
	transition-duration: 0.3s;
	box-shadow: 0px 9px 13px 0px rgba(0, 0, 0, 0.15);
	z-index: 10;
}
.topic_box li img{
	width: 100%;
}
.news_text {
	padding: 27px 25px;
	font-size: 20px;
	
}
.date{
	position: absolute;
	bottom: 36px;
	right: 25px;
	font-size: 16px;
}

.news_h2 {
	font-size: 52px;
	line-height: 52px;
	text-align: center;
	margin-bottom: 142px;
	padding-top: 100px;
	position: relative;
}
.news_h2:before{
	content: "News";
	color: #baa44d;
	font-size: 28px;
	font-weight: 500;
	position: absolute;
	bottom:-52px;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.news_h2:after{
	position: absolute;
	bottom:-69px;
	left: 0;
	right: 0;
	margin: 0 auto;
}

.btn02 {
	margin: 0 auto;
	width: 250px;
	height: 70px;
	display:flex;
	align-items: center;
	padding-left: 35px;
	box-sizing: border-box;
	background-image: url("images/link_arrow.png");
	background-position: 166px 29px;
	background-repeat: no-repeat;
	background-color: #413a47;
	color: #fff;
	border-radius: 4px;
	font-size: 22px;
	margin-bottom: 150px;
}
.btn02:hover{
	background-position: 192px 29px;
	transition: all .2s;
}
.btn02 span{
	font-size: 20px;
}
/*--------------------------下層ページ共通-------------------------------*/
.main_img {
	width: 100%;
	height: 400px;
	/*margin: 80px auto 0;*/
	margin: auto 0;
}
.sub_catch {
	max-width: 980px;
	height: 400px;
	margin: 0 auto;
	position: relative;
}
/*タイトルアニメーション01*/
.curtain_title {
  overflow:hidden;
  width: 365px;
  height: 134px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

/* === タイトルアニメーション01を無効化（即表示） === */
.curtain_title:before,
.curtain_title:after{
  animation: none !important;
  width: 0 !important;
  height: 0 !important;   /* ← 擬似要素の被り防止 */
}

.curtain_title .curtain_title_inner{
  color: #fff;
  font-size: 36px;
  width: 365px;
  height: 134px;
  line-height: 134px;
  padding-left: 48px;
  box-sizing: border-box;
  background-color: #112334;

  animation: none !important;          /* ← fadein 停止 */
  animation-fill-mode: initial !important;
  opacity: 1 !important;
  transform: none !important;
}

/*タイトルアニメーションここまで*/

.sub_catch h2{
	width: 365px;
	height: 102px;
	line-height: 0.7;
	background-color:#fff;
	color: #193249;
	font-size: 32px;
	padding-left: 48px;
	box-sizing: border-box;
	display: flex;
	align-items:flex-end;
	position: absolute;
	bottom: 0;
}
/*-----------Vision-------------*/

.vision_topimg {
	background: url( "images/vision_image.jpg") no-repeat;
	background-size: cover;
	background-position: center top;
}
.contentbox01 {
	width: 100%;
	padding-top:118px;
}
.contentbox01 h2{
	text-align: center;
	font-size: 24px;
	font-weight: 500;
}
.vision_bg01 {
	width: 100%;
	height: 500px;
	line-height: 500px;
	text-align: center;
	background-color: #f5f2e4;
	position: relative;
	margin-top: 94px;
	z-index: -1;
}
.vision_bg01 .block{
	width: 1145px;
	height: 327px;
	margin: 0 auto;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
}
.vision_bg01 img{
	opacity: 0;
}

/* .vision_box {
	width: 586px;
	height: 314px;
	line-height: 1;
	background-color: #fff;
	position: absolute;
	top: -100px;
	right: 0;
	left: 0;
	margin: 0 auto;
	padding-top: 66px;
	box-sizing: border-box;

}
.vision_box h3{
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 17px;
}
.vision_box p{
	line-height: 26px;
	margin-bottom: 11px;
}
.vision_box ul{
	display: flex;
	justify-content: center;
	
}
.vision_box ul li{
	color: #fff;
	width: 126px;
	height: 100px;
	background-color: #112334;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 1.5px;
} */

.vision_box {
	counter-reset: count;
	width: 89.33%;
	max-width: 790px;

	margin: 0 auto;
	padding-top: 37px;
}

.vision_box .text_box {
	display: flex;
	flex-direction: column;
	gap: 31px;

	line-height: 26px;
    letter-spacing: -0.07em;
	margin: 0 0 100px auto;
	text-align: left;
	box-sizing: border-box;

	font-weight: 500;
}

.vision_box .text_box h3 {
	display: flex;
	flex-direction: column;
	gap: 16px;
	
	line-height: 1;

    padding-top: 0px;

	color: #193249;
	font-size: 42px;
	font-weight: 700;
}

.vision_box .text_box h4 {
	line-height: 26px;

	color: #193249;
	font-size: 22px;
	font-weight: 700;
}

.vision_box .text_box h5 {
	line-height: 26px;

	color: #193249;
	font-size: 14px;
	font-weight: 700;
}

.vision_box .list_text {
	display: flex;

	line-height: 26px;
	letter-spacing: -0.07em;
	margin: 0 0 0 auto;
	text-align: left;
	box-sizing: border-box;

	padding: 16px 0 0 16px;
	font-weight: 500;
}

.vision_box .list_title {
	display: inline;
	color: #193249;
	font-size: 14px;
	font-weight: 700;
}

.vision_box .list_desc {
	display: inline;
	font-weight: 500;
}

.vision_box .list_text::before {
	counter-increment: count;
	content: counter(count) ".";
	font-weight: 500;
	padding-right: 0.5em;
}

.greeting_img {
	padding-top: 61px;
	width: 980px;
	height: 634px;
	margin: 0 auto;
	position: relative;
}
.greeting_img .block{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
}
.greeting_img img{
	opacity: 0;
}

.vision_bg02 {
	width: 100%;
	height: 600px;
	background-color: #f5f2e4;
	margin-bottom: 243px;
}

.greeting {
	width: 790px;
	margin: 0 auto;
	padding-top: 74px;
	line-height: 28px;
	letter-spacing: 0em;
	position: relative;
}
.p03{
	margin: 13px 0 14px 0;
}
.p04{
   padding-left: 1em;
   text-indent: -1em;
}
.p05{
	margin: 14px 0 50px 0;
}
.p06{
	font-size: 14px;
	line-height: 20px;
	position: absolute;
	bottom: 8px;
	right: 137px;
}
.p07{
	font-size: 22px;
	text-align: right;
}

/*--------service--------*/
.service_img {
	background: url( "images/service_image.jpg") no-repeat center top;
	background-size: cover;
}

.service_top p {
	width: 553px;
	height:auto;
	line-height: 26px;
	margin: 0 0 0 auto;
	letter-spacing: -0.07em;
}

.service_top {
	max-width: 980px;
	width: 100%;
	/* height: 272px; */
	margin: 0 auto;
	padding: 43px 0 57px 0;
	box-sizing: border-box;
}

.panel_wrap {
	width: 100%;
	height: 120px;
	background: url("images/4_button_bg.jpg") no-repeat;
	background-size: cover;
}

/*カギ括弧ボタン*/
.button {
	color:#c0f7ff;
	font-size: 22px;
	background:transparent;
	border-width:3px;
	border-style: solid;
	border-color: #c0f7ff;
	position:relative;
	margin:28px;
	display:flex;
	align-items: center;
	justify-content: center;
	width: 155px;
	height: 48px;
	box-sizing: border-box;
	transition:all 0.3s ease-in-out;
	font-weight:bold;
	border-radius: 0px;
	outline: none;
}
.button span{
	font-size: 16px;
	letter-spacing: -0.07em;
}
.button:before, .button:after {
	content:'';
	display:block;
	position:absolute;
	border-color:#c0f7ff;
	box-sizing:border-box;
	border-style:solid;
	width:19px;
	height:19px;
	transition:all 0.3s ease-in-out
}
.button:before {
	top:-8px;
	left:-8px;
	border-width:3px 0 0 3px;
	z-index:5;
}
.button:after {
	bottom:-8px;
	right:-8px;
	border-width:0 3px 3px 0;
}
.button:hover:before, .button:hover:after {
	width:calc(100% + 16px);
  height:calc(100% + 16px);
	border-color:#112334;
}
.button:hover {
	color:#112334;
	border-color:#112334;
}
.panel {
	max-width:980px;
	height: 120px;
	position:relative;
	margin:auto;
	display: flex;
	align-items: center;
	justify-content: center;
}
.allinone{
	position: absolute;
	width: 0;
	height: 97px;
	top: -87px;
	left: -39px;
	overflow: hidden;
	transition-duration:1s;
}
.allinone img {
	max-width: 326px;
}
.printimage{
	width: 326px;
}
.content_wrap {
	margin-bottom: 300px;
}
.sercice_content {
	width:100%;
	height:auto;
	margin-top: 100px;
	text-align: center;
}
.service_curtain{
	position: relative;
	width: 980px;
	height: 500px;
	margin: 0 auto;
}
.sercice_content img{
	opacity: 0;
}
.service_box {
	max-width: 980px;
	/* height: 240px; */
	width: 100%;
	margin: 0 auto;
	position: relative;
}

.service_box .text_box {
	/* width: 614px; */
	line-height: 26px;
	letter-spacing: -0.07em;
	margin: 0 0 0 auto;
	text-align: left;
	padding-top: 30px;
	box-sizing: border-box;

	position: relative;
	left: 48px;
    padding: 31px 0 0 39px;

	font-weight: 500;
}

.service_box .list_text {
	/* width: 614px; */
	line-height: 26px;
	letter-spacing: -0.07em;
	margin: 0 0 0 auto;
	text-align: left;
	box-sizing: border-box;

	position: relative;
	left: 48px;
    padding: 3px 0 0 39px;
	display: flex;

	font-weight: 500;
}

.service_box .list_text::before {
	content: "・";
}

.point_box {
	/* width: 313px; */
	/* height: 250px; */
	background-color: #fff;
	position: relative;
	top: 0;
	left: 48px;
	text-align: left;
	padding: 31px 0 0 39px;
	box-sizing: border-box;
}
.point_box h3{
	color: #193249;
	font-size: 42px;
	font-weight: 500;
	/* margin-bottom: 33px; */
}
.point_box h3 span{
	font-size: 42px;
}
.text-move {
  /* opacity: 0; */
  display: inline-block;
  letter-spacing: 0.02em;
}
.text-move:nth-child(1) {
  transition: opacity 1.2s ease 0.1s, transform 1.2s ease 0.2s;
}
.text-move:nth-child(2) {
  transition: opacity 1.2s ease 0.2s, transform 1.2s ease 0.25s;
}
.text-move:nth-child(3) {
  transition: opacity 1.2s ease 0.25s, transform 1.2s ease 0.3s;
}
.text-move:nth-child(4) {
  transition: opacity 1.2s ease 0.3s, transform 1.2s ease 0.35s;
}
.text-move:nth-child(5) {
  transition: opacity 1.2s ease 0.35s, transform 1.2s ease 0.4s;
}
.text-move:nth-child(6) {
  transition: opacity 1.2s ease 0.4s, transform 1.2s ease 0.45s;
}
.text-move:nth-child(7) {
  transition: opacity 1.2s ease 0.45s, transform 1.2s ease 0.5s;
}
.text-move:nth-child(8) {
  transition: opacity 1.2s ease 0.5s, transform 1.2s ease 0.55s;
}
.text-move:nth-child(9) {
  transition: opacity 1.2s ease 0.55s, transform 1.2s ease 0.6s;
}
.text-move.act_text {
  opacity: 1;
  transform: scale(1) translate(0);
}
.point_box h3 span.tag{
	font-size: 24px;
}
.point_box p{
	opacity: 0;
	width: 160px;
	height: 30px;
	line-height: 30px;
	background-color: #193249;
	font-weight: 500;
	color: #ffffff;
	padding-left: 12px;
	box-sizing: border-box;
}
.p_curtain{
	width: 160px;
	height: 30px;
	position: relative;
	margin-bottom: 19px;
}
.p_curtain.active p{
	opacity: 1;
	transition-delay: 1s;
	transition-duration: 3.5s;
}
.p_curtain .curtain:after{
	background-color: #112334;
}

.service_box02 {
	max-width: 1365px;
	/* height: 250px; */
	line-height: 250px;
	position: relative;
	margin: 0 auto;
}

.label {
	width: 310px;
	height: 80px;
	background-color: #ffffff;
	position: absolute;
	top: 85px;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: center;
}
.label p{
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 26px;
	width: 154px;
	height: 26px;
}
.label p:first-child{
	border-right: 1px solid #333333;
}

.label02 {
	width: 610px;
	height: 81px;
}
.label02 p{
	width: 33.33333333333%;
	border-right: solid 1px #333333;
}
.label02 p:last-child{
	border-right: none;
}
/*----------------------------workstyle------------------------------------*/

.workstyle_img {
	background: url("images/workstyle_image.jpg") no-repeat;
	background-size: cover;
	background-position: center top;
}

.workstyle_top {
	max-width: 980px;
	width: 100%;
	height: 257px;
	margin: 0 auto;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	position: relative;
	margin-bottom: 200px;
}
.workstyle_top:after{
	content: "";
	width: 100vw;
	height: 200px;
	background-color: #f5f2e4;
	position: absolute;
	bottom:-200px;
	z-index: -1;
	margin-left: -500%;
	padding-left: 500%;
}
.workstyle_top p{
	width: 553px;
	height:auto;
	line-height: 26px;
	margin: 0 0 0 auto;
	letter-spacing: -0.07em;
	vertical-align: top;
}

.work_content01 {
	max-width: 1365px;
	height: 992px;
	margin: 0 auto;
	position: relative;
}
.work_content01 img{
	position: absolute;
	right: 0;
	bottom: 211px;
	z-index: 3;
}
.work_content01:after{
	content: "";
	width: 100vw;
	height: 380px;
	background-color: #f5f2e4;
	position: absolute;
	bottom:0px;
	z-index: 0;
	margin-left: -500%;
	padding-left: 500%;
}

.bg_work01 {
	opacity: 0;
	width: 1125px;
	height: 463px;
	background-color: #193249;	
}
.curtain_bg.active .bg_work01{
	opacity: 1;
	transition-delay: 1s;
	transition-duration: 1.5s;
}
.curtain_bg .curtain:after{
	background-color: #baa44d;
}
.curtain_bg{
	width: 1125px;
	height: 463px;
	position: absolute;
	bottom: 211px;
	right: 0;
	z-index: 1;
}

.work_text01 {
	width: 660px;
	height: 420px;
	background-color: #fff;
	position: absolute;
	top: 100px;
	left: 191px;
	z-index: 2;
}
.work_text01 h2 {
	width: 448px;
	color: #193249;
	font-size: 42px;
	font-weight: 500;
	line-height: 58px;
	letter-spacing: -0.05em;
	margin-bottom: 40px;
}
.work_text01 p{
	width: 563px;
	height: 172px;
	color: #333333;
	line-height: 26px;
	letter-spacing: -0.12em;
}

.work_content02 {
	max-width: 1365px;
	height: 977px;
	margin: 0 auto;
	position: relative;
}
.work_content02:after{
	content: "";
	width: 100vw;
	height: 380px;
	background-color: #f5f2e4;
	position: absolute;
	bottom:0px;
	z-index: 0;
	margin-left: -500%;
	padding-left: 500%;
}
.work_content02 img{
	position: absolute;
	bottom: 217px;
	z-index: 3;
}
.bg_work02 {
	opacity: 0;
	width: 1005px;
	height: 523px;
	background-color: #193249;
}
.curtain_bg02{
	width: 1005px;
	height: 523px;
	position: absolute;
	bottom: 217px;
	z-index: 1;
}
.curtain_bg02.active .bg_work02{
	opacity: 1;
	transition-delay: 1s;
	transition-duration: 1.5s;
}
.curtain_bg02 .curtain:after{
	background-color: #baa44d;
}
.work_text02 {
	width: 560px;
	height: 433px;
	background-color: #fff;
	position: absolute;
	top: 102px;
	right: 196px;
	z-index: 2;
}
.work_content02 h2 {
	width: 448px;
	color: #193249;
	font-size: 42px;
	font-weight: 500;
	line-height: 58px;
	letter-spacing: -0.05em;
	margin-bottom: 40px;
	margin-left: auto;
	margin-right: 0;
	text-align: right;
}
.work_content02 p{
	width: 483px;
	height: 198px;
	color: #333333;
	line-height: 26px;
	letter-spacing: -0.12em;
	margin-left: auto;
	margin-right: 0;
}
.work_content03 {
	max-width: 1365px;
	height: 1126px;
	margin: 0 auto 307px;
	position: relative;
}.work_content03:after{
	content: "";
	width: 100vw;
	height: 380px;
	background-color: #f5f2e4;
	position: absolute;
	bottom:0px;
	z-index: 0;
	margin-left: -500%;
	padding-left: 500%;
}
.work_content03 img{
	position: absolute;
	bottom: 262px;
	left: 42px;
	z-index: 2;
}
.bg_work03 {
	opacity: 0;
	width: 1131px;
	height: 700px;
	background-color: #193249;
	
}
.curtain_bg03{
	width: 1131px;
	height: 700px;
	position: absolute;
	bottom: 136px;
	right: 43px;
	z-index: 1;
}
.curtain_bg03.active .bg_work03{
	opacity: 1;
	transition-delay: 1s;
	transition-duration: 1.5s;
}
.curtain_bg03 .curtain:after{
	background-color: #baa44d;
}
.work_text03 {
	width: 700px;
	height: 400px;
	background-color: #fff;
	position: absolute;
	top: 102px;
	right: 157px;
	z-index: 3;
	padding-left: 87px;
	box-sizing: border-box;
}
.work_content03 h2 {
	width: 448px;
	color: #193249;
	font-size: 42px;
	font-weight: 500;
	line-height: 60px;
	letter-spacing: -0.05em;
	margin-bottom: 40px;
}
.work_content03 p{
	width: 563px;
	height: 172px;
	color: #333333;
	line-height: 26px;
	letter-spacing: -0.12em;
}

/*-----------------------------About--------------------------------*/
.company_info {
	max-width: 980px;
	height: 100%;
	margin: 118px auto;
	margin-bottom: 173px;
}
.company_info h2 {
	font-size: 24px;
	font-weight: 500;
	line-height: 26px;
	text-align: center;
	margin-bottom: 79px;
}
.company_info dl{
	width: 980px;
	
}
.company_info dt{
	clear:left;
	float:left;
	line-height:70px;
	height: 70px;
	padding-left: 92px;
	box-sizing: border-box;
}
.company_info dd{
	font-weight: 500;
	line-height:70px;
	height: 70px;
	border-bottom:solid 2px #e5e5e5;
	padding-left: 280px;
	box-sizing: border-box;
	letter-spacing: -0.05em;
}
.company_info dl dt:first-child+dd {
	border-top: solid 2px #e5e5e5;
}
.company_history {
	max-width: 980px;
	width: 100%;
	margin: 0 auto;
}
.history_bg {
	width:100%;
	height: 740px;
	background-color: #f5f2e4;
	margin-bottom: 152px;
	
}
.company_history h2{
	font-size: 24px;
	font-weight: 500;
    width: 586px;
	height: 100px;
	padding-top: 26px;
	box-sizing: border-box;
	background-color: #ffffff;
	margin: 0 auto 60px;
	text-align: center;
	
	
}
.company_history dl{
	width: 980px;	
}
.year{
	clear:left;
	float:left;
	line-height:100px;
	padding-left: 97px;
	box-sizing: border-box;
	font-weight: bold;
}
.month{
	float:left;
	line-height:100px;
	padding-left: 63px;
	box-sizing: border-box;
}
.company_history dd{
	line-height:100px;
	height: 100px;
	box-sizing: border-box;
	letter-spacing: -0.05em;
	padding-left: 286px;
}
.company_history dl div:nth-child(odd){
	background-color: #f9f7ee;
}
.about_img {
	background: url("images/about_image.jpg") no-repeat;
	background-size: cover;
	background-position: center top;
}

.map {
	width: 100%;
	height: 600px;
	
}
.access {
	position: relative;
	/* margin-bottom: 419px; */
}
.curtain_text {
   overflow:hidden;
    width: 586px;
	height: 126px;
	position: absolute;
	top: -26px;
	left: 0;
	right: 0;
	margin: 0 auto;
}

.curtain_text:after{  
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color:#112334;
}
.curtain_text .curt_inner {
    /*color: #fff;*/
    font-size: 24px;
	font-weight: 500;
    text-align: center;
    line-height: 126px;
    height: 126px;
	width: 586px;
}

.ct01:after{
	animation:layin 0.5s 0.3s cubic-bezier(.77,0,.175,1),
            layout 0.8s 0.6s cubic-bezier(.77,0,.175,1);
  animation-fill-mode: both;
}
.ct01 .curt_inner{
	background-color: #112334;
	animation:fadein .1s 0.6s;
	animation-fill-mode: both;
}

/*----------------お問い合わせ------------*/
.contact_img {
	background: url("images/contact_image.jpg") no-repeat;
	background-size: cover;
	background-position: center top;
}

.contact_top {
	max-width: 980px;
	width: 100%;
	height: 368px;
	text-align: center;
	margin: 118px auto 0;
}
.curtain_text02 {
   overflow:hidden;
    position: relative;
	margin: 0 auto;
	height: 48px;
	width: 235px;
	margin-bottom: 11px;
}
.curtain_text02:after{  
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color:#193249;
  /*
  animation:layin 0.5s 0.3s cubic-bezier(.77,0,.175,1),
            layout 0.8s 0.6s cubic-bezier(.77,0,.175,1);
  animation-fill-mode: both;
  */
}
.curtain_contact{
	display: inline-block;
	height: 48px;
	line-height: 48px;
	text-align: center;
	color: #193249;
	font-size: 36px;
	font-weight: bold;
	letter-spacing: -0.03em;
	opacity: 1;
}

/* カーテンを無効化 */
/*
.ct01:after{
  animation: none !important;
  width: 0 !important;
}
.ct01 .curtain_contact{
  animation: none !important;
  animation-fill-mode: initial !important;
  opacity: 1 !important;
}*/
.linewrap{
	width: 127px;
	margin: 0 auto 47px;
}
.line {
	width: 0;
	height: 5px;
	background-color: #9d9f11;
	border-radius: 2.5px;
}
.active_line{
	width: 127px;
	height: 5px;
	transition-duration: 1s;
}
.curtain_text03 {
   overflow:hidden;
    position: relative;
	margin: 0 auto;
	height: 48px;
	 width: 380px;
	text-align: center;
	margin-bottom: 11px;
}
.curtain_text03:after{  
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color:#193249;
}
.curtain_contact02{
	opacity: 0;
	display: inline-block;
	height: 48px;
	line-height: 48px;
	text-align: center;
    color: #193249;
	font-size: 36px;
	font-weight: bold;
	letter-spacing: -0.03em;
}
.ct02:after{
	animation:layin 0.5s 0.3s cubic-bezier(.77,0,.175,1),
            layout 0.8s 0.6s cubic-bezier(.77,0,.175,1);
  animation-fill-mode: both;
}
.ct02 .curtain_contact02{
	opacity: 1;
	animation:fadein .1s 0.6s;
	animation-fill-mode: both;
}
.tel_img {
	display: block;
	margin: 0 auto 37px;
}

.contact_top p {
	font-weight:bold;
	font-size: 20px;
	margin: 30px 0 67px 0;
}
.contact_top p span{
	font-size: 24px;
}

.form_bg {
	width: 100%;
	height:1800px;
	background-color: #d1d1d1;
	padding-top: 86px;
	box-sizing: border-box;
	margin-bottom: 185px;
}
.form_bg h3{
	text-align: center;
	color: #193249;
	font-size: 36px;
	font-weight: bold;
	letter-spacing: -0.03em;
	margin-bottom: 23px;
}
/*フォーム*/
#formWrap {
	margin:0 auto;
	max-width:980px;
	width:100%;
	height:1450px;
	background-color:#fff;
	box-sizing:border-box;
	margin-bottom:59px;
}

.wrap_form {
	background-color:#fff;
	padding:140px 0 0px 272px;
}

#formWrap h4 {
	font-size:20px;
	font-weight:500;
	margin-bottom:8px;
	display: flex;
	line-height: 1.1;
}
#formWrap h4 span {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color:#F06A50;
	color:#fff;
	width:42px;
	height:20px;
	border-radius:2px;
	font-size:12px;
	box-sizing:border-box;
	position:relative;
	margin-left: 15px;
	padding-top: 0.3%;
}
.input {
	width: 450px;
	height:56px;
	padding:5px 16px;
	box-sizing:border-box;
	border:#f0f0f0 2px solid;
	font-size:14px;
}
.name_wrap {
	margin-bottom:30px;
}
#textbox {
	height:180px;
	font-size:16px;
	border-radius: 4px;
}
/*ラジオボタン*/
.radiobutton {
	margin-left:2px;
}
.radiobutton label {
	padding: 0 0 0 45px;	/* ラベルの位置 */
	font-size: 18px;
	line-height: 30px;		/* ボタンのサイズに合わせる */
	display: inline-block;
	cursor:	pointer;
	position: relative;
	width: 194px;
	box-sizing:border-box;
}
.radiobutton label:before {
	content: '';
	width: 30px;		/* ボタンの横幅 */
	height: 30px;		/* ボタンの縦幅 */
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff;
	border: 2px solid #e5e5e5;
	border-radius: 50%;
	box-sizing: border-box;
	
}
.radiobutton input[type="radio"] {
	display: none;
}
.radiobutton input[type="radio"]:checked + label:after {
	content: '';
	width: 16px;		/* マークの横幅 */
	height: 16px;		/* マークの縦幅 */
	position: absolute;
	top: 7px;
	left: 7px;
	background-color:#baa44d;
	border-radius: 50%;
	
}
.radiobutton input{
	margin-right:20px;
}
/*都道府県プルダウン*/
.selectdiv {
  position: relative;
  width:185px;
  height:56px; 
}
.selectdiv select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 180px;
  max-width: 320px;
  height: 50px;
  float:left;
  padding: 0px 24px 0px 16px;
  font-size: 14px;
  line-height: 1.75;
  color:#b5b3b3;
  border:#f0f0f0 2px solid;
  background: url(images/icon_sellect.svg) no-repeat 150px center ;
  -ms-word-break: normal;
  word-break: normal;
  border-radius:2px;
  box-sizing:border-box;
  background-color:#FFF;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#b9b9b9;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#b9b9b9;
}
::placeholder{ /* Others */
 color:#b9b9b9;
}
/* IE11 hide native button*/
select::-ms-expand {
display: none;
}
.send {
	display: flex;
	align-items: baseline;
	margin: 30px 0 0 272px;
}
#submit_btn {
	width: 151px;
	height: 53px;
	border-radius: 2px;
	background-color: #baa44d;
	font-size:16px;
	font-weight: 500;
	display: flex;
	justify-content: center;
	align-items: center;
	color:#FFF;
	box-sizing:border-box;
	border:none;
	-webkit-appearance:none;
	appearance:none;
}
#submit_btn:hover {
	opacity:0.6;
}
.send span{
	color: #395e66;
	font-size: 14px;
	font-weight: 500;
	line-height: 40px;
	margin-left: 26px;
}

/*-----------------お知らせ一覧---------------------*/
.newslist_img {
	background: url("images/news_image.jpg")no-repeat;
	background-size: cover;
	background-position: center top;
}
.newslist_cont {
	width: 100%;
	height: 1215px;
	background: url("images/newslist_bg.jpg") no-repeat;
	background-size: cover;
	margin: 118px 0 146px;
}
/*--------------------お知らせ-----------------*/
.news_img {
	width: 100%;
	height: 256px;
	background: url("images/news_details_image.jpg") no-repeat;
	background-size: cover;
	background-position: center top;
}

.news_catch {
	max-width: 980px;
	height: 256px;
	position: relative;
	margin: 0 auto;
}
.news_catch h1{
	width: 365px;
	height: 102px;
	line-height: 0.7;
	background-color:#fff;
	color: #193249;
	font-size: 32px;
	padding-left: 48px;
	box-sizing: border-box;
	display: flex;
	align-items:flex-end;
	position: absolute;
	bottom: 0;
}
.news_detail {
	width: 100%;
	height: 940px;
	background-color: #e1f1fa;
	margin-top: 143px;
	margin-bottom: 61px;
}

.detail_inner {
	max-width: 980px;
	height: 940px;
	background-color: #fff;
	margin: 0 auto;
	padding: 0 82px;
	box-sizing: border-box;
	text-align: center;
}
.detail_inner h2{
	width: 600px;
	text-align: left;
	font-size: 24px;
	font-weight: 500;
	line-height: 28px;
	margin: 16px auto 57px;
}

.detail_date {
	width: 600px;
	margin:0 auto 38px;
	font-size: 18px;
	text-align: right;
}

.article {
	text-align: left;
	line-height: 28px;
	letter-spacing: -0.1em;
}
.news_nav {
	max-width:980px;
	width: 100%;
	height: 221px;
	margin:0 auto;
	position: relative;
}

.btn_prev:hover{
	opacity:0.7;
}
.btn_prev {
	font-size:16px;
	font-weight: 500;
	color:#5080a4;
	width:116px;
	height:56px;
	display: flex;
	align-items: center;
	border-radius: 4px;
	border: 2px #4699b1 solid;
	box-sizing: border-box;
	padding: 0 17px;
	position: absolute;
	left: 0;
}
.btn06 {
	font-size:16px;
	font-weight:500;
	color:#5080a4;
	width:140px;
	height:56px;
	border:solid 2px #4699b1;
	border-radius:4px;
	box-sizing:border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	
}
.btn06:hover {
	opacity:0.7;
}
.btn_next:hover{
	opacity:0.7;
}
.btn_next {
	font-size:16px;
	font-weight: 500;
	color:#5080a4;
	width:116px;
	height:56px;
	display: flex;
	align-items: center;
	border-radius: 4px;
	border: 2px #4699b1 solid;
	box-sizing: border-box;
	padding: 0 17px;
	position: absolute;
    right: 0;
}
/*---------------------採用情報-------------------------*/
.content_bg {
	background-color: #193249;
}

.recruit_wrap {
	max-width: 1365px;
	height: auto;
	margin: 0 auto;
	background-color: #fff;
}

.recruit_img {
	width: 100%;
	height: 740px;
	margin-top: 80px;
	background: url("images/recruit_image.jpg") no-repeat center top;
	background-size: cover;
	position: relative;
}
/*タイトルアニメーション02*/
.curtain_title02 {
  overflow:hidden;
  width: 365px;
  height: 200px;
  position: absolute;
  top: 89px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

/* === タイトルアニメーション02を無効化（即表示） === */
.curtain_title02:before,
.curtain_title02:after{
  animation: none !important;
  width: 0 !important;
  height: 0 !important;   /* ← 擬似要素の被り防止 */
}

.curtain_title02 h1{
  width: 365px;
  height: 200px;
  background-color: #16c9e4;
  color: #fff;
  font-size: 36px;
  display: flex;
  align-items: center;
  justify-content: center;

  animation: none !important;          /* ← fadein 停止 */
  animation-fill-mode: initial !important;
  opacity: 1 !important;
  transform: none !important;
}

/*タイトルアニメーション02ここまで*/
.recruit_img h2:after{
	/* content: "Recruit"; */
	position: absolute;
	bottom: 26px;
	right: 0;
	left: 0;
	text-align: center;
	color: #16c9e4;
	font-size: 32px;
}
/*タイトルアニメーション03*/
.curtain_title03 {
  overflow:hidden;
  width: 365px;
  height: 180px;
  position: absolute;
  top: 321px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

/* === タイトルアニメーション03を無効化（即表示） === */
.curtain_title03:after{
  animation: none !important;
  width: 0 !important;
  height: 0 !important;   /* ← 被り防止（重要） */
}

.curtain_title03 h2{
  width: 365px;
  height: 180px;
  background-color:#fff;
  color: #193249;
  font-size: 28px;
  display: flex;
  justify-content: center;
  padding-top: 50px;
  box-sizing: border-box;

  animation: none !important;          /* ← ここが重要 */
  animation-fill-mode: initial !important;
  opacity: 1 !important;              /* ← 念のため固定 */
  transform: none !important;
}

/*タイトルアニメーション03ここまで*/


.recruit_img h3 {
	width: 391px;
	height: 168px;
	font-size: 46px;
	font-weight: 500;
	line-height: 62px;
	letter-spacing: -0.15em;
	position: absolute;
	bottom: 132px;
	right: 44px;
}
/* recruit: PDF文章ブロック（追加分） */
.recruit_lead,
.recruit_last{
  max-width: 840px;
  margin: 0 auto 40px;
  line-height: 28px;
}

.recruit_lead h4,
.recruit_last h4{
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 14px;
}

.recruit_lead p{
  margin-bottom: 14px;
}

.job_type {
	max-width:840px;
	width: 100%;
	margin: 0 auto;
	padding-top: 164px;
	padding-bottom: 354px;
	position: relative;
}
.job_type h3{
	font-size: 24px;
	font-weight: 500;
	width: 740px;
	height: 110px;
	background-color: #fff;
	position: absolute;
	top: -27px;
	right: 0;
	left: 0;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	align-items: flex-end;
}

/*アコーディオン*/
.accordionbox{
	width: 980px;
	margin: 0px auto 0px;
	border-bottom: 2px solid #e5e5e5;
}
.accordionlist dt{
    display:block;
    background: #fff;
    /*padding: 30px 0 10px 5px;*/
    border-top: 2px solid #e5e5e5;
	height: 98px;
	line-height: 98px;
	font-size: 30px;
}
.accordionlist dt:first-child{
/*    border-top: none !important;*/
}
.accordionlist dt .title{
    padding-left: 13px;
	float: left;
}
.accordionlist dd{
    display:none;
	background: #fff;
	padding:0 0 50px 0px;
}
.accordion_icon,
.accordion_icon span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.accordion_icon {
	position: relative;
	width: 44px;
	height: 44px;
	float: right;
	margin-right: 0px;
}
.accordion_icon span {
	position: absolute;
    left: -20px;
    width: 100%;
	height: 4px;
    background-color: #193249;
	border-radius: 4px;
}
.accordion_icon span:nth-of-type(1) {
    top: 48px;
	transform: rotate(0deg);
}
.accordion_icon span:nth-of-type(2) {
    top: 48px;
	transform: rotate(90deg);
}
/*＋、－切り替え*/
.accordion_icon.active span:nth-of-type(1) {
	display:none;
}
.accordion_icon.active span:nth-of-type(2) {
	top: 48px;
	transform: rotate(180deg);
	background-color: #16c9e4;
}
.accordionlist dd{
  transition: none !important;
  transform: none !important;
}
.rec_toggle {
	background-color:#f5f2e4;
	padding-top: 44px;
	box-sizing: border-box;
	width: 840px;
	margin: 0 auto;
}
.rec_toggle h5{
	font-size: 24px;
	text-align: center;
	/* margin-bottom: 35px; */
}
.rec_toggle li{
	/* width: 840px;  */
	/* min-height: 80px;          /* ← 高さ固定はやめる（文章対応） */
	margin: 0 auto;
	display: flex;
	align-items: center;
	/* padding: 20px 0 20px 43px; /* 縦余白をpaddingで調整 */ 
	box-sizing: border-box;
}
/*
.rec_toggle li:nth-child(odd){
	background-color: #f9f7ee;
} */

/* 左：項目 */
.rec_toggle .rec_label{
	width: 140px;             /* ← 左幅を固定 */
	font-weight: bold;
	flex-shrink: 0;
	letter-spacing: -0.05em;
}

/* 右：内容 */
.rec_toggle .rec_value{
	flex: 1;
	letter-spacing: -0.1em;
}

.info {
	width: 691px;
	font-size: 12px;
	line-height: 18px;
	margin: 30px auto 47px;
}
.btn04{
	display:flex;
	align-items: center;
	padding-left: 40px;
	box-sizing: border-box;
	/* background-image: url("images/link_arrow02.png"); */
	background-position: 204px 36px;
	background-repeat: no-repeat;
	width: 300px;
	height: 81px;
	background-color: #193249;
	color: #fff;
	font-size: 18px;
	margin: 0 auto;
	
}
.btn04:hover{
	background-position: 231px 36px;
	transition: all .2s;
}
/*--------------------プライバシーポリシー--------------------*/
.privacy_bg {
	background-color: #193249;
}

.privacy_wrap {
	max-width: 1365px;
	height: auto;
	margin: 0 auto;
	background-color: #fff;
}
.privacy_img {
	width: 100%;
	height: 256px;
	margin-top: 80px;
	background: url("images/privacy_policy_image.jpg") no-repeat center;
	background-size: cover;
	position: relative;
}
.privacy_img h1 span{
	font-size: 30px;
}
/*タイトルアニメーション04*/
.curtain_title04 {
  overflow:hidden;
  width: 480px;
  height: 134px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
}

/* === タイトルアニメーション04を無効化（即表示） === */
.curtain_title04:before,
.curtain_title04:after{
  animation: none !important;
  width: 0 !important;
}

.curtain_title04 h1{
  width: 480px;
  height: 134px;
  background-color: #112334;
  color: #ffffff;
  font-size: 36px;
  text-align: center;
  line-height: 48px;
  padding-top: 20px;
  box-sizing: border-box;

  animation: none !important;          /* ← ここが重要 */
  animation-fill-mode: initial !important;
  opacity: 1 !important;              /* ← 念のため固定 */
  transform: none !important;
}


/*タイトルアニメーション04ここまで*/
.privacy_img h2 {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	color: #193249;
	font-size: 32px;
	width: 480px;
	height: 90px;
	background-color: #ffffff;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	line-height: 0.7;
}

.privacy_content {
	max-width: 840px;
	width: 100%;
	margin: 142px auto 0;
}
.privacy_content p{
	line-height: 28px;
}
.privacy_box {
	margin-top: 75px;
	padding-bottom: 5px;
}
.privacy_box h3{
	font-size: 24px;
	font-weight: 500;
	line-height: 28px;
	position: relative;
}
.privacy_box h3:after{
	content: "";
	width: 50px;
	height: 5px;
	background-color: #9d9f11;
	border-radius: 2.5px;
	position: absolute;
	bottom: -13px;
	left: 0;
}
.privacy_box p{
	margin-top: 63px;
}
.privacy_box ul{
	line-height: 28px;
	margin-top: 36px;
}
.add{
	margin-top: 40px;
	padding-bottom: 114px;
}



/* アニメーション無効（常に表示状態） */
.left_in,
.fade_up,
.fade_up02 {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

.mv {
	opacity: 1 !important;
	transform: none !important;
}

/* 遅延も無効化 */
.timing01,
.timing02,
.timing03 {
	transition-delay: 0s !important;
}


@media screen and (min-width:668px) {
.vision_img_sp{display: none;}
.sp_bg{display: none;}
.img_sp{display: none;}
.pc_none{display: none;}
.nav li p{
display: none;
}
.sub_nav li p{
display: none;
}
.nav-wrap img{
display: none;
}
.nav li:nth-child(1){display: none;}
.nav li:nth-child(6){display: none;}
.sub_nav li:nth-child(1){display: none;}
.sub_nav li:nth-child(6){display: none;}
.nav-wrap {
    display: block !important;
  }
}

/* =========================
   Recruit：最終調整まとめ（このブロックだけ残す）
   ========================= */

/* 1) メイン画像のキャッチ */
.recruit_img h3{
  width: min(520px, 44vw);
  height: auto;
  font-size: clamp(28px, 3vw, 40px);
  line-height: 1.35;
  letter-spacing: -0.03em;
  right: 48px;
  bottom: 110px;
}

/* 2) 「募集職種」見出し周り */
.job_type{
  padding-top: 120px;
  padding-bottom: 220px;
}
.job_type h3{
  width: min(740px, 92%);
  height: 90px;
  top: -45px;
  align-items: center;
}

/* 3) PDF導入文／締め */
.recruit_lead{
  max-width: 840px;
  margin: 0 auto 64px;
  font-size: 16px;
  line-height: 30px;
}
.recruit_last{
  max-width: 840px;
  margin: 72px auto 0;
  font-size: 16px;
  line-height: 30px;
}
.recruit_last h4{
  line-height: 1.55;
  letter-spacing: 0;
}
.recruit_last p{
  margin-top: 14px;
}

/* 4) アコーディオン見出し（dt）＋アイコン中央 */
.accordionbox{
  width: min(980px, 100%);
}
.accordionbox .accordionlist dt{
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: auto;
  line-height: 1.4;
  font-size: 22px;
  padding: 22px 18px;
  cursor: pointer;
}
.accordionbox .accordionlist dt .title{
  float: none;
  padding-left: 0;
}

/* ＋／－アイコン */
.accordionbox .accordion_icon{
  float: none;
  width: 34px;
  height: 34px;
  margin-right: 6px;
  position: relative;
}
.accordionbox .accordion_icon span{
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 3px;
  transform-origin: center;
}
.accordionbox .accordion_icon span:nth-of-type(1){
  transform: translateY(-50%) rotate(0deg);
}
.accordionbox .accordion_icon span:nth-of-type(2){
  transform: translateY(-50%) rotate(90deg);
}
.accordionbox .accordion_icon.active span:nth-of-type(1){
  display: none;
}
.accordionbox .accordion_icon.active span:nth-of-type(2){
  transform: translateY(-50%) rotate(0deg);
}

/* 5) 開いた中身（背景は備考まで＋幅980揃え） */
.rec_toggle{
  width: min(840px, 100%);
  margin: 0 auto;
  background: transparent; /* info以降を白にしたいので本体は透明 */
  padding: 0;
}

/* h5 と ul を同じ幅で背景 */
.rec_toggle > h5,
.rec_toggle > ul{
  width: 980px;     /* ← 8470px になっているので修正 */
  max-width: 840px;
  margin: 0 auto;
  box-sizing: border-box;
  background-color: #f5f2e4;
}

/* h5：左詰め */
.rec_toggle > h5{
  text-align: left;
  padding: 44px 70px 18px;
  line-height: 1.65;
}

/* ul：余白リセット */
.rec_toggle > ul{
  margin: 0 auto;
  padding: 0 0 36px 0;
  list-style: none;
}

/* 親の行（主な仕事内容/向いているタイプ/歓迎/備考）だけを整形 */
.rec_toggle > ul > li{
  width: 840px;
  min-height: 80px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  padding: 20px 0 20px 43px;
  box-sizing: border-box;
  gap: 18px;
}
.rec_toggle > ul > li:nth-child(odd){
  background-color: #f9f7ee;
}

.rec_toggle .rec_label{
  width: 160px;
}
.rec_toggle .rec_value{
  letter-spacing: 0;
  line-height: 1.7;
}

/* 6) rec_value の中に入れた “箇条書き ul/li” は素に戻す（●は入力する前提） */
.rec_toggle .rec_value ul,
.rec_toggle .rec_value ol{
  margin: 0;
  padding: 0;
  list-style: none;
}
.rec_toggle .rec_value ul li,
.rec_toggle .rec_value ol li{
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;            /* 行間を増やさない */
  display: block;        /* flex解除 */
  background: transparent;
}

/* 7) info～ボタン（白で区切る） */
.rec_toggle .info{
  width: min(840px, 92%);
  font-size: 13px;
  line-height: 22px;
  margin: 26px auto 28px;
  padding-top: 18px;
  background: #fff;
}
.btn04{
  width: 320px;
}

/* 連絡先だけ複数行に対応 */
.company_info dd.company_contact{
  height: auto;
  line-height: 1.6;
  padding-top: 16px;
  padding-bottom: 16px;
}

/* TEL / MAIL を必ず改行（br不要） */
.company_info dd.company_contact .contact_line{
  display: block;
}

/* 左の「連絡先」側も高さ固定を外して揃える */
.company_info dt.company_contact_dt{
  height: auto;
  line-height: 1.6;
  padding-top: 16px;
  padding-bottom: 16px;
}

/* CONTACT US 電話ブロック */
.contact_tel{
  text-align: center;
}

.contact_tel .tel_img{
  display: block;
  margin: 0 auto 18px;
}

.contact_tel .tel_number{
  margin: 0 0 12px;
  font-size: 56px;         /* スクショ寄せ：必要なら調整 */
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.1;
  color: #333;             /* 既存に合わせて変更OK */
}

.contact_tel .tel_hours{
  margin: 0;
  font-size: 24px;         /* ←ご指定どおり */
  font-weight: 600;
  line-height: 1.2;
  color: #333;
}

.contact_tel .tel_hours span{
  font-weight: 700;
}

/* =========================
   Header 共通化（トップ/サブの高さを揃える + ロゴを少し下げる）
   ========================= */

/* 1) ラッパーの高さを統一 */
.head_wrap,
.sub_header_wrap{
  height: 68px !important;
  /* top: 0 !important; /* 念のため */
}

/* 2) 中身のヘッダー行を統一 */
.top_header,
.sub_header{
  height: 68px !important;
  align-items: center;
}

/* 3) ナビの li 高さ/行高を統一（文字の中心を出す） */
.nav li,
.sub_nav li{
  height: 68px !important;
  line-height: 68px !important;
}

/* 4) ロゴ枠も高さを統一（sub 側は元が 80px なので効く） */
.top_logo,
.sub_logo{
  height: 68px !important;
  line-height: 68px !important;
  display: flex;
  align-items: center;
}

/* 5) ロゴ画像を「ほんの少し」下げて、メニュー文字の中心に合わせる */
.top_logo img,
.sub_logo img{
  display: block;
  transform: translateY(2px);
}

/* =========================
   Top: mv(背景)とVision(box1)の被り/透け対策
   ========================= */

/* 1) fade_up_top を即表示にする（アニメ無効化） */
.fade_up_top{
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* 2) Vision セクション側に白背景を持たせて、背景画像が透けないようにする */
.top_content01{
  background: #fff;
  position: relative;
  z-index: 1;
}

/* 3) タイトルが上に近い場合は、余白を少し増やす（お好みで微調整） */
.box1{
  padding-top: 110px; /* 現在 75px :contentReference[oaicite:1]{index=1} */
}

/* access セクション：重なり解消 */
.access{
  position: relative;
  padding-top: 0;   /* 念のため */
}

/* タイトルは通常配置に戻す */
.access .curtain_text{
  position: relative !important;  /* absolute を殺す */
  top: auto !important;
  left: auto !important;
  right: auto !important;
  margin: 0 auto 28px !important; /* タイトルと地図の間隔 */
}

/* 地図の高さは維持 */
.access .map{
  width: 100%;
  height: 600px;
}

/* 管理バー表示時（ログイン中）にヘッダーを下げる */
/*
body.admin-bar.head_wrap.color.chenge,
body.admin-bar.sub_header_wrap{
  top: 32px !important;   /* PCの管理バー高さ 
} */


/* ログイン中（管理バーあり）だけヘッダーを下げる */
body.admin-bar .head_wrap,
body.admin-bar .sub_header_wrap{
  top: 32px !important;
}

@media (max-width: 782px){
  body.admin-bar .head_wrap,
  body.admin-bar .sub_header_wrap{
    top: 46px !important;
  }
}


/* =========================
   Recruit：スマホでは「項目→内容」を縦並びにする
   ========================= */
@media (max-width: 782px){

  /* 980px固定を解除して、画面幅にフィットさせる */
  .accordionbox{
    width: 100% !important;
  }

  .rec_toggle{
    width: 100% !important;
    padding: 0 !important;
  }

  .rec_toggle > h5,
  .rec_toggle > ul{
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
  }

  /* 見出し（h5）の左右余白をスマホ向けに */
  .rec_toggle > h5{
    padding: 22px 18px 14px !important;
  }

  /* ベージュ背景の ul の左右余白 */
  .rec_toggle > ul{
    padding: 0 0 22px 0 !important;
  }

  /* ここが本命：1行を「縦並び」にする（About Us風） */
  .rec_toggle > ul > li{
    width: calc(100% - 36px) !important;
    margin: 0 auto !important;
    display: block !important;     /* flex解除 */
    min-height: 0 !important;
    padding: 16px 18px !important;
  }

  /* 項目ラベル：上に表示 */
  .rec_toggle .rec_label{
    width: auto !important;
    margin: 0 0 10px 0 !important;
    font-weight: 700;
  }

  /* 内容：下に表示 */
  .rec_toggle .rec_value{
    width: auto !important;
    line-height: 1.7;
  }

  /* rec_value内の箇条書きもスマホで崩れないように */
  .rec_toggle .rec_value ul li{
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
  }

  /* info（注意文）も画面幅に合わせる */
  .rec_toggle .info{
    width: calc(100% - 36px) !important;
    margin: 18px auto 22px !important;
  }

  /* ボタンをスマホ幅に */
  .btn04{
    width: min(320px, calc(100% - 36px)) !important;
  }
}

/* =========================
   Recruit：スマホの rec_value（ul/li）崩れ対策
   ========================= */
@media (max-width: 782px){

  /* rec_value が ul の場合：デフォルトの黒丸を消す */
  .rec_toggle ul.rec_value{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 「●」はテキストで入力する前提：折り返しも揃える */
  .rec_toggle ul.rec_value > li{
    list-style: none !important;
    margin: 0 0 8px 0 !important;
    padding-left: 1.4em !important; /* ぶら下げ用 */
    text-indent: -1.4em !important; /* 2行目以降を揃える */
    line-height: 1.7 !important;
    word-break: break-word;
  }
}
/* =========================
   Recruit：スマホの ul.rec_value（箇条書き）最終調整
   ========================= */
@media (max-width: 782px){

  /* ul.rec_value の標準黒丸・余白を完全に消す */
  .rec_toggle ul.rec_value{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Safari/Chromeのmarker対策（黒丸が残る場合の保険） */
  .rec_toggle ul.rec_value > li::marker{
    content: "" !important;
  }

  /* 「●」は文章に入れる前提：折り返しを揃える（ぶら下げ） */
  .rec_toggle ul.rec_value > li{
    margin: 0 0 6px 0 !important;
    padding: 0 0 0 1.2em !important;   /* ぶら下げ用の左余白 */
    text-indent: -1.2em !important;   /* 2行目以降を揃える */
    line-height: 1.7 !important;
    word-break: break-word;
  }
}
/* =========================
   Recruit：スマホ  ul.rec_value 対応（最終版）
   ========================= */
@media (max-width: 782px){

  /* 1) 親行は縦並び（項目→内容） */
  .rec_toggle > ul > li{
    display: block !important;
    width: calc(100% - 36px) !important;
    margin: 0 auto !important;
    padding: 16px 18px !important;
    min-height: 0 !important;
  }

  .rec_toggle > ul > li > .rec_label{
    width: auto !important;
    margin: 0 0 10px 0 !important;
    font-weight: 700;
  }

  /* 2) rec_value が「ul」の場合の崩れを潰す（ここが本命） */
  .rec_toggle > ul > li > ul.rec_value{
    flex: none !important;          /* 既存 .rec_value{flex:1} を無効化 */
    list-style: none !important;    /* 標準黒丸を消す */
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .rec_toggle > ul > li > ul.rec_value > li{
    list-style: none !important;
    margin: 0 0 6px 0 !important;
    /* padding: 0 !important; */
    line-height: 1.7 !important;
    word-break: break-word;
  }

  /* Safari/Chromeのmarkerが残る保険 */
  .rec_toggle > ul > li > ul.rec_value > li::marker{
    content: "" !important;
  }
}
/* =========================================
   Recruit：スマホ崩れ最終対策（ul.rec_value対応）
   ＝必ず style.css の一番下に追記＝
   ========================================= */
@media (max-width: 782px){

  /* 親の1行（主な仕事内容/向いているタイプ…）を縦並びに */
  .rec_toggle > ul > li{
    display: block !important;               /* flex解除 */
    width: calc(100% - 36px) !important;
    margin: 0 auto !important;
    padding: 16px 18px !important;
    min-height: 0 !important;
  }

  /* ラベルは上、内容は下 */
  .rec_toggle > ul > li > .rec_label{
    display: block !important;
    width: auto !important;
    margin: 0 0 10px 0 !important;
    font-weight: 700;
  }

  /* rec_value が ul の場合：標準の黒丸と余白を完全に消す */
  .rec_toggle > ul > li > ul.rec_value{
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  /* ネストした li に親の flex/幅/背景が当たるのを完全に無効化 */
  .rec_toggle > ul > li > ul.rec_value > li{
    display: block !important;
    width: auto !important;
    min-height: 0 !important;
    margin: 0 0 6px 0 !important;
    /* padding: 0 !important; */                  /* 行間を増やさない */
    background: transparent !important;     /* 親の交互背景を無効化 */
    box-sizing: border-box !important;
    line-height: 1.7 !important;
    word-break: break-word;
  }

  /* Safari/Chromeで marker が残る保険 */
  .rec_toggle > ul > li > ul.rec_value > li::marker{
    content: "" !important;
  }
}
/* =========================
   rec_value が ul の場合の崩れ対策（重要）
   ========================= */

/* 親行はflex（PC）でも“上揃え”にする（中央揃えだと詰まって見える） */
.rec_toggle > ul > li{
  align-items: flex-start;   /* center → flex-start */
  min-height: 0;             /* 高さ固定を解除（文章量に追従） */
}

/* rec_value が ul なので、ここを明示的にリセット */
.rec_toggle ul.rec_value{
  margin: 0;
  padding: 0;
  list-style: none;          /* デフォルト黒丸を消す（●は文字で入力する前提） */
  flex: 1;                   /* 右側カラムとして伸ばす */
}

/* ul.rec_value の中の li は “親の li” の装飾を全部無効化 */
.rec_toggle ul.rec_value > li{
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 6px 0 !important;  /* 行間だけ少し */
  /* padding: 0 !important; */
  display: block !important;      /* flex解除 */
  background: transparent !important;
  box-sizing: border-box;
  line-height: 1.6;
  word-break: break-word;
}

/* 末尾だけ余白なし */
.rec_toggle ul.rec_value > li:last-child{
  margin-bottom: 0 !important;
}

/* =========================
   SP：AboutUsみたいに「上=項目 / 下=内容」
   ========================= */
@media screen and (max-width: 782px){

  /* 親の1行を縦積みに */
  .rec_toggle > ul > li{
    width: 100% !important;
    display: block !important;
    padding: 14px 16px !important;
    gap: 0 !important;
  }

  /* 項目（左）を上に */
  .rec_toggle .rec_label{
    width: 100% !important;
    margin: 0 0 8px 0 !important;
  }

  /* 内容（右）を下に */
  .rec_toggle ul.rec_value{
    flex: none !important;
  }

  .rec_toggle ul.rec_value > li{
    margin: 0 0 4px 0 !important; /* SPはさらに詰める */
  }
  .rec_toggle ul.rec_value > li:last-child{
    margin-bottom: 0 !important;
  }
}

/* =========================
   ul.rec_value（箇条書き）を崩さないための最終上書き
   ========================= */

/* 親行（項目1行）だけをレイアウト対象にする */
.rec_toggle > ul > li{
  align-items: flex-start; /* centerだと文章が潰れて見えがち */
}

/* 親行用の装飾が “中のli” に当たってしまうのを強制解除 */
.rec_toggle ul.rec_value > li{
  width: auto !important;
  min-height: 0 !important;
  margin: 0 0 6px 0 !important;
  /* padding: 0 !important; */
  display: block !important;
  background: transparent !important;
  box-sizing: border-box !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
}

/* ul.rec_value 自体もリセット（黒丸を消す。●は文字で入力する前提） */
.rec_toggle ul.rec_value{
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.rec_toggle ul.rec_value > li::marker{
  content: "" !important; /* 念のため（ブラウザ差分対策） */
}

/* =========================
   SP：AboutUsみたいに「上=項目 / 下=内容」
   ========================= */
@media screen and (max-width: 782px){

  .rec_toggle > ul > li{
    width: 100% !important;
    display: block !important;
    padding: 14px 16px !important;
  }

  .rec_toggle .rec_label{
    width: 100% !important;
    margin: 0 0 8px 0 !important;
  }

  .rec_toggle ul.rec_value > li{
    margin: 0 0 4px 0 !important;
  }
  .rec_toggle ul.rec_value > li:last-child{
    margin-bottom: 0 !important;
  }
}

/* ========================================================================= */
/* =========================
   Factory page（整理版）
   ========================= */

.factory_page{
  width: min(980px, 92%);
  margin: 0 auto;
  padding: 80px 0 140px;
}

/* 工場カード */
.factory_card{
  margin: 0 0 90px;
}

/* タイトル（curtain_text流用：高さ126px等をFactoryだけ解除） */
.factory_page .factory_title.curtain_text{
  position: relative;           /* absolute を潰す */
  top: auto;
  left: auto;
  right: auto;

  height: auto;                 /* 126px固定を解除 */
  width: min(586px, 92%);
  margin: 0 auto 10px;          /* 工場名と住所の間隔 */
  overflow: visible;            /* 必要なら hidden に戻してOK */
}

.factory_page .factory_title .curt_inner{
  height: auto;                 /* 126px固定を解除 */
  line-height: 1.2;             /* 126px固定を解除 */
  padding: 18px 0;              /* タイトル帯の高さはここで決める */
  width: 100%;
}

/* 情報ブロック */
.factory_info{
  background: #fff;
  padding: 10px 0 6px;          /* 詰めた最終値に統一 */
}

/* dt/dd をAbout Us風に */
.factory_dl{
  width: min(840px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 180px 1fr;
  border-top: 1px solid #e6e6e6;
}

.factory_dl dt,
.factory_dl dd{
  padding: 14px 0;              /* 詰めた最終値に統一 */
  border-bottom: 1px solid #e6e6e6;
}

.factory_dl dt{
  font-weight: 700;
}

.factory_dl dd a{
  color: inherit;
  text-decoration: none;
}

.factory_list{
  margin: 0;
  padding: 0;
  list-style: none;
}

.factory_list li{
  margin: 0 0 6px;
  line-height: 1.7;
}
.factory_list li:last-child{
  margin-bottom: 0;
}

/* 地図 */
.factory_map{
  width: 100%;
  height: 520px;
  margin-top: 24px;
}

/* スマホ：項目→内容の縦並び */
@media (max-width: 782px){
  .factory_page{
    padding: 50px 0 90px;
  }

  .factory_page .factory_title .curt_inner{
    padding: 14px 0;            /* スマホは帯を少し薄く */
  }

  .factory_dl{
    grid-template-columns: 1fr;
  }

  .factory_dl dt{
    padding-bottom: 8px;
    border-bottom: none;
  }

  .factory_dl dd{
    padding-top: 0;
  }

  .factory_map{
    height: 380px;
  }
}


/* ===Service============================ */

:root{
  --container: 980px;
  --gap: 20px;

  --text: #111;
  --line: rgba(17, 17, 17, .18);
  --card: rgba(17, 17, 17, .04);
}

*{ box-sizing: border-box; }

.services{
  padding: 56px 20px;
  color: var(--text);
  line-height: 1.8;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
}

.services__header{
  max-width: var(--container);
  margin: 0 auto 28px;
  padding-bottom: 14px;
  position: relative;
}

/* ヘッダーに控えめなアンダーライン装飾（お任せ部分） */
.services__header::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 120px;
  height: 2px;
  background: var(--text);
  opacity: .22;
}

/* Service と「どこまでお願いできるの～」を同等サイズに */
.services__heading{
  margin: 0;
  font-weight: 750;
  letter-spacing: .02em;
  font-size: clamp(22px, 3.2vw, 36px);
}

/* “下の行”として少しだけニュアンス差（サイズは同じ） */
.services__heading--sub{
  font-weight: 650;
  opacity: .95;

  /* 改行指定に対応 */
  white-space: pre-line;
}

.services__items{
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  gap: var(--gap);
}

.service-card{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 18px 18px 16px;
}

/* 「1. シルクスクリーン印刷」などのタイトルは大きめ */
.service-card__title{
  margin: 0 0 10px 0;
  font-size: clamp(18px, 2.4vw, 26px);
  font-weight: 750;
  letter-spacing: .02em;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line); /* お任せ装飾 */
}

/* 本文は改行指定を反映 */
.service-card__text{
  margin: 0;
  white-space: pre-line;
}

@media (min-width: 760px){
  .service-card{
    padding: 22px 22px 18px;
  }
}