:root {
  --main-color: #09346e;
  --main-color2: #25a1c8;
  --main-bgcolor: #f2fafc ;
}


.font1{font-family: 'Hina Mincho', serif;}
.font2{font-family: 'Kosugi', sans-serif;}
.font3{font-family: 'Noto Sans JP', sans-serif;}
.font4{font-family: 'Noto Serif JP', serif;}
.font5{font-family: 'Reggae One', cursive;}
.font6{font-family: 'RocknRoll One', sans-serif;}
.font7{font-family: 'Sawarabi Gothic', sans-serif;}
.font8{font-family: 'Sawarabi Mincho', serif;}
.font9{font-family: 'Shippori Mincho B1', serif;}
.font10{font-family: 'Zen Maru Gothic', sans-serif;}
.font11{font-family: 'DotGothic16', sans-serif;}
.font12{font-family: 'Zen Kaku Gothic New', sans-serif;}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 991px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
    .pcnav{ display: none !important; }
    .pcv { display: none; }
}

/*共通*/
h2{display: inline-block;font-size: 2rem;text-align: center;font-weight: 500;line-height: 1.8rem;margin-bottom: 0.2em;margin-top: 1em;;}
.h2-s{font-size: 1rem;text-align: center;font-weight: 500;margin-bottom: 4em;margin-top: 0.1em;letter-spacing: 0.3rem;}
p{font-size: 100%;}
.img_wrap img{
  cursor: pointer;
  transition-duration: 0.3s;
}
.img_wrap:hover img{
  opacity: 0.6;
  transition-duration: 0.3s;
}
@media only screen and (max-width: 991px) {
  h2{font-size: 1.7rem;line-height: 1.8rem;}
  p{font-size: 100%;margin-bottom: 10px;}
}
@media only screen and (max-width: 720px) {
  p{font-size: 80%;margin-bottom: 10px;}
}



.w100 {width: 100%;}
.w60 {width: 60%;}
.w70 {width: 70%;}
.w80 {width: 80%;}
.w50 {width: 50%;}
.max-100 { max-width: 100%;}

