@charset "UTF-8";
/* CSS Document */




/*Instagram*/
.instagram-arc {
display: flex;
flex-wrap: wrap;
 justify-content: center;}


/*ボタン*/
.bt-am {
background-color: #6C9DCD;
padding: 10px;
color: #fff;
border-radius: 5px;
margin: 5px;
display: inline-block;
}
.bt-am:hover {background-color:#4C7094;}

.bt-b-am {
width: 100%;
height: 40px;
font-size: 1.2rem;
font-weight: 700;
background-color: #fff;
padding: 10px;
color: #4C7094;
border-radius: 30px;
display: inline-block;
display: flex;
justify-content: center;
align-items: center;
box-shadow: 3px 3px 3px #666666;
}
.bt-b-am:hover {
background-color:#4C7094;
color: #fff;
}

a{text-decoration: none;}



/*logo　レスポンシブ+シャドー*/
.drop-s-am {filter: drop-shadow(3px 3px 3px #999);}
.svg-res {width: 80%;height: auto;}

/*iframeの背景*/
.inline-am {background: #DCDCDC;
border: 1px solid #959595;
border-collapse: collapse;
padding: 10px;
}

/*contact-bg*/
.gb-raund-ac{
background-color: #FFEAD4;
padding: 15px;
border-radius: 10px;
}



/*Instagram*/
.instagram-media {
    position: static;
}

.ml-tab-ac{
margin-left: 38px;
}

.indent-ac-2{
text-indent: -2.5em;
padding-left: 2.5em;

}


body {
font-family: 'Crimson Text', serif;
font-family: 'Jost', sans-serif;
font-family: 'M PLUS Rounded 1c', sans-serif;
font-family: 'Zen Maru Gothic', sans-serif;
font-weight: 400;
font-size: 16px;
color: #666666;
}


.arc-h2{
background-color: #4C7094;
box-shadow: 3px 3px 3px gray;
border-radius: 30px;
color: #fff;
font-size: 1.25rem;
font-weight: 700;
text-align: center;
padding: 2px;
margin: 20px 0;
}


.oshirase{
font-weight: 500;
color: #00009E;
}
.dekigoto{
font-weight: 500;
color: #CB6500;
}



.font-weight300{font-weight: 300;}
.font-weight400{font-weight: 400;}
.font-weight500{font-weight: 500;}
.font-weight700{font-weight: 700;}

.fs-7{font-size: 13px;line-height: 19px;}
.fs-8{font-size: 12px;line-height: 18px;}
.fs-9{font-size: 11px;line-height: 16px;}
.fs-10{font-size: 10px;line-height: 15px;}

.line-hight15{line-height: 1.5rem;}
.line-hight12{line-height: 1.2rem;}
.line-hight10{line-height: 1rem;}


.co-003366{color: #003366;}/*ブルー濃*/
.co-4C7094{color: #4C7094;}/*ブルー薄*/
.co-FF9933{color: #FF9933;}/*オレンジ濃*/
.co-CB0000{color: #CB0000;}/*赤*/

.border-t-b{border: 1px solid #003366;
border-collapse: collapse;
}

.bg-FF9933{background-color: #FF9933;}/*オレンジ濃い*/
.bg-FFEAD4{background-color: #FFEAD4;}/*オレンジ薄*/
.bg-FFD8B1{background-color: #FBC187;}/*オレンジ薄2*/


.bg-4C7094{background-color: #4C7094;}/*ブルー薄*/
.bg-6C9DCD{background-color: #6C9DCD;}/*ブルー薄1*/
.bg-ECF2F8{background-color: #ECF2F8;}/*ブルー薄2*/
.bg-gray{background-color: #DCDCDC;}/*グレー*/


.bg-green{background-color: #9bcc29;}/*グリーン：つくったもの*/
.bg-light-blue{background-color: #29a3cc;}/*ライトブルー：つくったもの*/
.bg-yellow{background-color: #cc9829;}/*イエロー：つくったもの*/
.bg-blue{background-color: #2972cc;}/*ブルー：つくったもの*/
.bg-pink{background-color: #cc298b;}/*ピンク：つくったもの*/








/*recruit-boder-color*/
tbody, td, tfoot, th, thead, tr {
border-bottom-color: #fff;
}
/*アークメタルにいて：boder-color*/
.table .co-003366 tbody, td, tfoot, th, thead, tr {
border-bottom-color: #003366;
}

.span-row {
display: inline-block;}

.w100 {width: 100%;}
.s {width: 100%;font-size: 0.8em;}

/*page_top*/
#mmm {
position: fixed;
bottom: 50px;
right: 20px;
z-index: 2;
opacity: 0.8;
}

/*nav-right */
@media (min-width: 992px) {
.navbar-collapse {width: auto;}}

/*card:写真角丸 */
.radius-arc{
border-radius: 150px;}
.card a:hover {
transition: all 0.5s;
transform: scale(1.1);
opacity: 1;
}	

.radius-1-arc{border-radius: 5px;}
.radius-2-arc{border-radius: 10px;}
.radius-3-arc{border-radius: 30px;}
.radius-4-arc{border-radius: 40px;}




/*ロールオーバー */
a:hover{opacity: 0.5;
transition: all 0.5s;}



/*写真背景：透明 */
.card {background-color: transparent !important;}

h2.card-title {font-size: 18px;
font-weight: 500;
}
.bg-C9D4DF{background-color: #C9D4DF;}
.co-FF9933{color: #FF9933;}


/*flex-reverse */
@media (min-width: 768px) {
.flex-reverse{
flex-direction: row-reverse;}
}


/*お知らせ */
.deco-noe{list-style-type:none;}
.deco-noe a{text-decoration: none;
color: #666;}



/*footer */
.list-unstyled li a{
text-decoration: none;
color: #fff;
}
.footer-li li{
display: inline-block;
line-height: 2rem;
}
.footer-li li a{
text-decoration: none;
color: #fff;
display: inline-block;
line-height: 2rem;
}

.co-003366{color: #003366;}
.co-fff{color: #fff;}
.bg-003366{
background-color: #003366;
}
.font-fff{
color: #fff;
font-size: 1rem;
text-decoration:none;
}


.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: none;
  border-radius: 0;
}




/*SNS-logo-size＋＋＋＋＋＋＋＋＋＋＋＋＋＋*/
.logo-size-top{width: 15px;}
.logo-size{width: 20px;}


/*imgのグレー化＋＋＋＋＋＋＋＋＋＋＋＋＋＋*/
.gray-img {  
  filter: grayscale(100%); 
}

/*top画像のシャドウ＋＋＋＋＋＋＋＋＋＋＋＋＋＋*/
.shadow-01 {
box-shadow: 3px 3px 3px #666666;
}
.card-img-top-arc-img{
box-shadow: 3px 3px 3px #666666;
}





/*もっとみる＋＋＋＋＋＋＋＋＋＋＋＋＋＋*/

.motomiru {
  --max-height: 200px;
  position: relative;
  max-height: var(--max-height);
  overflow: hidden;
  /* ここにトランジションを追加 */
  transition: max-height 0s ease-in-out; 
}
.motomiru:has(.read-more-button > input:checked) {
  /* initial の代わりに十分大きな値を設定し、1秒かけて展開 */
  max-height: 2000px; /* コンテンツが全て表示される十分大きな値に */
}

/* 他のCSSルールはそのまま */
.text-container {
  position: relative;
}
.read-more-motomiru {
  position: absolute;
  top: var(--max-height);
  transform: translateY(-100%);
  overflow: hidden;
  width: 100%;
  display: flex;
  align-items: end;
  justify-content: center;
		background-image: linear-gradient(transparent, #fff 90%);
		height: calc(clamp(0px, round(up, 100% - var(--max-height), 1px), 1px) * 60);
  &:has(.read-more-button > input:checked){
    display: none;
  }
}
.none{input:checked; display: none;}
.btn-bold{
border-radius: 5px;
    display: block;
    width: 100px;
    padding: 2px;
    box-sizing: border-box;
    background: #6fa1ff;
    color: #FFF;
    text-decoration: none;
    text-align: center;
font-weight: 900;}


/*もっとみる-ここまで＋＋＋＋＋＋＋＋＋＋＋＋＋＋*/



/* --- 既存の .motomiru の設定はそのまま --- */

/* 1. 閉じている時のボタン位置設定 */
.read-more-motomiru {
  position: absolute;
  top: var(--max-height);
  transform: translateY(-100%);
  width: 100%;
  display: flex;
  align-items: flex-end; 
  justify-content: center;
  background-image: linear-gradient(transparent, #fff 80%);
  height: 80px; 
  z-index: 2;
  transition: all 1s ease; 
}

/* 2. 【重要】展開時の挙動をリセットして最下部へ移動 */
.motomiru:has(.read-more-button > input:checked) .read-more-motomiru {
  position: relative; 
  top: auto;
  transform: none;
  background: none;
  height: auto;
  margin-top: -15px;
  padding-bottom: 20px;
  display: flex;
		  z-index: 2;
		
}

/* 3. ボタン内のテキスト切り替え（前回同様） */
.txt-close { display: none; }
.motomiru:has(.read-more-button > input:checked) .txt-more { display: none; }
.motomiru:has(.read-more-button > input:checked) .txt-close { display: inline; }

/* 4. ラベルを押しやすくする */
.read-more-button {
  cursor: pointer;
  z-index: 3;
}