/* ヘッダー */
.header-logo{background-color: #FFF;position: fixed;top: 0;z-index: 3;box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .01);}
.header-logo img{ width: 80%;margin: 10px 0;max-height: 80px;}
.header-logo {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
}
.menu-item i {
  color: #aea7a7; /* アイコンの色 */
  font-size: 13px; /* アイコンのサイズ */
  margin-right: 7px;
}
.header-l a {
  width: 80px !important;
}
    .logo{margin: 20px 0;}
    .logo-txt{margin: 10px 0;font-size: 14px;}
    @media only screen and (max-width: 720px) {
    .logo{margin: 17px 0 17px;}
    .logo-txt{margin: 5px 0 15px;font-size: 12px;}
    }
    .bg-header{background-color: #ffffff;}


    @media only screen and (max-width: 992px) {
      .bg-header{background-color: #ffffff;border-bottom: 3px solid #b30000;}
    }

.login {
  display: flex;
}
.top_icon1,.top_icon2,.top_icon3{
width: 25%;
position: relative;
}
@media only screen and (max-width: 992px) {
  .top_icon3{position: fixed;right: 40px;top:15px;width: 80px;z-index: 2;}
}
.login a {
  text-decoration: none;
  color: #373030;
  text-align: center;
  display: block;
  line-height: 18px;
  font-size: 11px;
  display: flex; /* 子要素を中央揃え */
  align-items: center; /* 縦方向の中央揃え */
  justify-content: center; /* 横方向の中央揃え */
  flex: 1; /* 均等な幅を持たせる */
}

.login a:hover {
  text-decoration: none;
  color: #bb0000;
}
.top_icon1 {
  display: flex;
  flex-direction: column; /* アイコンとテキストを縦に並べる */
  justify-content: center; /* 水平方向の中央揃え */
  align-items: center; /* 垂直方向の中央揃え */
}

.contact_icon {
  display: flex;
  flex-direction: column; /* アイコンとテキストを縦に並べる */
  align-items: center; /* アイコンとテキストを水平方向で中央揃え */
}

.contact_icon:before {
  font-family: 'FontAwesome';
  content: "\f0e0"; /* メールアイコン */
  font-size: 20px; /* アイコンサイズを調整 */
  margin-bottom: 0px; /* アイコンとテキストの間にスペースを追加 */
}

.key_icon {
  display: flex;
  flex-direction: column; /* アイコンとテキストを縦に並べる */
  align-items: center; /* アイコンとテキストを水平方向で中央揃え */
}

.key_icon:before {
  font-family: 'FontAwesome';
  content: "\f023"; /* 鍵アイコン */
  font-size: 24px; /* アイコンサイズを調整 */
  margin-bottom: 0px; /* アイコンとテキストの間にスペースを追加 */
}

 .hoge:before {
  font-family: 'FontAwesome';
  content: "\f015";
  font-size: 18px;
}

/* ナビゲーションメニュー */
.nav-menu{position: relative;}
.nav-menu::before {
  content: ""; /* 擬似要素を表示するために必須 */
  position: absolute;
  width: 100%; /* 初期状態は0にして非表示 */
  height: 3px; /* ボーダーの高さ */
  background-color: #b30000; /* 下線の色 */
  bottom: 0; /* 下部に配置 */
  left: 0%; /* 中央から開始 */
  transition: width 0.3s ease-in-out; /* アニメーション設定 */
}
.nav-menu ul{margin: 0;padding: 0;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);}

.nav-menu li{list-style: none;}
.nav-menu {
  position: relative;
  z-index: 9;
  background-color: #FFF; /* メニューの背景色 */
  color: #373030; /* メニューテキストの色 */
  font-size: 14px;
}

.menu-list {
  display: flex;
  justify-content: center; /* メニューアイテムを中央揃えに */
}

.menu-item {
  position: relative;
  background-color: #FFF; /* メニューアイテムの背景色 */
  border-left: 1px solid #ccc; /* メニューアイテムの左ボーダー */
  transition: background-color .3s; /* 背景色の変化をアニメーション化 */
}

.menu-item:last-child {
  border-right: 1px solid #ccc; /* 最後のメニューアイテムの右ボーダー */
}

/* メニューアイテムのホバースタイル */
.menu-item:hover .drop-menu-list {
  transform: scaleY(1); /* ドロップダウンメニューの表示 */
}

.menu-item:hover {
  background-color: #f7f7f7; /* メニューアイテムのホバー時の背景色 */
  transition: background-color .3s; /* 背景色の変化をアニメーション化 */
}
.menu-item::before {
  content: ""; /* 擬似要素を表示するために必須 */
  position: absolute;
  width: 100%; /* 初期状態は0にして非表示 */
  height: 3px; /* ボーダーの高さ */
  background-color: #b30000; /* 下線の色 */
  bottom: 0; /* 下部に配置 */
  left: 0%; /* 中央から開始 */
  transition: width 0.3s ease-in-out; /* アニメーション設定 */
}
.menu-item::after {
  content: ""; /* 擬似要素を表示するために必須 */
  position: absolute;
  width: 0; /* 初期状態は0にして非表示 */
  height: 3px; /* ボーダーの高さ */
  background-color: #ff5252; /* 下線の色 */
  bottom: 0; /* 下部に配置 */
  left: 0%; /* 中央から開始 */
  transition: width 0.3s ease-in-out; /* アニメーション設定 */
}

.menu-item:hover::after {
  width: 100%; /* ホバー時にフル幅 */
  left: 0; /* 左端から開始 */
}




.menu-item a {
  align-items: center;
  color: #373030; /* メニューアイテム内のリンクテキストの色 */
  display: flex;
  height: 50px;
  justify-content: center;
  text-decoration: none; /* リンクの下線を非表示 */
  width: 210px;
}

/* ドロップダウンメニュー */
.drop-menu {
  position: relative;
}

.drop-menu-list {
  left: 0;
  position: absolute;
  top: 100%;
  box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .1);
  transform: scaleY(0); /* ドロップダウンメニューの非表示 */
  transform-origin: center top; /* 変形を適応する基準を設定 */
  transition: transform .3s; /* 表示の変化をアニメーション化 */
  width: max-content;
  z-index: 1;
}

.drop-menu-item {
  background-color: #FFF; /* ドロップダウンメニューの背景色 */
  transition: opacity .3s; /* 不透明度の変化をアニメーション化 */
}
.drop-menu-item a {
  color: #333; /* 通常時の文字色 */
}

.drop-menu-item:hover {
  background-color: #eee;
}


 /* 言語切り替えボタン */
.language-selector {
  position: absolute;
    background: #FFF;
    border: 1px solid #c1c1c1;
    color: #fff;
    width: 50%;
    border-radius: 50px;
    margin-left: 25%;
    z-index: 99;
    text-align: center; /* 中央揃え */
    display: flex;
    flex-direction: column;
    align-items: center; /* 子要素を中央揃え */
}

.language-selector button {
    background: transparent;
    border: none;
    color: #111;
    font-size: 10px;
    cursor: pointer;
    padding: 5px 10px;
    display: none;
    text-align: center; /* ボタン内のテキストを中央揃え */
    width: 100%; /* 幅を統一 */
}

.language-selector button:first-child {
    display: block;
}

.language-selector.open button {
    display: block;
}

.language-selector button:hover {
    background: rgba(184, 184, 184, 0.2);
    border-radius: 3px;
}





/*spメニュー*/

.menu-content .row{padding: 0 ;margin: 0;}

.menu-content ul {
  padding: 90px 10px 0;
  margin-bottom: 30px !important;
}
.menu-content ul li {
  border-bottom: solid 1px #554747;
  position: relative;
  height: auto;
  list-style: none;
}
.menu-content ul li a {
  display: block;
  width: 100%;
  font-size: 15px;
  box-sizing: border-box;
  color:#fff;
  text-decoration: none;
  padding: 8px 15px 10px 10px;
}

.menu-content .sub {
  list-style:none;
  padding-left: 0.7em;
}


.menu-content ul .arrow a::before {
  content: "";
  width: 7px;
  height: 7px;
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  transform: rotate(45deg);
  position: absolute;
  right: 11px;
  top: 16px;
}
@media only screen and (max-width: 1000px) {
  .menu-content ul {
    padding: 0px 30px 0;
  }
  .menu-content ul li a {
    padding: 15px 15px 10px 10px;
  }

.menu-content ul li a::before {
  right: 11px;
  top: 20px;
}
  .menu-content{
    padding: 90px 0 0;}
  }

.menu-content {
  width: 25%;
  height: 100%;
  position: fixed;
  box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .1);
  top: 0;
  left: 100%;/*leftの値を変更してメニューを画面外へ*/
  z-index: 99998;
  overflow-y: auto;
  opacity: 0.95;
  background-color: #373030;
  transition: all 0.5s;/*アニメーション設定*/
}

.menu-content a:hover{
  color: #999;
}

#menu-btn-check:checked ~ .menu-content {
    left: 75%;/*メニューを画面内へ*/
}
@media only screen and (max-width: 1000px) {
  .menu-content {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 100%;/*leftの値を変更してメニューを画面外へ*/
    z-index: 99998;
    overflow-y: auto;
    opacity: 0.95;
    background-color: #373030;
    transition: all 0.5s;/*アニメーション設定*/
  }
  
  #menu-btn-check:checked ~ .menu-content {
      left: 0%;/*メニューを画面内へ*/
  }
  .menu-mt{margin-top: 0 !important;padding-top: 0 !important;}
  .menu-mb{margin-bottom: 0 !important;padding-bottom: 0 !important;}
  }
/*三本線疑似要素*/
#menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}
#menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  transform: rotate(45deg);
}
#menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  transform: rotate(-45deg);
}
.menu-btn {
  position: fixed;
  top: 0px;
  right: 0px;
  display: flex;
  height: 80px;
  width: 80px;
  justify-content: center;
  align-items: center;
  z-index: 99999;
  background-size: contain;
}

@media only screen and (max-width: 991px) {
  .menu-btn {
    height: 60px;
    width: 60px;
  } 
}
.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
  content: '';
  display: block;
  height: 2px;
  width: 30px;
  border-radius: 0px;
  background-color: #373030;
  position: absolute;
}
.menu-btn span:before {
  bottom: 8px;
}
.menu-btn span:after {
  top: 8px;
}
.menu-btn.active span,
.menu-btn.active span:before,
.menu-btn.active span:after {
  background-color: #fff;
}
/*チェックボックスを隠す*/
#menu-btn-check {
    display: none;
}

/* アコーディオンメニュー */
.accordion ul{
  width: 100% !important;
  padding-left: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.accordion{
  width: 100% !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.accordion > a {
  display: block;
  width: 100%;
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  padding: 0 0;
  position: relative;
  cursor: pointer;
}

/* アコーディオンの矢印 */
.accordion > a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  transform: rotate(45deg);
  position: absolute;
  right: 11px;
  top: 16px;
}

/* 開いているときの矢印 */
.accordion.active > a::after {
  transform: translateY(-50%) rotate(135deg);
  top: 20px;chirg
}

/* サブメニュー（最初は非表示） */
.sub-menu {
  display: none;
  width: 100% !important;
  background-color: #373030 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  background: rgba(255, 255, 255, 0.1);
}
.sub-menu .border_top {
  border-top: solid 1px #554747 !important;
}
.sub-menu li {
  list-style: none;
  padding-left: 1em !important;
  border-bottom: solid 1px #554747 !important;
}
.sub-menu .border_none {
  list-style: none;
  border-bottom: none !important;
}

.sub-menu li a {
  display: block;
  padding: 8px 15px;
  color: #ccc;
  text-decoration: none;
}

.sub-menu li a:hover {
  color: #b9b9b9 !important;
}


/* フッター */
#footer{background-color: #373030;font-size: 1rem;width: 100%;margin-top: 0px;font-size: 0.8rem;text-align: left;color: #fff;padding-bottom: 50px !important;padding-top: 50px !important;line-height: 20px;}
#footer h2{font-size: 1.1rem !important;display: block;text-align: left;letter-spacing: 0;color: #fff;margin-bottom: 10px;margin-top: 0;}
#footer .left_1em{margin-left: 0.5em;}
#footer hr{margin: 30px 0;}
.copyright{padding: 10px 0 10px;color: #fff;letter-spacing: 0.1rem;text-align: right;}
#footer a{color: #fff !important;text-decoration: none;font-size: 0.9rem;line-height: 2.5rem;}
#footer a:hover{color: #999 !important;text-decoration: none;}
#footer a:visited{color: #fff;text-decoration: none;}
@media (max-width: 992px) {
  #footer{text-align: left;}
}
@media (max-width: 992px) {
.copyright{font-size: 9px;margin-bottom: 30px;text-align: center;padding: 20px 0;}
#footer h2{margin-top: 1.5rem;}
}
.footer_btn{position: fixed;right: 60px; top: 0px;z-index: 9999;height: 65px !important}
.footer_btn img{height: 100% !important}
.footer_btn_left{margin:0 1px 0 0}
.footer_btn_right{margin:0 0 0 0}
.footer_btn_tel{display: none;}

@media (max-width: 992px) {
.footer_btn{position: fixed;right: 0; bottom: 0;top:auto;z-index: 99;width: 100%;height: auto !important}
.footer_btn img{width: 100% !important;height: auto !important}
.footer_btn_left{display: none;}
.footer_btn_right{display: none;}

.footer_btn_sp{position: fixed;bottom: 0;z-index: 9;text-align: center;width: 100%}
.footer_btn_tel{width: 80% !important;display:inline-block;max-width: 90%;margin-bottom: 10px;}
}


#topBtn{
  background:#111111;
  color: #fff;
  position: fixed;
  right: 10px;
  bottom: 10px;
  border-radius: 50%;
  width: 55px;
  height: 55px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
/* フッター */

/* トップページ */
 /* トップグリッド */
 #contents_box a{color: #FFF;text-decoration: none;}
 #contents_box a:hover{color: #FFF;opacity: 0.8;}
 #contents_box h2{font-size: 25px;margin-bottom: 15px;letter-spacing: 0.1rem;}
 #contents_box h2:before{content: attr( data-title );position: absolute;margin-top: -23px;font-size: 12px;letter-spacing: 0.1rem;}
 #contents_box h3{font-size: 22px;margin-bottom: 15px;letter-spacing: 0.1rem;text-align: center;}
 #contents_box h3:before{content: attr( data-title );position: absolute;margin-top: -18px;font-size: 12px;letter-spacing: 0.1rem;text-align: center;display: block;width: 100%;left: 0;}
 @media (max-width: 992px) {
   #contents_box h2{font-size: 18px}
   #contents_box h2:before{font-size: 10px}
   #contents_box h3{font-size: 18px}
   #contents_box h3:before{font-size: 10px}
 }
 #contents_box p{font-size: 13px;line-height: 18px;margin-bottom: 0;}
 #contents_box .contents_box1{background-color: #bb0000;}
 #contents_box .contents_box2{background-color: #c72020;}
 #contents_box .contents_box3{background-color: #f15d4d;}
 #contents_box .contents_box4{background-color: #d64f34;}
 #contents_box .contents_box5{background-color: #e25d3b;}
 #contents_box .contents_box6{background-color: #ce3d20;}
 #contents_box .inner{padding: 50px;}
 @media (max-width: 992px) {
   #contents_box p{font-size: 12px;line-height: 15px;margin-bottom: 0;}
   #contents_box .inner{padding: 20px;}
 }
/* オーバーフローを非表示にしてホバー効果を安定させる */
.image_mouseover_1 {overflow: hidden;position: relative;}
/* 画像の拡大アニメーション */
.image_mouseover_1 img {transition: transform 0.5s ease, opacity 0.5s ease;}
/* リンク全体のホバー時に画像を拡大 */
.image_mouseover_1:hover img {transform: scale(1.1);opacity: 0.3;}
.opacity5{opacity: 0.5;}
/* トップグリッド */

  /* お知らせ */
  #information h2{display: block;width: 100%;text-align: center;color: #373030;padding: 20px 0;font-size: 18px;margin-bottom: 0px;margin-top: 0;}
  #information .h2_bg1{background-color: #efe3e3;}
  #information .h2_bg2{background-color: #ead5d5;}
  #information .bg1{background-color: #f9eded;}
  #information .bg2{background-color: #f5e6e6;}
  #information ul{padding: 0;margin: 0;}
  #information li{text-decoration: none;list-style: none;padding: 15px 40px;border-bottom: 1px solid #d5cfcf;line-height: 20px;}
  #information a :hover{background-color: #eedddd;}
  @media (max-width: 992px) {
    #information li{padding: 10px 20px;}
  }
  #information a{text-decoration: none;font-size: 15px;}
  #information a time{text-decoration: none;color: #2e1f14;display: block;margin-bottom: 0px;}
  
#information .btn-wrapper {
  display: flex; /* Flexboxを使用 */
  flex-direction: column; /* 縦方向の配置 */
  align-items: center; /* 子要素を中央揃え */
}

#information .btn-wrapper {
  margin-top: 20px; /* ボタンの上に余白を追加 */
  width: 100%; /* 必要に応じて調整可能 */
  display: flex; /* Flexboxを使用 */
  justify-content: center; /* ボタンを中央揃え */
}

#information .btn a {
  background: #b30000;
  font-size: 12px;
  text-align: center;
  width: 180px;
  padding: 5px 30px;
  color: #FFF;
  border: 1px solid #b30000;
  text-decoration: none;
  transition: background 0.3s;
  border-radius: 5px;
  margin: 20px 0;
}

#information .btn a:hover {
  background: #da2323;
  border: 1px solid #da2323;
  color: #FFF;
}

#information .list li {
  padding: 15px 10%;
}
@media (max-width: 992px) {
  #information .list li {
    padding: 10px 15px;
  } 
}

/* お知らせ */


/*一覧ページ*/
#list{margin:30px 0 ;}
#list h2{font-size: 26px;margin-bottom:10px ;font-weight: bold;}
#list h3{font-size: 20px;margin-bottom:18px ;font-weight: bold;position: relative;padding-left: 20px;}
#list h4{display: block;text-align: left;margin-bottom: 30px;margin-top: 0;font-size: 22px;border-left: 5px solid #b30000;padding-left: 10px;}
#list p{margin-bottom:10px !important }
#list h3:after {content: '';
    width: 7px;
    height: 7px;
    border-top: 2px solid #b30000;
    border-right: 2px solid #b30000;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0px;
    transition: 0.3s ease-in-out;}
#list p{font-size: 15px;margin-bottom:20px;}

#list .label-container {
    display: flex;
    align-items: stretch; /* 高さを統一 */
    background-color: #ebebeb; /* 全体の背景色 */
    padding: 0;
    font-size: 14px;
    margin-bottom: 20px;
}

#list .label {
    background-color: #b30000; /* 左側のラベルの色 */
    padding: 5px 10px;
    font-weight: bold;
    color: white;
    white-space: nowrap; /* 文字が折り返されないように */
    display: flex; /* 高さを統一するため追加 */
    align-items: center; /* 文字を中央揃え */
}

#list .text {
    flex: 1;
    color: #111 !important;
    padding: 5px 10px;
}
/*一覧ページアイコン*/
.custom-button {
  background-color: #FFF; /* グレー */
  color: #333;
  border: 1px solid #ccc;
  border-radius: 20px; /* 角丸 */
  padding: 3px 20px;
  font-size: 12px;
  font-weight: normal !important;
  text-align: center;
  display: inline-block;
  pointer-events: none; /* クリック不可 */
}
/* a タグがあるときだけ hover 効果 */
a:hover .custom-button {
  background-color: #b30000;
  color: #fff;
  border-color: #b30000;
}

/* ボタンの間隔とレイアウト */
.button-container {
  display: flex;
  flex-wrap: wrap; /* 自動折り返し */
  gap: 5px; /* ボタン間の間隔 */
  max-width: 100%; /* 横幅制限 */
  margin-bottom: 20px; /* センター寄せ */
}


/* レスポンシブ対応 */
@media (max-width: 500px) {
 
}


/*会社概要*/
#company h2{display: block;text-align: left;margin-bottom: 30px;margin-top: 0;font-size: 24px;font-weight: bold;}
#company h3{display: block;line-height: 1.5em;text-align: left;margin-bottom: 30px;margin-top: 80px;font-size: 22px;border-left: 5px solid #b30000;padding-left: 10px;}
#company p{text-align: left;margin-bottom: 35px;margin-top: 0;font-size: 15px;}
#company .container{padding-top: 50px;padding-bottom: 50px;}
#company .col-12{padding: 0 0 30px 0;}
#company table{width: 100%;margin-bottom: 50px;font-size: 15px;}
#company table th{width: 20%;border-bottom: 1px solid #ccc;padding: 10px 15px;text-align: left;}
#company table td{width: 80%;border-bottom: 1px solid #ccc;padding: 10px 15px;text-align: left}
@media only screen and (max-width: 991px) {
  table{font-size: 12px;}

#company table th{width: 100%;display: block;}
#company table td{width: 100%;display: block;}

}

/*質問*/
#faq h2{display: block;text-align: left;margin-bottom: 30px;margin-top: 0;font-size: 24px;font-weight: bold;}
#faq h3{display: block;text-align: left;margin-bottom: 30px;margin-top: 80px;font-size: 22px;border-left: 5px solid #b30000;padding-left: 10px;}
#faq p{text-align: left;margin-bottom: 35px;margin-top: 0;font-size: 15px;}
#faq .container{padding-top: 50px;padding-bottom: 50px;}
#faq .col-12{padding: 0 0 30px 0;}


.qa-6 {
  max-width: 100%;
  margin-bottom: 5px;
  border-bottom: 1px solid #d6dde3;
}

.qa-6 summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  padding: 1em 2em 1em 1.5em;
  color: #333333;
  font-weight: 600;
  cursor: pointer;
}

.qa-6 summary::before,
.qa-6 div::before {
  position: absolute;
  left: 0em;
  font-weight: 600;
  font-size: 1.3em;
}

.qa-6 summary::before {
  color: #b30000;
  content: "Q";
}

.qa-6 summary::after {
  transform: translateY(-25%) rotate(45deg);
  width: 7px;
  height: 7px;
  margin-left: 10px;
  border-bottom: 1px solid #333333b3;
  border-right: 1px solid #333333b3;
  content: '';
  transition: transform .5s;
}

.qa-6[open] summary::after {
  transform: rotate(225deg);
}

.qa-6 div {
  position: relative;
  transform: translateY(-10px);
  opacity: 0;
  margin: 0;
  padding: 0em 0 0 1.5em;
  color: #333;
  transition: transform .5s, opacity .5s;
}

.qa-6[open] div {
  transform: none;
  opacity: 1;
}

.qa-6 div::before {
  color: #e88a8a;
  line-height: 1.2;
  padding: 0em 0 0 0.1em;
  content: "A";
}

/* 詳細ページ */
#detail h2{display: block;text-align: left;margin-bottom: 30px;margin-top: 0;font-size: 24px;font-weight: bold;}
  #detail h3{display: block;text-align: left;margin-bottom: 30px;margin-top: 0;font-size: 22px;border-left: 5px solid #b30000;padding-left: 10px;}
  #detail p{text-align: left;margin-bottom: 35px;margin-top: 0;font-size: 15px;}
  #detail .container{padding-top: 50px;padding-bottom: 50px;}
  #detail .col-12{padding: 0 0 30px 0;}
  #detail table{width: 100%;margin-bottom: 50px;font-size: 15px;}
  #detail table th{width: 10%;border: 1px solid #ccc;padding: 10px 15px;text-align: center;}
  #detail table td{width: 80%;border: 1px solid #ccc;padding: 10px 15px;text-align: left}
  #detail table .color_left{background-color: #ffd4d4;color: #111;}
  #detail table .color_top{background-color: #b30000;color: #FFF;}
  @media only screen and (max-width: 991px) {
    #detail table{font-size: 12px;}

  }
  #detail .attendance_button{text-align: center;font-size: 15px;}
  /* 004 */
  #detail .attendance_button a {
  text-decoration: none;
    background: #eee;
    border-radius: 50px;
    position: relative;
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin: 0 auto;
    max-width: 100%;
    padding: 10px 25px;
    color: #313131;
    transition: 0.3s ease-in-out;
    font-weight: 500;
}
#detail .attendance_button a:after {
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.2s ease-in-out;
    content: "\f0da";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    transform: translateY(-50%);
}
#detail .attendance_button a:hover {
    background: #b30000;
    color: #FFF;
}



/* 共通 */

/* ボタンデザイン */
.button001 a {
  background: #313131;
  border-radius: 3px;
  position: relative;
  display: flex;
  justify-content: space-around;
  max-width: 180px;
  font-size: 12px;
  padding: 5px 20px;
  color: #FFF;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  text-decoration: none;
  margin-bottom: 30px;
}
.button001 a:hover {
  background: #b30000;
  color: #FFF;
}
.button001 a:after {
  content: '';
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  right: 20px;
  border-radius: 1px;
  transition: 0.3s ease-in-out;
}
.button001 a:hover:after {
  border-color: #FFF;
}


.button100 a {
  background: #313131;
  border-radius: 3px;
  position: relative;
  display: flex;
  justify-content: space-around;
  width: 100%;
  font-size: 12px;
  padding: 5px 20px;
  color: #FFF;
  transition: 0.3s ease-in-out;
  font-weight: 500;
  text-decoration: none;
  margin-bottom: 30px;
}
.button100 a:hover {
  background: #b30000;
  color: #FFF;
}
.button100 a:after {
  content: '';
  width: 7px;
  height: 7px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  top: 50%;
  right: 20px;
  border-radius: 1px;
  transition: 0.3s ease-in-out;
}
.button100 a:hover:after {
  border-color: #FFF;
}


.buttonSubmit {
	padding: 7px 30px;
	border: 1px solid #b30000;
	border-radius: 3px;
	background: #b30000;
	font-size: 16px;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
}

.buttonSubmit:hover {
	cursor: pointer;
	background: #ce1e1e;
	border: 1px solid #ce1e1e;
}

.buttonReturn {
	padding: 7px 30px;
	border: 1px solid #313131;
	border-radius: 3px;
	background: #313131;
	font-size: 16px;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
}

.buttonReturn:hover {
	cursor: pointer;
	background: #7c6c6c;
	border: 1px solid #7c6c6c;
}





 /* 言語切り替えボタン */
.lang_gtranslate{position: relative;}
.gtranslate_wrapper{position: absolute;top:-5px;right: 0;z-index: 99;}
#gt_float_wrapper{background-color: none !important;padding-bottom: 0;}
.gt_float_switcher{background-color: #FFF;box-shadow: none !important;font-size: 14px !important;margin-bottom: 0;text-align: left !important;}
.top_icon3{
width: 40%;
position: relative;
}
@media only screen and (max-width: 991px) {
.gtranslate_wrapper{position: fixed;right: auto;bottom: 10px !important;z-index: 99;top: auto;left: 10px;} 
}

 /* お問い合わせ */


/* -- #mail_form, dl, dt, dd -------------------------------------------------------------------------------- */

#mail_form * {
	margin: 0;
	padding: 0;
	box-sizing: content-box;
}



#mail_form dl {
	width: 100%;
	margin: 0 auto;
	border-bottom: 1px solid #cccccc;
}

#mail_form dl:after,
#mail_form dl dt:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#mail_form dl dt {
	width: 30%;
	float: left;
	padding: 35px 0 25px;
	text-align: right;
}

#mail_form dl dd {
	width: 65%;
	float: right;
	padding: 30px 0 25px 5%;
}

#mail_form dl dt i {
	float: left;
  font-style: normal;
	position: relative;
	top: -2px;
}




/* -- span.required, span.optional -------------------------------------------------------------------------------- */

#mail_form dl dt span.required,
#mail_form dl dt span.optional {
	display: inline-block;
	font-size: 75%;
	color: #ffffff;
	padding: 4px 10px;
	border-radius: 3px;
}

#mail_form dl dt span.required {
	background: #d9534f;
	border: 1px solid #d43f3a;
}

#mail_form dl dt span.optional {
	background: #337ab7;
	border: 1px solid #2e6da4;
}




/* -- error message -------------------------------------------------------------------------------- */

#mail_form dl dd span.error_blank,
#mail_form dl dd span.error_format,
#mail_form dl dd span.error_match {
	display: block;
	color: #ff0000;
	margin-top: 5px;
}




/* -- loading -------------------------------------------------------------------------------- */

div.loading-layer {
	width: 100vw;
	height: 100vh;
	background: rgba( 0, 0, 0, 0.7 );
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: 10000;
}

span.loading {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border-top: 5px solid rgba( 255, 255, 255, 0.2 );
	border-right: 5px solid rgba( 255, 255, 255, 0.2 );
	border-bottom: 5px solid rgba( 255, 255, 255, 0.2 );
	border-left: 5px solid #ffffff;
	-webkit-transform: translateZ( 0 );
	-ms-transform: translateZ( 0 );
	transform: translateZ( 0 );
	-webkit-animation: load-circle 1.0s linear infinite;
	animation: load-circle 1.0s linear infinite;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -30px;
}

@-webkit-keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}

@keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}




/* -- input, select, textarea -------------------------------------------------------------------------------- */

#mail_form input[type="text"],
#mail_form input[type="email"],
#mail_form input[type="password"],
#mail_form input[type="tel"] {
	width: calc( 100% - 4% - 2px );
	padding: 7px 2%;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	font-size: 16px;
	font-family: inherit;
	line-height: normal;
}

#mail_form input[type="text"]:focus,
#mail_form input[type="email"]:focus,
#mail_form input[type="password"]:focus,
#mail_form input[type="tel"]:focus,
#mail_form textarea:focus {
	box-shadow: 0px 0px 5px #55ccff;
	border: 1px solid #55ccff;
	background: #ffffff;
}

#mail_form ul li input[type="radio"],
#mail_form ul li input[type="checkbox"] {
	margin: 0 10px 0 0;
}

#mail_form select {
	padding: 7px 2%;
	border: 1px solid #cccccc;
	font-size: 16px;
	font-family: inherit;
	line-height: normal;
}

#mail_form textarea {
	display: block;
	width: calc( 100% - 4% - 2px );
	height: 200px;
	padding: 7px 2%;
	resize: vertical;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	font-size: 16px;
	font-family: inherit;
	line-height: normal;
}




/* -- ul, li -------------------------------------------------------------------------------- */

#mail_form ul {
	list-style-type: none;
}

#mail_form ul li label {
	display: block;
	margin-top: 10px;
	padding: 7px 2%;
	border-radius: 3px;
	background: #f0f0f0;
}

#mail_form ul li:first-child label {
	margin-top: 0px;
}

#mail_form ul li label:hover {
	cursor: pointer;
	background: #e0e0e0;
}




/* -- input design -------------------------------------------------------------------------------- */

#mail_form input[name="company"] {
	width: 70%;
}


#mail_form input[name="mail_address"],
#mail_form input[name="mail_address_confirm"] {
	width: 80%;
}

#mail_form input[name="postal"] + a {
	display: inline-block;
	padding: 7px 20px;
	border: 1px solid #46b8da;
	border-radius: 3px;
	background: #5bc0de;
	font-size: 16px;
	line-height: normal;
	color: #ffffff;
	text-decoration: none;
}

#mail_form input[name="postal"] + a:hover {
	cursor: pointer;
	background: #31b0d5;
	border: 1px solid #269abc;
}




/* -- button -------------------------------------------------------------------------------- */

#mail_form p#form_submit {
	width: 100%;
	margin: 0 auto;
	padding: 30px 0;
}

#mail_form input[type="button"] {
	padding: 7px 30px;
	border: 1px solid #b30000;
	border-radius: 3px;
	background: #b30000;
	font-size: 16px;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
}

#mail_form input[type="button"]:hover {
	cursor: pointer;
	background: #ce1e1e;
	border: 1px solid #ce1e1e;
}

#mail_form input[type="button"] {
	margin: 0 auto;
}

#form_submit{text-align: center !important;}






/* -- responsive ----------------------------------------------------------------------------------------------------------------------- */

/* 1000pixel start */
@media screen and ( max-width: 1000px ) {


/* -- #mail_form, dl, dt, dd -------------------------------------------------------------------------------- */

#mail_form {
	width: 95%;
	font-size: 100%;
}

#mail_form dl dt {
	width: auto;
	float: none;
	padding: 25px 0 10px;
	text-align: left;
	font-weight: bold;
}

#mail_form dl dd {
	width: auto;
	float: none;
	padding: 0px 0 20px 0px;
}

#mail_form dl dt i {
	float: none;
	position: static;
	font-weight: normal;
}



/* -- span.required, span.optional -------------------------------------------------------------------------------- */

#mail_form dl dt span.required,
#mail_form dl dt span.optional {
	margin: 0 15px 0 0;
}




/* -- input design -------------------------------------------------------------------------------- */

#mail_form input[name="phone"],
#mail_form input[name="schedule"] {
	width: 60%;
}




/* -- button -------------------------------------------------------------------------------- */

#mail_form p#form_submit {
	padding: 25px 0;
}

#mail_form input[type="button"] {
	margin-left: 0;
}


}
/* 1000pixel end */



.no-style * {
  margin: 0 !important;
  padding: 0 !important;
}

.noview{
	display: none;
}
