@charset "utf-8";

/*
Theme Name: FAKE Child
Theme URI: 
Description: WordPressテーマ「FAKE」の子テーマ
Author: Design Plus
Author URI: http://design-plus1.com/tcd-w/
Version: 1.0
Text Domain: tcd-w-child
Domain Path: /languages
Template: fake_tcd074
*/

/* ------------------------------------------------------------------------------------
 web fonts　ウェブフォントファイルを変更した場合はv=1.0の数字を変更（キャッシュ対策）
------------------------------------------------------------------------------------ */
@font-face {
  font-family: 'design_plus';
  src: url('fonts/design_plus.eot?v=1.6');
  src: url('fonts/design_plus.eot?v=1.6#iefix') format('embedded-opentype'),
       url('fonts/design_plus.woff?v=1.6') format('woff'),
       url('fonts/design_plus.ttf?v=1.6') format('truetype'),
       url('fonts/design_plus.svg?v=1.6#design_plus') format('svg');
  font-weight: normal;
  font-style: normal;
}


/* ----------------------------------------------------------------------
 reset css
---------------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video
 { margin:0; padding:0; border:0; outline:0; font-size:100%; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display:block; }
html { overflow-y: scroll; -webkit-text-size-adjust:100%; }
ul, ol { list-style:none; }
blockquote , q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content: none; }
a:focus { outline:none; }
ins { text-decoration:none; }
mark { font-style:italic; font-weight:bold; }
del { text-decoration:line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; width:100%; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
button, input, select, textarea { outline:0; -webkit-box-sizing:border-box; box-sizing:border-box; font-size:100%; }
input, textarea { background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); -webkit-appearance: none; border-radius:0; /* Removing the inner shadow, rounded corners on iOS inputs */ }
input[type="checkbox"]{ -webkit-appearance: checkbox; }
input[type="radio"]{ -webkit-appearance: radio; }
button::-moz-focus-inner, input::-moz-focus-inner { border:0; padding:0; }
iframe { max-width:100%; }

/* clearfix */
.clearfix::after { display:block; clear:both; content:""; }




/* ----------------------------------------------------------------------
 基本設定
---------------------------------------------------------------------- */
html { }
body { font-family:Arial,sans-serif; font-size:18px; line-height:1; width:100%; position:relative; -webkit-font-smoothing:antialiased; }
.pc body.admin-bar { padding-top:32px; /* background:url(img/bg.png) repeat;*/}
@media screen and (max-width: 600px){body {min-width: initial;}}
a { text-decoration:none; }
a, a:before, a:after, input {
  -webkit-transition-property:background-color, color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:background-color, color; transition-duration:0.2s; transition-timing-function:ease;
}
.clear { clear:both; }
.hide { display:none; }

@media screen and (max-width: 480px){
h2{font-size:135% !important;}
}

/* レイアウト */
#container { position:relative; height:100%; margin: 0 auto; }
#main_contents {
   /* min-width:1250px; */
   margin:0 auto; padding:0 0 150px; }
#single{ width:1250px; margin:0 auto; padding:0 0 150px; }
body.single-post #main_contents { padding-bottom:90px; }

@media screen and (max-width: 480px){
#container {width:100% !important; position:relative; height:100%; margin:0 !important;}
#main_contents {min-width:auto; width:100% !important; margin:0 !important; padding:0;}
#single{ width:100%; margin:0 auto; padding:0; }
}

/* モバイル用キャッチフレーズと説明文を置き換え */
.has_mobile_word span.mobile { display:none; }




/* ----------------------------------------------------------------------
 メガメニュー
---------------------------------------------------------------------- */
.pc .megamenu_button + ul { display:none !important; }
.pc #global_menu > ul > li.active_button > a:after { top:0; }

.megamenu_blog_list {
  display:none; overflow:hidden; width:100%; position:absolute; top:100px; z-index:100;
  left:0; right:0; margin:auto; background:#222;
}
.megamenu_blog_list_inner {
  width:1000px; margin:0 auto; position:relative; background:#000; border-left:1px solid #444;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.megamenu_blog_list .menu_area { width:200px; }
.megamenu_blog_list .menu_area a { display:block; color:#fff; background:none; height:50px; line-height:50px; padding:0 25px; }
.megamenu_blog_list .menu_area a:hover, .megamenu_blog_list .menu_area li.active a { background:#333; color:#fff; }
.megamenu_blog_list .post_list_area { width:calc(100% - 200px); }
.megamenu_blog_list .post_list {
  display:none; padding:0; min-height:600px; background:#333;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.megamenu_blog_list .post_list:first-child { display:block; }
.megamenu_blog_list .post_list li { width:25%; height:200px; float:left; margin:0; }
.megamenu_blog_list .post_list li:nth-child(3n) { margin-right:0; }
.megamenu_blog_list .post_list li a.link { display:block; width:100%; height:100%; position:relative; overflow:hidden; }
.megamenu_blog_list .post_list li .title {
  color:#fff; line-height:1.6; padding:0 20px; font-size:14px; overflow:hidden; font-weight:normal; max-height:4.8em; z-index:2;
  position:absolute; left:0px; bottom:15px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.megamenu_blog_list .post_list li .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.megamenu_blog_list .post_list li .overlay {
  width:100%; height:50%; position:absolute; z-index:1; left:0px; bottom:0px;
  background: -webkit-linear-gradient(top, transparent, rgba(0,0,0,0.8));
  background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.8));
}
.megamenu_blog_list .post_list .image { width:100%; height:100%; }
body.header_fix .megamenu_blog_list { position:fixed; top:100px; }
body.admin-bar.header_fix .megamenu_blog_list { top:110px; }




/* ----------------------------------------------------------------------
 実績　アーカイブページ・カテゴリーページ
---------------------------------------------------------------------- */
/* 実績一覧（全ページ共通） */
.work_list {
  margin:0 -10px 0 0;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
.work_list .item { width:calc(100% / 3 - 10px); margin:0 10px 33px 0; position:relative; }
.work_list .item .link { display:block; width:100%; height:100%; }
.work_list .item .image_wrap_inner { width:100%; height:260px; margin:0 0 12px 0; overflow:hidden; position:relative; }
.work_list .item .image { width:100%; height:100%; }
.work_list .item .title {
  text-align:center; font-weight:normal; line-height:1.6;  max-height:3.2em; overflow:hidden; color:#000;
  -webkit-transition-property:color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:color; transition-duration:0.2s; transition-timing-function:ease;
}
.work_list .item .link:hover .title { color:#666; }
.work_list .item .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.work_list .category { position:absolute; bottom:0; left:0; font-size:14px; font-weight:bold; width:100%; padding:50px 0 16px; text-align:center; z-index:10; }



/* アーカイブページ --------------------------------- */
#archive_work { padding:45px 0 0 0; width:1250px; margin:0 auto; overflow:hidden; }
.work_area { padding-top:52px; }
.pc body.use_header_fix .work_area { padding-top:152px; margin-top:-100px; }
.work_area:last-of-type { margin-bottom:110px; }
.work_area_top .headline { font-size:30px; line-height:1.4; font-weight:500; text-align:center; }
.work_area_top .desc { font-size:16px; line-height:2.5; margin:20px 0 0 0; }
.work_area .work_list { margin:60px -10px 0 0; }
.work_area .work_list.animation_type1 .item.animate {
  -webkit-animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
  animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
}
.work_area .work_list.animation_type2 .item.animate {
  -webkit-animation: popup 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
  animation: popup 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
}
.work_area .work_list.animation_type3 .item.animate {
  -webkit-animation: slideUp 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
  animation: slideUp 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0.0s;
}


/*
カテゴリータブ
固定ページでも使っている為、ページヘッダー箇所にまとめて記述
*/


/* ソートボタン */
.work_area .child_category_list { margin:48px 0 0 0; text-align:left; }
.work_area .child_category_list .headline {
  border:1px solid #ddd; font-weight:normal; height:60px; line-height:60px; padding:0 30px; font-size:16px; position:relative; cursor:pointer;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.work_area .child_category_list .headline:before {
  color:#333; font-family:'design_plus'; content:'\e90e'; font-size:12px; display:block; width:12px; height:12px;
  position:absolute; right:30px; top:3px; margin:auto;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.work_area .child_category_list.open .headline:before { content:'\e911'; }
.work_area .child_category_list .headline:hover { background:#fafafa; }
.work_area .child_category_list .sort_button { display:none; }
.work_area .child_category_list ul {
  background:#eee; padding:28px 0 16px 28px;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
}
.work_area .child_category_list ul li { width:calc(100% / 3 - 18px); margin:0 12px 12px 0; }
.work_area .child_category_list ul li a { display:block; height:60px; line-height:60px; text-align:center; background:#fff; }
.work_area .child_category_list ul li a:hover, .work_area .child_category_list ul li a.active { background:#a33f37; color:#fff; }
.work_area .child_category_list ul li a.active { pointer-events:none; }


/* アニメーションの設定 */
/*
.scroll_effect { opacity:0; }
.scroll_effect.no_animate { opacity:1; }
.scroll_effect.animation_item1.animate {
  -webkit-animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1.0s;
  animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1.0s;
}
.scroll_effect.animation_item2.animate {
  -webkit-animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1.5s;
  animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 1.5s;
}
.scroll_effect.animation_item3.animate {
  -webkit-animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}
.scroll_effect.animation_item4.animate  {
  -webkit-animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.5s;
  animation: opacityAnimation 2.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.5s;
}
*/


/* カテゴリーページ ----------------------------------- */
#category_work { padding:50px 0 110px 0; width:1250px; margin:0 auto; overflow:hidden; }
#category_work .work_list { margin-top:10px; }




/* ----------------------------------------------------------------------
 実績　詳細ページ
---------------------------------------------------------------------- */
body.single-work #main_contents { padding:52px 0 110px 0; }


/* タイトル */
#single_work_title_area { border-bottom:1px solid #ddd; padding:60px 0 50px; }
#single_work_title_area .category { text-align:center; font-size:0; margin:0 0 25px 0; }
#single_work_title_area .category li {
  display:inline-block; min-width:100px; height:35px; line-height:35px; margin:0; padding:0; font-size:12px; color:#fff;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#single_work_title_area .category li a { background:#000; color:#fff; display:block; padding:0 20px; }
#single_work_title_area .category li span { display:block; padding:0 20px; }
#single_work_title_area .title { font-size:32px; line-height:1.3; font-weight:500; margin:0; text-align:center; }


/* コンテンツ*/
.work_content { margin:0 0 60px 0; }


/* キャッチフレーズ */
.single_work_catch { text-align:center; font-size:30px; line-height:1.5; margin:0 0 40px 0; }


/* 説明文１ */
.single_work_desc { margin:0 0 50px 0; }


/* 画像 */
.single_work_image_list { margin:0; }
.single_work_image_list .large { display:block; width:100%; height:auto; max-width:100%; margin:0 0 10px 0; }
.single_work_image_list .small { float:left; display:block; width:calc(50% - 5px); margin:0 10px 10px 0; height:auto; max-width:100%; }
.single_work_image_list .small + .large { clear:left; }
.single_work_image_list .small.even { margin-right:0; }
.single_work_image_list .large:last-child, .single_work_image_list .small:last-child { margin-bottom:0; }
.single_work_image_list .small:nth-last-child(2) { margin-bottom:0; }


/* データ一覧 */
.work_data_list dl {
  font-size:14px; border-left:1px solid #ddd; border-top:1px solid #ddd; margin:0;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
}
.work_data_list dt {
  width:170px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; line-height:2.2; padding:16px 25px 14px; position:relative; background:#f8f8f8;
  -webkit-box-sizing:border-box; box-sizing:border-box;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
  -ms-justify-content:center; -webkit-justify-content:center; justify-content:center;
  -ms-align-items:center; -webkit-align-items:center; align-items:center;
}
.work_data_list dd {
  -webkit-width:calc(100% - 170px); width:calc(100% - 170px); padding:16px 25px 14px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; line-height:2.2;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.work_data_list .link_button { text-align:center; margin:60px 0 0 0; }
.work_data_list .link_button a {
  background:#000; color:#fff; display:inline-block; min-width:250px; height:60px; line-height:60px; padding:0 20px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}


/* ナビゲーション */
#next_prev_post2 { margin:100px 0 0 0; }
#next_prev_post2 .item { float:left; height:120px; width:50%; position:relative; }
#next_prev_post2 a {
  display:block; position:relative; width:100%; height:100%; color:#000; border:1px solid #ddd;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#next_prev_post2 a:hover { background:#fafafa !important; color:#000; }
#next_prev_post2 .item:first-child a { border-right:none; }
#next_prev_post2 .item:only-child a { border-right:1px solid #ddd; }
#next_prev_post2 .title_area {
  float:left; height:120px; width:calc(100% - 120px); position:relative;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#next_prev_post2 .title {
  font-size:16px; line-height:1.6; max-height:3.2em; overflow:hidden; position:absolute; text-align:center; width:100%; padding:0 30px;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#next_prev_post2 .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#next_prev_post2 .nav { display:none; }
#next_prev_post2 .image_wrap { width:120px; height:120px; display:block; margin:-1px; position:relative; z-index:2; overflow:hidden; float:left; }
#next_prev_post2 .image_wrap_inner { width:100%; height:100%; }
#next_prev_post2 .image { width:100%; height:100% !important; display:block; -webkit-backface-visibility:hidden; backface-visibility:hidden; }
#next_prev_post2 .next_post { float:right; }
#next_prev_post2 .next_post .image_wrap { float:right; }


/* 関連記事 */
#related_work_list { margin-top:100px; width:1250px; overflow:hidden; }
#related_work_list .headline { font-size:22px; line-height:1; font-weight:500; text-align:center; margin:0 0 60px 0; }




/* ----------------------------------------------------------------------
 デザインページ
---------------------------------------------------------------------- */
#design_page1 #design_content_id4.design_content:last-of-type,
#design_page1 #design_content_id3.design_content:last-of-type {
  padding-bottom:100px;
}


/* キャッチフレーズと文章の組み合わせ */
.dc_content { width:1250px; margin:0 auto; padding:92px 0 92px; }
.dc_content .catch { text-align:center; font-size:30px; line-height:1.5; margin:0; }
.dc_content .catch.catch2 { margin-top:82px; }
.dc_content .sub_title { font-weight:bold; text-align:center; font-size:14px; line-height:1; margin:0 0 20px 0; }
.dc_content .post_content { margin:40px 0 0 0; }
.dc_content .post_content p:last-of-type { margin-bottom:0; }
.dc_image { display:block; margin:0; padding:50px 0 10px 0; width:100%; height:auto; max-width:100%; }


/* 固定ヘッダー利用時のスクロールfix */
.pc body.use_header_fix #design_content_id1, .pc body.use_header_fix #design_content_id2,
.pc body.use_header_fix #design_content_id3, .pc body.use_header_fix #design_content_id4 {
  padding-top:100px; margin-top:-100px;
}


/* 画像コンテンツ */
.dc_image_content { height:520px; overflow:hidden; position:relative; }
.dc_image_content_inner { width:1250px; height:520px; margin:0 auto; position:relative; }
.dc_image_content .caption {
  position:absolute; left:0px; right:0px; z-index:3;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.dc_image_content .catch { font-size:30px; line-height:1.5; margin:0; }
.dc_image_content .title { font-size:20px; line-height:1.5; margin:12px 0 0 0; font-weight:500; }
.dc_image_content .title span { font-size:14px; display:block; font-weight:normal; }
.dc_image_content .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:2; }
.dc_image_content .bg_image { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:1; }
.dc_image_content .tab {
  position:absolute; top:0px; left:0px; z-index:10; padding:0 20px; text-align:center;
  min-width:190px; height:60px; line-height:60px; font-size:14px; font-weight:bold;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.dc_image_content_inner.direction_type2 .caption { text-align:center; }
.dc_image_content_inner.direction_type3 .caption { text-align:right; }
.dc_image_content_inner.direction_type2 .tab { left:50%; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); }
.dc_image_content_inner.direction_type3 .tab { left:auto; right:0px; }


/* メッセージリスト */
.dc_message_list { width:1250px; margin:50px auto 10px; }
.dc_message_list .item { height:170px; margin:20px 0 0 0; position:relative; }
.dc_message_list .catch {
  font-size:22px; line-height:1.5; margin:0; font-weight:500;
  position:absolute; left:0px; right:0px; z-index:2; text-align:center;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}


/* データリスト */
.dc_data_list { width:1250px; padding:92px 0 0px; margin:0 auto; }
#design_page3 .design2_content:last-of-type .dc_data_list { padding:92px 0 150px; }
.dc_data_list .catch { text-align:center; font-size:26px; line-height:1.5; margin:0 0 50px 0; }
.dc_data_list dl {
  border-left:1px solid #ddd; border-top:1px solid #ddd; margin:0;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
}
.dc_data_list dt {
  width:170px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; line-height:2.2; padding:16px 25px 14px; position:relative; background:#f8f8f8;
  -webkit-box-sizing:border-box; box-sizing:border-box;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex;
  -ms-flex-wrap:wrap; -webkit-flex-wrap:wrap; flex-wrap:wrap;
  -ms-justify-content:space-between; -webkit-justify-content:space-between; justify-content:space-between;
  -ms-justify-content:center; -webkit-justify-content:center; justify-content:center;
  -ms-align-items:center; -webkit-align-items:center; align-items:center;
}
.dc_data_list dd {
  -webkit-width:calc(100% - 170px); width:calc(100% - 170px); padding:16px 25px 14px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; line-height:2.2;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.dc_data_list .link_button { text-align:center; margin:60px 0 0 0; }
.dc_data_list .link_button a {
  display:inline-block; min-width:250px; height:60px; line-height:60px; padding:0 20px; background:#000000; color:#fff; font-size:16px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.dc_data_list .link_button a:hover { background:#333333; color:#fff; }


/* Google Map */
#access_info { padding:92px 0 0 0; }
#access_info .catch { text-align:center; font-size:26px; line-height:1.5; margin:0 0 50px 0; }
#access_google_map { width:100%; height:520px; }
#access_google_map .pb_googlemap_embed { width: 100%; height: 520px; }
#access_google_map .pb_googlemap_custom-overlay-inner { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: -94px; left: -40px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 80px !important; height: 80px !important; border-radius: 50%; font-size: 18px; text-align: center; }
#access_google_map .pb_googlemap_custom-overlay-inner::after { display: block; position: absolute; right: 0; bottom: -15px; left: 0; width: 0; height: 0; margin: auto; border-width: 16px 5px 0 5px; border-style: solid; content: ""; }
#access_data { width:1250px; margin:0 auto; text-align:center; padding:60px 0 0; }
#access_data .top_area { margin:0 0 60px 0; }
#access_data .bottom_area { margin:0 0 50px 0; }
#access_data .logo { display:block; margin:0 auto 23px; }
#access_data .desc { line-height:2; margin:0 0 -8px 0; }
#access_data .desc2 { margin:52px 0 -8px 0; }
#access_data .link_button { text-align:center; }
#access_data .link_button a {
  display:inline-block; min-width:250px; height:60px; line-height:60px; padding:0 20px; background:#000000; color:#fff; font-size:16px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#access_data .link_button a:hover { background:#333333; color:#fff; }




/* ----------------------------------------------------------------------
 トップページ　その他
---------------------------------------------------------------------- */

video.mainmovie{width:100%; z-index:1; background:#000;}
.maincatch{}

/* ニュースティッカー */
#index_news {
  width:1250px; height:60px; overflow:hidden; background:rgba(0,0,0,0.5); z-index:10;
  position:absolute; bottom:0px; left:0; right:0; margin:auto;
  -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0);
}
#index_news.animate {
  -webkit-transform: translate3d(0,0%,0); transform: translate3d(0,0%,0);
  -webkit-transition: -webkit-transform 0.35s 2.0s; transition: transform 0.35s 2.0s;
}
#index_news a {
  display:block; width:100%; height:60px; line-height:60px; color:#fff; padding:0 30px; font-size:15px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#index_news .date { width:100px; float:left; }
#index_news .title { width:calc(100% - 100px); float:left; font-weight:normal; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }


/* コンテンツビルダー　共通パーツ */
.cb_contents .link_button { text-align:center; }
.cb_contents .link_button a {
  background:#000; color:#fff; display:inline-block; min-width:250px; height:60px; line-height:60px; padding:0 20px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
/* .cb_contents.last { padding-bottom:150px; } */


/* コンテンツ1 */
.index_content1 { width:1250px; margin:0 auto; padding:95px 0 100px; }
.index_content1 .catch { text-align:center; font-size:30px; line-height:1.5; margin:0 0 35px 0; }
.index_content1 .desc { font-size:16px; line-height:2.5; margin:0 0 50px 0; }
.index_content1 .image_list { margin:0 0 50px 0; }
.index_content1 .image_list img { display:block; width:calc(100% / 3 - 0.01px); height:auto; margin:0; float:left; }


/* コンテンツ2 */
.index_content2 { width:1250px; margin:0 auto; padding:95px 0 100px; }
.index_content2 .catch { text-align:center; font-size:30px; line-height:1.5; margin:0 0 35px 0; }
.index_content2 .desc { font-size:16px; line-height:2.5; margin:0 0 50px 0; }
.index_content2 .image_content { width:100%; height:250px; margin:0 0 50px 0; position:relative; }
.index_content2 .image_content .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; background:rgba(0,0,0,0.3); z-index:1; }
.index_content2 .image_content .catch {
  font-size:22px; color:#fff; line-height:1.5; margin:0;
  position:absolute; left:0px; right:0px; z-index:3;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.index_content2 .image_content .link_button { position:absolute; bottom:0px; left:0px; right:0px; z-index:2; }


/* 実績一覧 */
.index_work_list { width:1250px; margin:0 auto; padding:100px 0; overflow:hidden; }
.index_work_list .link_button { margin-top:20px; }


/* カルーセル */
.index_carousel { width:100%; height:520px; overflow:hidden; position:relative; }
.index_carousel .item { width:calc(100% / 3); height:520px; overflow:hidden; }
.index_carousel .item .link { width:100%; height:100%; position:relative; display:block; }
.index_carousel .item .link.no_link { pointer-events:none; }
.index_carousel .caption { position:absolute; bottom:35px; padding:0 40px; z-index:3; }
.index_carousel .catch { font-size:20px; line-height:1.6; margin:0; font-weight:normal; }
.index_carousel .title { font-size:20px; line-height:1.6; margin:0; font-weight:normal; margin-top:25px;}
.index_carousel .title span { display:block; font-size:14px; }
.index_carousel .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; background:rgba(0,0,0,0.3); z-index:2; }
.index_carousel .image { width:100%; height:100% !important; position:absolute; top:0px; left:0px; z-index:1; }
.index_carousel .slick-arrow {
  border:none; background:none; width:24px; height:24px; overflow:hidden; text-indent:-400px; position:absolute; z-index:9; cursor:pointer;
  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
.index_carousel .slick-prev { position:absolute; left:30px; top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.index_carousel .slick-next { position:absolute; right:30px; top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.index_carousel .slick-arrow:after {
  display:block; font-family:'design_plus'; font-size:24px; width:24px; height:24px; line-height:24px; color:#fff; position:absolute; text-indent:0;
  -webkit-transition-property:color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:color; transition-duration:0.2s; transition-timing-function:ease;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.index_carousel .slick-prev:after { content:'\e90f'; top:0px; left:0px; }
.index_carousel .slick-next:after { content:'\e910'; top:0px; left:0px; }
.index_carousel .slick-arrow:hover:after { color:#999; }


/* パララックスコンテンツ */
.index_parallax { width:100%; height:520px; overflow:hidden; position:relative; }
.index_parallax .caption {
  font-size:22px; color:#fff; line-height:1.5; margin:auto; z-index:3; text-align:center;
  width:1250px; margin:0 auto; position:absolute; left:0; right:0;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.index_parallax.direction_type1 .caption .desc { text-align:left; }
.index_parallax.direction_type3 .caption .desc { text-align:right; }
.index_parallax .catch { font-size:30px; line-height:1.5; margin:0 0 35px 0; }
.index_parallax .desc { font-size:16px; line-height:2.5; }
.index_parallax .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; background:rgba(0,0,0,0.3); z-index:2; }
.index_parallax .bg_image { width:100%; height:170%; position:absolute; top:0px; left:0px; z-index:1; }
.slick-list { padding:0 !important; }




/* ----------------------------------------------------------------------
 トップページ　スライダー
---------------------------------------------------------------------- */
#index_header_content { width:100%; height:0; position:relative; overflow:hidden; display: none !important;}
.pc #index_header_content.height_type2 { height:100vh; }
#index_slider_wrap { width:100%; height:0; position:relative; display: none !important;}
#index_slider { width:100%; height:100%; overflow:hidden; position:relative; }
#index_slider .item { width:100%; height:100%; position:relative; opacity:1 !important; }


/* 画像 */
#index_slider .item .slice_image { width:calc(100% / 8 - 0.01px); height:1000px; float:left; position:relative; overflow:hidden; }
.pc #index_header_content.height_type2 #index_slider .item .slice_image { height:100vh; }
#index_slider .item .image_wrap { width:100%; height:100%; overflow:hidden; position:absolute; left:0; top:0px; }
#index_slider .item .image {
  width:800%; height:100%; z-index:2;
  background-repeat:none; background-size:cover; background-position:center;
  position:absolute; left:0px; top:0px;
}
#index_slider .item .slice_image:nth-child(1) .image { left:0px; }
#index_slider .item .slice_image:nth-child(2) .image { left:-100%; }
#index_slider .item .slice_image:nth-child(3) .image { left:-200%; }
#index_slider .item .slice_image:nth-child(4) .image { left:-300%; }
#index_slider .item .slice_image:nth-child(5) .image { left:-400%; }
#index_slider .item .slice_image:nth-child(6) .image { left:-500%; }
#index_slider .item .slice_image:nth-child(7) .image { left:-600%; }
#index_slider .item .slice_image:nth-child(8) .image { left:-700%; }
#index_slider .slice_image_list.mobile { display:none; }


/* 動画 */
#index_video { width:100%; height:100%; position:relative; overflow:hidden; }
#index_video_mp4 { position:absolute; z-index:2; object-fit: cover; }
#video_poster { width:100%; height:100%; position:absolute; z-index:1; }

@media screen and (max-width: 480px){
#index_header_content { width:100%; height:300px !important; position:relative; overflow:hidden; }
.pc #index_header_content.height_type2 { height:100vh; }
#index_slider_wrap { width:100%; height:300px !important; position:relative; }
#index_slider { width:100%; height:300px !important; overflow:hidden; position:relative; }
#index_slider .item { width:100%; height:300px !important; position:relative; opacity:1 !important; }
#index_slider .item .slice_image { width:calc(100% / 8 - 0.01px); height:300px !important; float:left; position:relative; overflow:hidden; }
#index_video { width:100%; height:300px !important; position:relative; overflow:hidden; }
#index_video_mp4 { position:absolute; z-index:2; object-fit: cover; }
#video_poster { width:100%; height:300px !important; position:absolute; z-index:1; }
}

/* キャプション */
#index_slider .caption {
  padding:0; width:1250px; margin:auto; position:absolute; text-align:center; z-index:4;
  left:0px; right:0px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#index_slider .direction_type1 .caption_inner { text-align:left; }
#index_slider .direction_type2 .caption_inner { text-align:center; }
#index_slider .direction_type3 .caption_inner { text-align:right; }
#index_slider .logo { position:relative; }
#index_slider .logo img { display:inline-block; }
#index_slider .catch { line-height:1.3; word-wrap: break-word; position:relative; font-weight:500; margin:0; }
#index_slider .desc { font-size:16px; line-height:1.3; margin:15px 0 0 0; position:relative; }
#index_slider .button {
  font-size:14px; min-width:200px; height:55px; line-height:55px; text-align:center; position:relative; padding:0 60px; margin-top:25px; display:inline-block;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}

#index_slider .caption.mobile { display:none; }


/* 検索エリア */
#index_slider .search_area {
  width:450px; height:50px; position:relative; margin:47px auto 0;
  background:rgba(255,255,255,0.7);
}
#index_slider .direction_type3 .search_area { float:right; }
#index_slider .direction_type1 .search_area { float:left; }
#index_slider .search_input input {
  border:none; background:none; height:50px; position:absolute; left:0px; top:0px; width:400px; padding:0 20px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
#index_slider .search_input input::placeholder { color:#000; opacity:1; }
#index_slider .search_button { position:relative; }
#index_slider .search_button input {
  border:none; background:none; width:50px; height:50px; position:absolute; right:0px; top:0px; overflow:hidden; text-indent:-300px; cursor:pointer; text-align:left;
  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
#index_slider .search_button label {
  overflow:hidden; width:18px; height:18px; text-indent:-300px; cursor:pointer; display:block; text-align:left;
  position:absolute; right:15px; top:18px;
}
#index_slider .search_button label:before {
  text-indent:0; display:block; width:18px; height:18px; line-height:100%; text-align:center; cursor:pointer; z-index:1;
  position:absolute; font-family:'design_plus'; color:#333; font-size:18px; content:'\e915';
  -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
}
#index_slider .search_button:hover label:before { color:#fff; }
#index_slider .search_button:hover input { background:#000; }


/* オーバーレイ */
#index_slider .overlay { position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:3; }


/* アニメーション */
#index_slider .logo_desc_area, #index_slider .button, #index_slider .search_area {
  opacity:0;
}
#index_slider .item.slick-active .caption .item1 {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}
#index_slider .item.slick-active .caption .item2 {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 3.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 3.0s;
}
#index_slider .item.slick-active .caption .item3 {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 4.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 4.0s;
}
/* 最初のアイテム、モバイル・動画用キャプション */
#index_slider .logo_desc_area.animate, #index_slider .button.animate, #index_slider .search_area.animate {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}


/* 画像のアニメーション type1 */
#index_slider.animation_type1 .item .image_wrap {
  animation: index_slider_type1_current 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type1 .item.slick-active .image_wrap {
  animation: index_slider_type1_next 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type1 .item.first_item .image_wrap { left:0px !important; animation:none; }


/* 画像のアニメーション type2 */
#index_slider.animation_type2 .item .image_wrap {
  animation: index_slider_type2_odd_current 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type2 .item .slice_image:nth-child(even) .image_wrap {
  animation: index_slider_type2_even_current 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type2 .item.slick-active .image_wrap {
  animation: index_slider_type2_odd_next 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type2 .item.slick-active .slice_image:nth-child(even) .image_wrap {
  animation: index_slider_type2_even_next 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type2 .item.first_item .image_wrap { left:0px !important; animation:none; }
#index_slider.animation_type2 .item.first_item .slice_image:nth-child(even) .image_wrap { left:0px !important; animation:none; }


/* 画像のアニメーション type3 */
#index_slider.animation_type3 .item .image_wrap {
  animation: index_slider_type3_odd_current 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type3 .item .slice_image:nth-child(even) .image_wrap {
  animation: index_slider_type3_even_current 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type3 .item.slick-active .image_wrap {
  animation: index_slider_type3_odd_next 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type3 .item.slick-active .slice_image:nth-child(even) .image_wrap {
  animation: index_slider_type3_even_next 1.0s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type3 .item.first_item .image_wrap { top:0px !important; animation:none; }
#index_slider.animation_type3 .item.first_item .slice_image:nth-child(even) .image_wrap { top:0px !important; animation:none; }


/* 画像のアニメーション type4 */
#index_slider.animation_type4 .item { opacity: 0 !important; -webkit-transition: none !important; transition: none !important; }
#index_slider.animation_type4 .item.first_item, #index_slider.animation_type4 .item.slick-active, #index_slider.animation_type4 .item.slick-last-active { opacity: 1 !important; }
#index_slider.animation_type4 .item.slick-active .image_wrap {
  animation: index_slider_type4_next 1.2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type4 .item.slick-last-active .image_wrap {
  animation: index_slider_type4_current 1.2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
#index_slider.animation_type4 .item.first_item .image_wrap { transform: scale(1) !important; opacity:1 !important; animation:none; }




/* ----------------------------------------------------------------------
 ページヘッダー
---------------------------------------------------------------------- */
#page_header { width:100%; height:650px; position:relative; overflow:hidden; }
body.error404 #page_header { height:100vh; }
#page_header.small { height:100px; }
#page_header_catch {
  width:1250px; margin:auto; position:absolute; z-index:3; text-align:center; color:#fff;
  left:0px; right:0px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#page_header_catch .catch { font-size:46px; line-height:1.4; font-weight:500; }
#page_header_catch .desc { margin-top:8px; font-size:16px; line-height:2.3; }
#page_header .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:2; }
#page_header .bg_image { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:1; }

#archive_catch { text-align:center; height:150px; border-bottom:1px solid #ddd; position:relative; }
#archive_catch h2 {
  font-size:30px; font-weight:500; position:absolute; left:0; right:0; margin:auto;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
#archive_desc { margin:0 0 50px; }
#archive_desc p { font-size:16px; line-height:2.5; }
#page_header .headline {
  min-width:200px; height:60px; line-height:60px; font-size:14px; display:table; text-align:center;
  position:absolute; bottom:0; left:0; right:0; margin:auto; z-index:5;
  -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0);
  -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s;
}

@media screen and (max-width: 480px){
#page_header{height:300px !important;}
#page_header_catch {width:100%; margin:auto; position:absolute; z-index:3; text-align:center; color:#fff; left:0px; right:0px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-box-sizing:border-box; box-sizing:border-box;}
#page_header_catch .catch { font-size:130%; line-height:2; font-weight:500; }
#page_header_catch .desc { margin-top:8px; font-size:100%; line-height:1.4; }
#page_header .bg_image { width:100%; top:0px; left:0px; z-index:1; background-size:100%;}
}

/* タブボタン */
#tab_button_list {
  overflow:hidden; height:60px;
  position:absolute; z-index:10; bottom:0px; margin:auto; left:0; right:0;
  -ms-transform: translateY(60px); -webkit-transform: translateY(60px); transform: translateY(60px);
}
#blur_bg { -webkit-transform: translateY(-60px); transform: translateY(-60px); }
#tab_button_list_inner { display:block; height:60px; position:relative; z-index:3; }
#tab_button_list ul { margin:0; padding:0; }
#tab_button_list li { float:left; width:200px; margin:0; padding:0; }
#tab_button_list li a, #tab_button_list li span { font-size:14px; width:100%; height:60px; line-height:60px; text-align:center; display:block; background:rgba(255,255,255,0.8); }
#tab_button_list li a:hover { background:#000; color:#fff; }


/* アニメーション */
#page_header .catch, #page_header .desc, #page_header .headline { opacity:0; }
#page_header .catch.no_animate, #page_header .desc.no_animate, #page_header .headline.no_animate { opacity:1; }
#page_header #tab_button_list.no_animate, #page_header #tab_button_list.no_animate #blur_bg {
  -ms-transform: translateY(0%); -webkit-transform: translateY(0%); transform: translateY(0%);
}
#page_header .catch.animate {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}
#page_header .desc.animate {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}
#page_header .headline.animate {
  -webkit-transform: translate3d(0,0%,0); transform: translate3d(0,0%,0);
  -webkit-transition: -webkit-transform 0.35s 2.0s; transition: transform 0.35s 2.0s;
}
#page_header #tab_button_list.animate {
  -ms-transform: translateY(0%); -webkit-transform: translateY(0%); transform: translateY(0%);
  -webkit-transition: -webkit-transform 0.35s 2.0s; transition: transform 0.35s 2.0s;
}
#page_header #tab_button_list.animate #blur_bg {
  -webkit-transform: translateY(0px); transform: translateY(0px);
  -webkit-transition: -webkit-transform 0.35s 2.0s; transition: transform 0.35s 2.0s;
}




/* ----------------------------------------------------------------------
 ブログアーカイブページ
---------------------------------------------------------------------- */
#archive_blog { padding:100px 0 150px 0; width:1250px; margin:0 auto; }
#blog_list { margin:0 0 -10px 0; }
#blog_list .item { position:relative; margin:0 0 90px; }
#blog_list .item:last-of-type { margin:0; }
#blog_list .link { display:block; width:100%; height:485px; overflow:hidden; position:relative; z-index:2; }
#blog_list .image {
  width:100%; height:100% !important; display:block; overflow:hidden; position:absolute; z-index:2;
  -webkit-backface-visibility:hidden; backface-visibility:hidden;
}
#blog_list .title_area {
  position:absolute; z-index:5; bottom:0px; left:0px; padding:25px 30px;
  -webkit-transition: color 0.2s ease; transition: color 0.2s ease;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#blog_list .overlay { width:100%; height:50%; position:absolute; bottom:0; left:0; z-index:3; }
#blog_list .category { position:absolute; top:30px; left:-20px; z-index:10; }
#blog_list .category a {
  display:none; background:#000; color:#fff; min-width:130px; height:35px; line-height:35px; text-align:center; font-size:12px; padding:0 15px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#blog_list .category a:first-child { display:inline-block; }
#blog_list .category:before {
  display:block; content:''; width: 0; height: 0;
  border-style: solid; border-width: 0 20px 20px 0; border-color: transparent #aaaaaa transparent transparent;
  position:absolute; left:0px; bottom:-20px;
}
#blog_list .title { font-size:20px; line-height:1.5; max-height:3em; overflow:hidden; font-weight:bold; }
#blog_list .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#blog_list .date { font-size:12px; line-height:1; margin:0 0 10px 0; }
#blog_list .excerpt { font-size:16px; line-height:2.5; overflow:hidden; color:#000; max-height:5.0em; overflow:hidden; margin:20px 0 0 0; }
#blog_list .excerpt span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }


/* ページング */
.page_navi { margin:100px 0 -4px 0; z-index:10; position:relative; }
body.search .page_navi { margin:20px 0 35px 0; }
.page_navi ul { margin:0; font-size:0; text-align:center; }
.page_navi li { display:inline-block; margin:0 4px 4px 0; }
.page_navi a, .page_navi a:hover, .page_navi span {
  color:#000; background:#fff; border:1px solid #ddd; font-size:14px; width:45px; height:45px; line-height:45px; margin:0; display:inline-block; text-align:center;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.page_navi a:hover { color:#fff; }
.page_navi span.dots { background:none; color:#333; }
.page_navi span.current { color:#fff; background:#000; border-color:#000; }

.page_navi .next, .page_navi .prev { }
.page_navi .next span, .page_navi .prev span { display:none; }
.page_navi .next:before, .page_navi .prev:before {
  font-family:'design_plus'; font-size:11px; top:1px; position:relative;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.page_navi .prev:before { content:'\e90f'; }
.page_navi .next:before { content:'\e910'; }
.page_navi .prev:hover:before, .page_navi .next:hover:before { color:#fff; }
#no_post { text-align:center; }




/* ----------------------------------------------------------------------
 ブログ詳細ページ
---------------------------------------------------------------------- */
.post_content { }
.post_content a:hover { text-decoration:none; }
#article { position:relative; }


/* タイトル */
#post_title_area { margin:0 0 50px 0; }
#post_title_area .title { font-size:32px; line-height:1.3; font-weight:500; margin:0; }
#post_title_area .date { margin:0 0 10px 0; font-size:12px; color:#999; }


/* アイキャッチ画像*/
#post_image { padding:0; margin:0 0 48px 0; position:relative; }
#post_image img { max-width:100%; height:auto; display:block; margin:0; z-index:1; }
#single_category { position:absolute; top:30px; left:-20px; z-index:10; }
#single_category a {
  display:none; background:#000; color:#fff; min-width:130px; height:35px; line-height:35px; text-align:center; font-size:12px; padding:0 15px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#single_category a:first-child { display:inline-block; }
#single_category:before {
  display:block; content:''; width: 0; height: 0;
  border-style: solid; border-width: 0 20px 20px 0; border-color: transparent #aaaaaa transparent transparent;
  position:absolute; left:0px; bottom:-20px;
}


/* SNSボタン */
#single_share_top { margin:0 0 44px 0; padding:8px 0 0 0; }
#single_share_top .share-top { margin:0; }
#single_share_bottom { margin:60px 0 0 0; }
#single_share_bottom .share-btm { margin-bottom:0 !important; padding:0; }
#single_share_top .mt10, #single_share_top .mt10 { margin:0 !important; }
#single_share_bottom .mb45, #single_share_bottom .mb45 { margin:0 !important; }
.share-type1 ul { text-align:center; }
.share-type3 ul { text-align:center; }
.share-type2 ul.type2 { text-align:center; }
.share-type4 ul.type4 { text-align:center; }
.sns_default_top  { text-align:center; }
body.single-news #single_share_bottom { margin:23px 0 55px 0; }


/* ページ分割 */
#post_pagination { margin:0 0 0 0; padding:25px 0 0 0; clear:both; font-size:0; text-align:center; }
#post_pagination h5 { margin:0 0 10px 0; font-size:12px; }
#post_pagination a, #post_pagination p {
  color:#000; background:#fff; border:1px solid #ddd; font-size:12px; display:inline-block; margin:0 2px; width:45px; height:45px; line-height:45px; text-align:center; text-decoration:none;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#post_pagination p { position:relative; background:#000; color:#fff; }
#post_pagination a:hover { background:#000; color:#fff; }


/* ページ分割（続きを読むver） */
#p_readmore { text-align:center; padding:22px 0 0 0; margin-bottom:-15px; }
#p_readmore .button {
  background:#000; color:#fff; display:inline-block; height:50px; line-height:50px; min-width:220px; padding:0 40px; text-decoration:none;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#p_readmore .button:hover { background:#333; color:#fff; }



/* メタ情報 */
#post_meta_bottom { margin:55px 0 0; padding:15px 30px; background:#fff; border:1px solid #ddd; }
#post_meta_bottom li { display:inline; margin:0 10px 0 0; padding:0 15px 0 20px; border-right:1px solid #666; font-size:12px; line-height:1.8; position:relative; }
#post_meta_bottom li:last-child { border:none; margin:0; }
#post_meta_bottom li:before {
  display:block; width:14px; height:14px; line-height:14px;
  font-family:'design_plus'; color:#aaa; font-size:14px;
  position:absolute; top:2px; left:0px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#post_meta_bottom li.post_author:before { content:'\e90d'; }
#post_meta_bottom li.post_category:before { content:'\e92f'; }
#post_meta_bottom li.post_tag:before { content:'\e935'; top:2px; }
#post_meta_bottom li.post_comment:before { content:'\e916'; font-size:18px; top:3px; }


/* 次の記事、前の記事 */
#next_prev_post { margin:60px 0 0; }
#next_prev_post .item { float:left; width:50%; height:110px; position:relative; }
#next_prev_post a {
  display:block; position:relative; width:100%; height:100%; color:#000; background:#fff; position:relative; border:1px solid #ddd;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#next_prev_post a:hover { background:#f6f6f6; }
#next_prev_post .title_area {
  font-size:16px; line-height:1.6; position:absolute; margin:0 35px 0 70px; overflow:hidden; max-height:3.2em;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
#next_prev_post .title { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#next_prev_post .nav { display:none; }
#next_prev_post a:before {
  content:''; width:12px; height:12px; line-height:12px;
  font-family:'design_plus'; color:#111; font-size:12px; display:block;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  content:'\e90f'; position:absolute; left:30px; margin-top:3px;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
#next_prev_post .next_post a:before { content:'\e910'; left:auto; right:30px; }
#next_prev_post .next_post { float:right; left:-1px; }
#next_prev_post .next_post .title_area { margin:0 70px 0 35px; }


/* 関連記事 */
#related_post { margin:60px 0 0; position:relative; }
#related_post .headline { line-height:1; font-weight:bold; margin:0 0 5px 0; font-size:22px; text-align:center; }
#related_post .item { float:left; width:calc(100% / 3 - 14px); margin:22px 20px 0 0; }
#related_post .item:nth-child(3n) { margin-right:0; }
#related_post .item a { display:block; width:100%; height:100%; min-height:217px; }
#related_post .image_wrap { display:block; width:100%; height:155px; z-index:1; overflow:hidden; margin:0 0 10px 0; }
#related_post .image { width:100%; height:155px !important; display:block; overflow:hidden; position:relative; z-index:2; }
#related_post .image img { width:100%; height:auto; display:block; -webkit-backface-visibility:hidden; backface-visibility:hidden; }
#related_post .item .title {
  font-size:16px; line-height:1.6; overflow:hidden; max-height:3.2em; word-break:break-all;
  -webkit-transition-property:color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:color; transition-duration:0.2s; transition-timing-function:ease;
}
#related_post .item .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#related_post .item a:hover .title { color:#666; }


/* プロフィール */
.author_profile { background:#fff; border:1px solid #ddd; margin:60px 0 0; padding:50px 40px 48px; position:relative; }
.author_profile a.avatar { display:block; width:100px; height:100px; border-radius:100%; float:left; position:relative; overflow:hidden; z-index:2; background:#000; }
.author_profile img.avatar { display:block; width:100%; height:auto; }
.author_profile .info { font-size:14px; float:right; -webkit-width:calc(100% - 130px); width:calc(100% - 130px); position:relative; }
.author_profile .name { font-size:20px; margin:0 0 20px 0; float:left; font-weight:500; }
.author_profile .desc { margin:0 0 20px 0; }
.author_profile .desc p { line-height:2.0; }
.author_profile .author_link { float:left; margin:0 0 0 -5px; font-size:0; }
.author_profile .author_link li { display:inline-block; margin:0 10px 0 0; position:relative; }
.author_profile .author_link li a {
  display:block; overflow:hidden; width:20px; height:20px; line-height:20px; text-align:center; position:relative;
}
.author_profile .author_link li a span { display:none; }
.author_profile .author_link li a:before {
  font-family:'design_plus'; font-size:14px; display:block;
  position:absolute; top:1px; left:0; right:0; margin:auto;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
.author_profile .author_link li a:hover:before { color:#aaa; }
.author_profile .author_link li.twitter a:before { content:'\e904'; }
.author_profile .author_link li.facebook a:before { content:'\e902'; }
.author_profile .author_link li.insta a:before { content:'\ea92'; }
.author_profile .author_link li.pinterest a:before { content:'\e905'; }
.author_profile .author_link li.google a:before { content:'\e900'; }
.author_profile .author_link li.youtube a { width:42px; }
.author_profile .author_link li.youtube a:before { content:'\ea9e'; }
.author_profile .author_link li.contact a:before { content:'\f003'; }
.author_profile .archive_link { float:right; padding:0 20px 0 0; margin-top:4px; }
.author_profile .archive_link span:after {
  font-size:12px; font-family:'design_plus'; content:'\e910'; display:block; position:absolute; right:0px; top:5px; height:14px; line-height:14px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}


/* 広告 */
#single_banner_top { margin:0 auto; padding:10px 0 45px; width:700px; }
#single_banner_bottom { margin:0 auto; padding:60px 0 0; width:700px; }
#single_banner_shortcode { margin:0 auto; padding:15px 0 45px; width:700px; }
#mobile_banner_top { margin:30px 0 25px; text-align:center; }
#mobile_banner_bottom { margin:30px 0 30px; text-align:center; }
.single_banner_area .single_banner_left {
  float:left; width:50%; text-align:right; padding:0 15px 0 0;
 -webkit-box-sizing:border-box; box-sizing:border-box;
}
.single_banner_area .single_banner_right {
  float:right; width:50%; text-align:left; padding:0 0 0 15px;
 -webkit-box-sizing:border-box; box-sizing:border-box;
}
.single_banner_area img { max-width:100%; height:auto; display:inline-block; margin:0 auto; }
.single_banner_area.one_banner .single_banner_left { float:none; text-align:center; padding:0; width:100%; }




/* ----------------------------------------------------------------------
 ヘッダー
---------------------------------------------------------------------- */
#header { width:100%; height:100px; z-index:20; position:relative; top:0px; position:absolute; }


/* ロゴ */
#header_logo {
  position:absolute; right:40px; top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index:30;
  display:-webkit-box; display:-ms-flexbox; display:-webkit-flex; display:flex; align-items: center; 
}
#header_logo .logo { line-height:1; margin:0; padding:0; font-weight:500; }
#header_logo img { display:block; -webkit-transition: opacity 0.35s ease-in-out; transition: opacity 0.35s ease-in-out; }
#header_logo img:hover { opacity:0.5; }
#header_logo .mobile_logo_image { display:none; }
#header_logo .mobile_logo_text { display:none; }
#header_logo .pc_logo_image.type2 { display:none; }

@media screen and (max-width: 480px){
.logo_wrap{width:70%; margin:0 auto; padding-right:-15%;}
}


/* 説明文 */
#header_logo .desc { font-size:14px; font-weight:normal; margin:0 0 0 25px; }


/* ボタン */
#footer_button { display:none; }


/* グローバルメニュー */
.pc #global_menu { position:absolute; z-index:20; top:1px; left:20px; }
.pc #global_menu > ul {
  position:relative; text-align:center; margin:0;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.pc #global_menu > ul > li { position:relative; line-height:1; float:left; text-align:center; font-size:14px; }

.pc #global_menu > ul > li > a {
  padding:0 18px; font-size:14px; text-decoration:none; height:100px; line-height:100px; display:block; position:relative; overflow:hidden;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.pc #global_menu > ul > li.active > a, .pc #global_menu > ul > li.current-menu-item > a { }
.pc #global_menu a:hover { }

.pc #global_menu ul ul { display:none; width:100%; min-width:240px; position:absolute; top:100px; left:0px; margin:0; padding:0; }
.pc #global_menu ul ul ul { left: 100%; top:0; margin:0; border:none; }
.pc #global_menu ul ul li { line-height:1.5; padding:0; margin:0; text-align:left; position:relative; display:block; }
.pc #global_menu ul ul a { font-size:14px; display:block; border:none; position:relative; padding:14px 25px 12px; height:auto; line-height:1.6; margin:0; }
.pc #global_menu ul ul a:hover { text-decoration:none; border:none; }

.pc #global_menu ul ul li.menu-item-has-children > a:before {
  font-family:'design_plus'; content:'\e910'; color:#ddd; display:block; position:absolute; right:9px; top:23px; font-size:9px; height:9px; line-height:9px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}


/* 子メニューを逆方向にする */
.pc #global_menu ul > li.type2 > ul { left:auto; right:0%; }
.pc #global_menu ul ul > li.type2 ul { left:auto; right:100%; }
.pc #global_menu ul ul li.menu-item-has-children.type2 > a:before { content:'\e90f'; right:auto; left:9px; }


/* 子メニューにhoverした時headerの色を変える */
.pc #header.active { border-bottom:1px solid #ddd; }
.pc #header.active #header_logo .pc_logo_image.type1 { display:none; }
.pc #header.active #header_logo .pc_logo_image.type2 { display:block; }


/* その他 */
.pc #menu_button { display:none; }
.pc #header_mobile_banner { display:none; }
#drawer_menu { display:none; }


/* 固定ヘッダー */
.pc .header_fix { }/* #header_inner height + #header margin bottom */
.pc body.home.header_fix { padding-top:0; }
.pc body.admin-bar.header_fix { padding-top:112px; }
.pc .header_fix #header {
  position:fixed; top:0px; left:0px; z-index:200; width:100%; box-shadow:0 0 15px 5px rgba(0,0,0,0.1); border:none;
  -webkit-animation: slide_down_menu 0.5s ease; animation: slide_down_menu 0.5s ease;
}
.pc .header_fix #header #header_logo .pc_logo_image.type1 { display:none; }
.pc .header_fix #header #header_logo .pc_logo_image.type2 { display:block; }
.pc .admin-bar.header_fix { padding-top:190px; }
@-webkit-keyframes slide_down_menu {
  0% { top:-100px; }
  100% { top:0px; }
}
@keyframes slide_down_menu {
  0% { top:-100px; }
  100% { top:0px; }
}


/* パンくずリンク */
#bread_crumb { width:100%; border-bottom:1px solid #ddd; background:#fff; }
#bread_crumb ul { width:1250px; margin:0 auto; padding:0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
#bread_crumb li { display:inline; font-size:12px; padding:0 0 0 17px; margin:0 5px 0 0; height:60px; line-height:60px; position:relative; color:#000; }
#bread_crumb li:before {
  font-family:'design_plus'; content:'\e910'; font-size:9px; width:9px; height:9px; line-height:9px; color:#999;
  display:block; position:absolute; left:0; top:-1px; bottom:0; margin-top:4.5px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#bread_crumb li a { color:#999; }
#bread_crumb li a:hover { }
#bread_crumb li.category a { display:none; }
#bread_crumb li.category a:first-of-type, #bread_crumb li.category a:only-of-type { display:inline; }
#bread_crumb li.home { padding:0; }
#bread_crumb li.home:before { display:none; }
#bread_crumb li.home a {
  text-indent:-200%; overflow:hidden; width:12px; height:13px; display:inline-block; top:2px; position:relative;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#bread_crumb li.home a:before {
  font-family:'design_plus'; content:'\e90c'; width:12px; height:13px; line-height:13px;
  text-indent:0; display:block; position:absolute; top:0px; bottom:0; left:0px; margin:auto;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}


/* アニメーションの設定 */
.pc #header { opacity:0; }
.pc #header.no_animate { opacity:1; }
.pc #header.animate {
  -webkit-animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
  animation: opacityAnimation 1.4s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 2.0s;
}




/* ----------------------------------------------------------------------
 フッター
---------------------------------------------------------------------- */
#footer {
  width:100%;
  /* height: 30vw; */
  /* min-width:1250px; */
}
#footer_inner {
  /* width:50%; */
  position:relative;
}


/* バナー一覧 */
/* #footer_banner { margin:0 0 50px 0; } */
#footer_banner .item { width:395px; height:150px; overflow:hidden; float:left; margin:0 10px 10px 0; }
#footer_banner .item:nth-child(2n) { margin-right:0; }
#footer_banner .item a { display:block; width:100%; height:100%; position:relative; z-index:1; }
#footer_banner .item .caption {
  z-index:3; position:absolute; text-align:center; left:0; right:0;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
#footer_banner .item .title { line-height:1.6; }
#footer_banner .item .desc { line-height:1.8; }
#footer_banner .item .overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:2; }
#footer_banner .item .image { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:1; }


/* ロゴ */
#footer_logo { margin:0 auto; text-align:center; }
#footer_logo .logo { line-height:1; padding:0; font-weight:500; }
#footer_logo img { display:block; margin:0 auto 25px; }
#footer_logo .pc_logo_text { display:block; margin:0 0 25px; }
#footer_logo .mobile_logo_image { display:none; }
#footer_logo .mobile_logo_text { display:none; }


/* インフォメーション */
#footer_information {
  /* width:55%; margin:0 auto; */
  display: flex;
  width: 100%;
  gap: 3%;
}
#footer_information img{width:100%;}
#footer_information .footer_logoimg img {
  object-fit: cover;
  height: 50%;
}
#footer_information p { font-size:100%; line-height:1.8; padding-top:2%; text-align:left; margin-left: 10%;}

@media screen and (max-width: 480px){
.footer_img{width:70%; margin:0 auto; padding:0; float:none;}
#footer_information img{width:100%;}
#footer_information p { font-size:80%; line-height:1.8; padding-top:2%; clear:both;}
}


/* SNSボタン */
#footer_social_link { margin:0 0 30px 0; font-size:0; z-index:20; text-align:center; }
#footer_social_link li { display:inline-block; margin:0 10px; position:relative; }
#footer_social_link li a {
  display:block; overflow:hidden; width:20px; height:20px; line-height:20px; text-align:center; position:relative;
}
#footer_social_link li a span { display:none; }
#footer_social_link li a:before {
  font-family:'design_plus'; font-size:15px; display:block;
  position:absolute; top:1px; left:0; right:0;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#footer_social_link li a:hover:before { color:#aaa; }
#footer_social_link li.twitter a:before { content:'\e904'; }
#footer_social_link li.facebook a:before { content:'\e902'; }
#footer_social_link li.insta a:before { content:'\ea92'; }
#footer_social_link li.pinterest a:before { content:'\e905'; }
#footer_social_link li.google a:before { content:'\e900'; }
#footer_social_link li.youtube a { width:45px; }
#footer_social_link li.youtube a:before { content:'\ea9e'; }
#footer_social_link li.contact a:before { content:'\f003'; }
#footer_social_link li.rss a:before { content:'\e90b'; }


/* フッターメニュー */
#footer_menu { width:100%; background:#fff; height:54px; line-height:54px; }
#footer_menu ul { margin:0; z-index:20; text-align:center; }
#footer_menu ul li { display:inline; font-size:14px; margin:0 19px; }
#footer_menu ul li a:hover { color:#666; }

/* コピーライト */
#copyright { width:50%; line-height:60px; height:60px; font-size:12px; z-index:10; text-align:right; background:#000; color:#fff; }

@media screen and (max-width: 480px){
#footer_menu{width:100% !important; height:auto !important; overflow-x:scroll;}
#footer_menu ul{width:100% !important; white-space:nowrap;}
#footer_menu ul li { display:inline-block; font-size:60%; margin:0 2%; }
#copyright {margin-bottom:0;}
}


/* ページ上部へ戻るボタン */
#return_top { display:block; }
#return_top a { background:#222; display:block; height:60px; width:60px; line-height:60px; text-decoration:none; z-index:100; position:relative; }
#return_top a:hover { color:#fff !important; }
#return_top span { text-indent:100%; white-space:nowrap; overflow:hidden; display:block; }
#return_top a:before {
  color:#fff; font-family:'design_plus'; content:'\e911'; font-size:12px; display:block; width:12px; height:12px;
  position:absolute; left:0; right:0; top:4px; margin:auto;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#return_top {
  position:fixed; right:0px; bottom:0px; z-index:999;
  -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0);
  -webkit-transition: -webkit-transform 0.35s; transition: all 0.35s;
}
#return_top.active { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
body.light_color #return_top a { color:#000; }


/* 固定コンテンツ */
#fixed_footer_content {
  position:fixed; bottom:0; left:0; width:100%; height:120px; color:#fff; padding:40px; z-index:9999;
  -webkit-box-sizing:border-box; box-sizing:border-box;
  -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0);
  -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s;
}
#fixed_footer_content.active { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); }
#fixed_footer_content a { color:#fff; text-decoration:none; }
#fixed_footer_content .content_left {
  position:absolute; left:40px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  width:-webkit-calc(100% - 530px); width:calc(100% - 530px);
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#fixed_footer_content .has_image .content_left { width:-webkit-calc(100% - 840px); width:calc(100% - 840px); }
#fixed_footer_content .button {
  position:absolute; right:55px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  min-width:300px; height:55px; line-height:55px; text-align:center; display:inline-block; padding:0 40px 0 10px; font-size:16px;
}
#fixed_footer_content .button:after {
  font-family:'design_plus'; content:'\e910'; color:#fff; font-size:14px; display:block; position:absolute; top:1px; right:16px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#fixed_footer_content .image {
  position:absolute; right:55px; max-width:728px;
  top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
#fixed_footer_content .image img { width:100%; max-width:100%; height:auto; display:block; }
#fixed_footer_content .close {
  position:absolute; right:5px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  display:block; width:40px; height:40px; border-radius:100%;
}
#fixed_footer_content span { display:none; }
#fixed_footer_content .close:before {
  font-family:'design_plus'; color:#fff; font-size:20px; display:block;
  content:'\e91a'; position:absolute; top:10px; left:10px;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
#fixed_footer_content .close:hover { background:rgba(255,255,255,0.1); }
#fixed_footer_content .catch { font-size:21px; margin:0; line-height:1.5; }
#fixed_footer_content .desc { font-size:14px; margin:5px 0 0 0; line-height:2; }
#fixed_footer_content .pr { background:#fff; color:#333; display:inline; font-size:12px; margin:5px 15px 0 0; padding:0 12px; border-radius:2px; height:20px; line-height:20px; float:left; }
#fixed_footer_content .pr1 { display:none; }

#fixed_footer_content .free {
  width:100%; padding-right:100px; position:absolute; left:40px;
  top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#fixed_footer_content .post_content p { margin:0; line-height:1.6; }



/* ----------------------------------------------------------------------
 ウィジェット
---------------------------------------------------------------------- */
/* 基本設定 */
#widget_area { width:100%; height:auto; overflow:hidden; position:relative; }
#widget_area_inner { padding:100px 0; width:1250px; margin:0 auto; position:relative; z-index:3; }
#widget_area_overlay { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:2; }
#widget_area_image { width:100%; height:100%; position:absolute; top:0px; left:0px; z-index:1; }
#left_widget { width:436px; float:left; }
#right_widget { width:300px; float:right; }
.widget_content { margin:0 0 43px 0; }
.widget_content:last-child { margin-bottom:0; }
.widget_headline { color:#fff; font-size:16px; font-weight:bold; margin:0 0 20px 0; line-height:1; }
.widget_content ul { margin:0; }
.widget_content li ul { margin:10px 0 0 0; }
.widget_content li { line-height:2; padding:2px 0; margin:0 0 10px 0; }
.widget_content a { text-decoration:none; color:#000; }
.widget_content a:hover { }
.widget_content img { height:auto; max-width:100%; }


/* 広告 */
.tcd_ad_widget { border:none; padding:0; background:none; }
.tcd_ad_widget img { height:auto; max-width:100%; margin:0 auto; display:block; }


/* カレンダー */
.widget_calendar .side_headline { margin:0 0 30px 0; }
#wp-calendar { margin:0 auto; width:100%; font-size:11px; border-collapse:separate; table-layout:fixed; }
#wp-calendar th, #wp-calendar td { padding:2px; line-height:3.4; text-align:center; }
#wp-calendar td a { display:block; margin:0; padding:0; text-decoration:none; background-color:#eee; }
#wp-calendar td a:hover { text-decoration:none; color:#fff; background:#aaa; }
#wp-calendar caption { padding:7px 0; }
#wp-calendar thead th, #wp-calendar tfoot td { border:none; padding:0; line-height:2; }
#wp-calendar #prev, #wp-calendar #next { line-height:3; }
#wp-calendar #prev a, #wp-calendar #next a { text-decoration:none; background:none; }
#wp-calendar #prev a:hover, #wp-calendar #next a:hover { }
#wp-calendar td#today { font-weight:bold; }


/* デザインされた記事一覧1 */
.styled_post_list1 { }
.styled_post_list1 li { margin:0 0 4px 0; padding:0; }
.styled_post_list1 li:last-child { margin:0; }
.styled_post_list1 a { display:block; width:100%; height:100px; overflow:hidden; background:#fff !important; }
.styled_post_list1 .image_wrap { float:left; display:block; width:100px; height:100px; position:relative; z-index:1; overflow:hidden; }
.styled_post_list1 .image { width:100%; height:100px !important; display:block; overflow:hidden; position:relative; z-index:2; }
.styled_post_list1 .image img { width:100%; height:auto; display:block; -webkit-backface-visibility:hidden; backface-visibility:hidden; }
.styled_post_list1 .title_area {
  width:calc(100% - 100px); height:100px; float:left; border-left:none; border-bottom:none; position:relative;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.styled_post_list1 .title_area_inner {
  position:absolute; padding:0 27px;
  top:50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%);
}
.styled_post_list1 .title {
  font-size:14px; line-height:1.6; max-height:3.2em; font-weight:500; word-break:break-all; overflow:hidden;
  -webkit-transition-property:color; -webkit-transition-duration:0.2s; -webkit-transition-timing-function:ease;
  transition-property:color; transition-duration:0.2s; transition-timing-function:ease;
}
.styled_post_list1 .title span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.styled_post_list1 .date { font-size:12px; color:#999; }
.styled_post_list1 a:hover .title { color:#666; }


/* 検索 */
.widget_search label { display:none; }
#searchform {
  border:none; background:#fff; height:50px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#searchform #s {
  border:none; background:none; padding:0 18px; margin:0; width:calc(100% - 50px); height:50px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
#searchform #searchsubmit {
  border:none; background:none; width:50px; height:50px; z-index:200; position:relative;
  cursor:pointer; display:block; text-indent:-300px; overflow:hidden;
}
#searchform .submit_button  { position:relative; width:50px; height:50px; float:right; top:1px; }
#searchform .submit_button:before {
  text-indent:0; display:block; width:50px; height:50px; line-height:50px; text-align:center; cursor:pointer; z-index:1;
  position:absolute; font-family:'design_plus'; color:#333; font-size:18px; content:'\e915'; right:0px; top:1px;
}
#searchform .submit_button:hover:before { color:#aaa; }
#searchform .submit_button:hover { }


/* アーカイブ、カテゴリードロップダウンメニュー */
.widget_archive, .widget_categories, .tcdw_archive_list_widget { }
.widget_archive .side_headline { margin:0 0 20px 0; }
.widget_archive ul  { margin:0; padding:0; }
.widget_archive ul li { }
.widget_archive select, .widget_categories select, .tcd_archive_dropdown select { border:none; height:50px; line-height:50px; padding:0px 16px; width:100%; margin:0; }
.widget_archive select { border:1px solid #ddd; padding:12px; }
.widget_archive label, .widget_categories label { display:none; }
.widget_archive select option, .widget_categories select option, .tcd_archive_dropdown option { background:#fff; color:#000; }


/* アーカイブ一覧 */
.tcdw_archive_list_widget .side_headline { display:none; }
.p-widget-dropdown { height:50px; line-height:50px; position:relative; }
.p-widget-dropdown::after { color:#666; content:"\e90e"; font-family: "design_plus"; position:absolute; top:0; right: 17px; z-index:1; }
.p-widget-dropdown select { padding-right:33px; position:relative; z-index:2; -webkit-appearance:none; appearance:none; }
.p-widget-dropdown select::-ms-expand { display:none; }

.p-dropdown { font-size:14px; position:relative; }
.p-dropdown__title { -webkit-box-sizing:border-box; box-sizing:border-box; position: relative; height:50px; line-height:50px; padding:0 18px; border:none; background:#fff; }
.p-dropdown__title::after { position:absolute; right:17px; top:4px; font-family:"design_plus"; content:"\e90e"; }
.p-dropdown__title:hover { cursor:pointer; }
.p-dropdown__title.is-active::after { content:"\e911"; }
.p-dropdown__list { display:none; position:absolute; width:100%; border-top:1px solid #ddd; z-index:9; }
.p-widget .p-dropdown .p-dropdown__list { margin:0; }
.p-dropdown__list li { border:1px solid #ddd; border-top:0; line-height:1.5; margin:0; padding:0; }
.p-dropdown__list li a { display:block; padding:14px 18px; background:#fff; color:#000; }
.p-dropdown__list li a:hover { }
body.light_color .p-dropdown__title, body.light_color .p-dropdown__list li { border-color:#ddd !important; }


/* デザインセレクトボックス */
.design_select_box { position:relative; background:#fff; }
.design_select_box label { pointer-events:none; width:50px; height:50px; display:block; right:0px; top:0px; position:absolute; text-indent:-200%; overflow:hidden; z-index:10; }
.design_select_box label:after { text-indent:0px; color:#333; content:"\e90e"; font-family: "design_plus"; font-size:14px; width:14px; height:14px; position:absolute; top:21px; right:18px; z-index:11; }
.design_select_box.open label:after { content:"\e911"; }
.design_select_box select {
  -webkit-appearance:none; -moz-appearance:none; appearance:none; -webkit-border-raidus:0px; border-raidus:0px;
  cursor:pointer; border:none; width:100%; height:50px; line-height:50px; padding:0 15px;
  background:none !important;
}
.design_select_box select::-ms-expand{ display:none; }


/* デフォルトの最近の記事 */
.widget_recent_entries li { border-bottom:1px dotted #ccc; padding:0 0 15px 0; }
.widget_recent_entries li:last-child { border:none; padding:0; }




/* ----------------------------------------------------------------------
 コメント
---------------------------------------------------------------------- */
/* 基本設定 */
#comments { margin:50px 0 10px 0; }
#comment_headline { text-align:center; padding:0 30px; font-weight:bold; margin:0 0 30px 0; font-size:20px; color:#ff4b52; }


/* コメント・トラックバックのタブ */
#comment_header { position:relative; margin:0 0 25px; }
#comment_tab { margin:0; }
#comment_tab li { float:left; text-align:center; margin:0; width:50%; }
#comment_tab li a, #comment_tab li p { font-size:11px; padding:15px 15px; line-height:1.6; display:block; text-decoration:none; background:#eee; color:#000; }
#comment_tab li a:hover { color:#fff !important; background:#aaa; }
#comment_tab li.active a, #comment_header #comment_closed p { color:#fff; position:relative; background:#aaa; }
#comment_tab li.active a:after, #comment_header #comment_closed p:after {
  position:absolute; bottom:-17px; left:-webkit-calc(50% - 5px); left:calc(50% - 5px);
  content:""; width:0; height:0; border-width:10px; border-style:solid; border-color:#aaa transparent transparent transparent;
}
#comment_tab li.active a:hover { }


/*  コメントの基本部分 */
.commentlist { list-style-type:none; margin:0; padding:0; }
.comment { margin:0 0 15px; padding:15px 20px 0; background:#fff; border:1px solid #ddd; }
#comments .post_content { margin:0; padding:0; background:none; }


/* コメントの情報部分 */
.comment-meta { position:relative; margin:0 0 10px 0; }

.comment-meta-left { float:left; width:100%; }
#comments .avatar { float:left; margin:0 10px 0 0; background:#333; width:40px; height:40px; border-radius:100%; }
.comment-name-date { padding:3px 0 0 0; height:37px; }

a.admin-url { text-decoration:underline; }
a.guest-url { text-decoration:underline; }

.comment-name-date { margin:0; }
.comment-date { font-size:11px; color:#888; margin:10px 0 0 0; }

.comment-act { font-size:11px; position:absolute; right:0px; padding:0; margin:5px 0 0 0; }
.comment-act li { display:inline; margin:0; }
.comment-reply a, .comment-reply a:visited { border-right:1px solid #aaa; padding:0 10px 0 0; margin:0 6px 0 0; }
.comment-edit a, .comment-edit a:visited { border-left:1px solid #aaa; padding:0 0 0 10px; margin:0 0 0 6px; }


/* コメント本文 */
#comments .post_content p { margin:0 0 15px 0; }
#comments .post_content blockquote span { margin:0 0 -1em 0; display:block; }


/* メッセージ、警告文 */
.comment-note { display:block; font-size:11px; margin:0 0 1em 0; color:#33a8e5; border:1px solid #94ddd4; padding:10px 15px; background:#d6f4f0; }
.comment_closed { border:1px solid #ccc; text-align:center; margin:0 35px 15px 0; padding:15px; background:#fefefe; }
.no_comment { padding-bottom:15px; }
.comment_message { margin:0 0 25px 0; }


/* トラックバック */
.commentlist .ping-link { margin:0 0 25px 0; }
.commentlist .ping-meta { margin:0 0 15px 0; }


/* ページナビ */
#comment_pager { margin:0 0 10px; height:24px; }
#comment_pager a, #comment_pager span { display:inline; float:left; margin:0 10px 0 0; }
#comment_pager .current { text-decoration:underline; }


/* コメントフォーム */
.comment_form_wrapper { border:1px solid #ddd; margin:0 0 0px; padding:15px; background:#fff; }
.comment .comment_form_wrapper { margin:0 0 20px; }

#cancel_comment_reply a { background:#eee; margin:0 0 1em 0; padding:10px; text-align:center; display:block; }
#cancel_comment_reply a:hover { background:#222; color:#fff; }

#comment_user_login p { padding:0 0 0 1px; margin:0; line-height:1; }
#comment_user_login span { margin:0 0 0 40px; }

#comment_login { margin:0; padding:3px 30px 10px 30px; }
#comment_login p { margin:0; padding:12px 0 11px 36px; line-height:1; }
#comment_login a { margin:0 0 0 20px; padding:0; }

#guest_info { padding:0; width:100%; }
#guest_info div { margin:0 0 12px 0; text-align:left; }
#guest_info input { margin:0; padding:5px 10px; border:1px solid #ccc; width:100%; background:#fff; box-shadow:1px 1px 5px 0 rgba(0,0,0,0.1) inset; }
#guest_info input:focus { border:1px solid #999; }
#guest_info label { display:block; margin:0 0 10px 0; padding:0; font-size:12px; }
#guest_info span { margin:0 10px 0 0; }

#comment_textarea textarea {
  margin:15px 0 0; width:100%; height:150px; font-size:12px; overflow:auto; padding:10px;
  background:#fff; color:#000; border:1px solid #ccc; box-shadow:1px 1px 5px 0 rgba(0,0,0,0.1) inset;
}
#comment_textarea textarea:focus { border:1px solid #999; }

#submit_comment_wrapper { text-align:center; }
#submit_comment {
  color:#000; background:#eee; border:none; cursor:pointer; font-size:14px; width:200px; height:50px; margin:15px auto 0; display:block;
  -webkit-transition: background-color 200ms ease-in-out; transition: background-color 200ms ease-in-out;
}
#submit_comment:hover { background:#222; color:#fff; }

#input_hidden_field { display:none; }


/* パスワード保護 */
.password_protected { text-align:center; margin:0 38px 30px; padding:10px 20px; color:#fff; background:#3db4b2; border-radius:5px; }
.password_protected p { font-size:12px; margin:0; line-height:1.6; }




/* ----------------------------------------------------------------------
　アニメーションの設定
---------------------------------------------------------------------- */
/* 下から上へスライドアップ */
@-webkit-keyframes slideUp {
  0% { bottom:-50px; }
  100% { opacity:1; bottom:0; }
}
@keyframes slideUp {
  0% { bottom:-50px; }
  100% { opacity:1; bottom:0; }
}

/* ズームアウト */
@-webkit-keyframes zoomOut {
  0% { transform: scale(1.0) rotate(0.0001deg); }
  100% { transform: scale(1.3); }
}
@keyframes zoomOut {
  0% { transform: scale(1.0) rotate(0.0001deg); }
  100% { transform: scale(1.3); }
}

/* ズームイン */
@-webkit-keyframes zoomIn {
  0% { transform: scale(1.3) rotate(0.0001deg); }
  100% { transform: scale(1.0); }
}
@keyframes zoomIn {
  0% { transform: scale(1.3) rotate(0.0001deg); }
  100% { transform: scale(1.0); }
}

/* フェードイン */
@-webkit-keyframes opacityAnimation {
  0% { opacity:0; }
  100% { opacity:1; }
}
@keyframes opacityAnimation {
  0% { opacity:0; }
  100% { opacity:1; }
}

/* フェードアウト */
@-webkit-keyframes opacityAnimation2 {
  0% { opacity:1; }
  100% { opacity:0; }
}
@keyframes opacityAnimation2 {
  0% { opacity:1; }
  100% { opacity:0; }
}

/* 左から右へスライド */
@-webkit-keyframes slideRight {
  0% { left:-200px; opacity:0; }
  100% { left:0px; opacity:1; }
}
@keyframes slideRight {
  0% { left:-200px; opacity:0; }
  100% { left:0px; opacity:1; }
}

/* ポップアップ（実績一覧） */
@keyframes popup {
  0% { transform: scale(.1); }
  100% { transform: none; }
}
@keyframes popup {
  0% { transform: scale(.1); }
  100% { transform: none; }
}


/* 左からスライドイン（スライダー用） */
@-webkit-keyframes index_slider_type1_current {
  0% { left:0px; }
  100% { left:100%; }
}
@-webkit-keyframes index_slider_type1_next {
  0% { left:-100%; }
  100% { left:0px; }
}
@keyframes index_slider_type1_current {
  0% { left:0px; }
  100% { left:100%; }
}
@keyframes index_slider_type1_next {
  0% { left:-100%; }
  100% { left:0px; }
}

/* 左右からスライドイン（スライダー用） */
@-webkit-keyframes index_slider_type2_odd_current {
  0% { left:0px; }
  100% { left:100%; }
}
@keyframes index_slider_type2_odd_current {
  0% { left:0px; }
  100% { left:100%; }
}
@-webkit-keyframes index_slider_type2_even_current {
  0% { left:0px; }
  100% { left:-100%; }
}
@keyframes index_slider_type2_even_current {
  0% { left:0px; }
  100% { left:-100%; }
}
@-webkit-keyframes index_slider_type2_odd_next {
  0% { left:-100%; }
  100% { left:0; }
}
@keyframes index_slider_type2_odd_next {
  0% { left:-100%; }
  100% { left:0; }
}
@-webkit-keyframes index_slider_type2_even_next {
  0% { left:100%; }
  100% { left:0; }
}
@keyframes index_slider_type2_even_next {
  0% { left:100%; }
  100% { left:0; }
}

/* 上下からスライドイン（スライダー用） */
@-webkit-keyframes index_slider_type3_odd_current {
  0% { top:0px; }
  100% { top:100%; }
}
@keyframes index_slider_type3_odd_current {
  0% { top:0px; }
  100% { top:100%; }
}
@-webkit-keyframes index_slider_type3_even_current {
  0% { top:0px; }
  100% { top:-100%; }
}
@keyframes index_slider_type3_even_current {
  0% { top:0px; }
  100% { top:-100%; }
}
@-webkit-keyframes index_slider_type3_odd_next {
  0% { top:-100%; }
  100% { top:0; }
}
@keyframes index_slider_type3_odd_next {
  0% { top:-100%; }
  100% { top:0; }
}
@-webkit-keyframes index_slider_type3_even_next {
  0% { top:100%; }
  100% { top:0; }
}
@keyframes index_slider_type3_even_next {
  0% { top:100%; }
  100% { top:0; }
}

/* ズームアウト・ズームイン（スライダー用） */
@-webkit-keyframes index_slider_type4_current {
  0% { transform: scale(1); }
  70% { transform: scale(2.0); }
}
@keyframes index_slider_type4_current {
  0% { transform: scale(1); }
  70% { transform: scale(2.0); }
}
@-webkit-keyframes index_slider_type4_next {
  0% { transform: scale(2.0); opacity:0; }
  100% { transform: scale(1); opacity:1; }
}
@keyframes index_slider_type4_next {
  0% { transform: scale(2.0); opacity:0; }
  100% { transform: scale(1); opacity:1; }
}




/* ----------------------------------------------------------------------
 WordPress プリセットスタイル
---------------------------------------------------------------------- */
/* alignment */
.post_content .alignright { float:right; }
.post_content .alignleft { float:left; }
.post_content .aligncenter { display:block; margin-left:auto; margin-right:auto; margin-bottom:7px; }
.post_content blockquote.alignleft, .post_content img.alignleft { margin:7px 24px 7px 0; }
.post_content .wp-caption.alignleft { margin:7px 14px 7px 0; }
.post_content blockquote.alignright, .post_content img.alignright { margin:7px 0 7px 24px; }
.post_content .wp-caption.alignright { margin:7px 0 7px 14px; }
.post_content blockquote.aligncenter, .post_content img.aligncenter, .post_content .wp-caption.aligncenter { margin-top:7px; margin-bottom:7px; }


/* text and headline */
.post_content p { line-height:1.8; margin-left:2em; }
.post_content h1, .post_content h2, .post_content h3, .post_content h4, .post_content h5, .post_content h6 { clear:both; line-height:1.4;  margin:0 0 10px 0; padding:10px 0 0 0; }
.post_content h1 { font-size:150%; }
.post_content h2 { font-size:140%; }
.post_content h3 { font-size:130%; }
.post_content h4 { font-size:120%; }
.post_content h5 { font-size:110%; }
.post_content h6 { font-size:100%; }


/* image */
.post_content img[class*="align"], .post_content img[class*="wp-image-"], .post_content img[class*="attachment-"], .post_content img.size-full, .post_content img.size-large, .post_content .wp-post-image, .post_content img
 { height:auto;/* max-width:100%; 9/9TOPページレイアウトのためコメントアウト：髙橋*/}


/* list */
.post_content li, .post_content dt, .post_content dd { line-height:2.2; }
.post_content ul, .post_content ol, .post_content dl { margin-bottom:0px; }
.post_content ol { list-style:decimal outside none; margin-left:1.5em; }
.post_content ul { list-style:none; }
.post_content li > ul, .post_content li > ol { margin-bottom:0; }
.post_content dt { font-weight:bold; }
.post_content dd { margin-bottom:1em; }


/* table */
.post_content td, .post_content th { border:1px solid #ccc; padding:10px 15px; line-height:2.2; background:#fff; }
.post_content th { background:#f2f2f2; font-weight:normal; }
/* table style */
.post_content table.table_no_border th, .post_content table.table_no_border td { border:none; padding-left:0; }
.post_content table.table_border_horizontal th, .post_content table.table_border_horizontal td { border-left:none; border-right:none; padding-left:0; }
body.light_color .post_content td, body.light_color .post_content th { border:1px solid #ccc; background:#fafafa; }
body.light_color .post_content th { background:#eee; }


/* block quote */
.post_content blockquote { margin:0 0 25px 0; padding:27px 30px 0; background:#fff; border:1px solid #ccc; box-shadow:0px 4px 0px 0px #f8f8f8; position:relative; }
.post_content blockquote:before { content: '"'; font-style:italic; font-size:30px; font-weight:normal; line-height:40px; width:30px; height:30px; position:absolute; top:5px; left:10px; color:#5cbcd7; }
.post_content blockquote:after { content: '"'; font-style:italic; font-size:30px; font-weight:normal; text-align:left; line-height:60px; width:30px; height:30px; position:absolute; bottom:7px; right:-2px; color:#5cbcd7; }
.post_content blockquote cite { border-top:1px dotted #aaa; display:block; padding:20px 0 0 0; font-style:italic; text-align:right; font-size:90%; }


/* captions */
.post_content .wp-caption {
  margin-bottom:24px; background:#f8f8f8; border:1px solid #ccc; padding:5px; max-width:100%;
  -webkit-border-radius:5px; border-radius:5px;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.post_content .wp-caption-text { text-align:center; font-size:12px; font-style:italic; line-height:1.5; margin:9px auto; }
.post_content .wp-caption img[class*="wp-image-"] { display:block; margin:0 auto; }


/* gallery */
.gallery { margin-bottom:20px; }
.gallery a img { border: 0 !important; }
.gallery-item { float:left; margin:0 4px 4px 0; overflow:hidden; position:relative; }
.gallery-columns-1 .gallery-item { max-width:100%; }
.gallery-columns-2 .gallery-item { max-width:48%; max-width:-webkit-calc(50% - 4px); max-width:calc(50% - 4px); }
.gallery-columns-3 .gallery-item { max-width:32%; max-width:-webkit-calc(33.3% - 4px); max-width:calc(33.3% - 4px); }
.gallery-columns-4 .gallery-item { max-width:23%; max-width:-webkit-calc(25% - 4px); max-width:calc(25% - 4px); }
.gallery-columns-5 .gallery-item { max-width:19%; max-width:-webkit-calc(20% - 4px); max-width:calc(20% - 4px); }
.gallery-columns-6 .gallery-item { max-width:15%; max-width:-webkit-calc(16.7% - 4px); max-width:calc(16.7% - 4px); }
.gallery-columns-7 .gallery-item { max-width:13%; max-width:-webkit-calc(14.28% - 4px); max-width:calc(14.28% - 4px); }
.gallery-columns-8 .gallery-item { max-width:11%; max-width:-webkit-calc(12.5% - 4px); max-width:calc(12.5% - 4px); }
.gallery-columns-9 .gallery-item { max-width: 9%; max-width:-webkit-calc(11.1% - 4px); max-width:calc(11.1% - 4px); }
.gallery-columns-10 .gallery-item { max-width: 7%; max-width:-webkit-calc(9.4% - 0px); max-width:calc(9.4% - 0px); }
.gallery-columns-1 .gallery-item:nth-of-type(1n), .gallery-columns-2 .gallery-item:nth-of-type(2n), .gallery-columns-3 .gallery-item:nth-of-type(3n), .gallery-columns-4 .gallery-item:nth-of-type(4n), .gallery-columns-5 .gallery-item:nth-of-type(5n), .gallery-columns-6 .gallery-item:nth-of-type(6n), .gallery-columns-7 .gallery-item:nth-of-type(7n), .gallery-columns-8 .gallery-item:nth-of-type(8n), .gallery-columns-9 .gallery-item:nth-of-type(9n), .gallery-columns-10 .gallery-item:nth-of-type(10n) { margin-right:0; }
.gallery-caption {
  background-color:rgba(0, 0, 0, 0.7); color:#fff; font-size:12px; line-height:1.5; margin:0; max-height:50%;
  opacity:0; padding:6px 8px; position:absolute; bottom:0; left:0; text-align:left; width:100%;
  -webkit-box-sizing:border-box; box-sizing:border-box;
}
.gallery-caption:before { content: ""; height:100%; min-height:49px; position:absolute; top:0; left:0; width:100%; }
.gallery-item:hover .gallery-caption { opacity: 1; }
.gallery-columns-7 .gallery-caption, .gallery-columns-8 .gallery-caption, .gallery-columns-9 .gallery-caption, .gallery-columns-10 .gallery-caption { display: none; }


/* etc */
.post_content .wp-smiley { border:0; margin-bottom:0; margin-top:0; padding:0; }
.post_content address { margin:0 0 24px 0; line-height:2.2; }
.post_content pre { border-left:3px solid #ccc; background:#f8f8f8; font-size:12px; margin:0 0 27px 0; line-height:1.7; padding:20px; overflow:auto; }
.post_content .sticky { }
.post_content .mejs-container { margin: 12px 0 25px; }


/* パスワード保護 */
.c-pw__desc, .c-pw__desc p { line-height:2.5; }
.c-pw__desc p { margin-bottom:16px; }
.c-pw__btn { border:none; background:#111; color: #fff; display: inline-block; padding: 0px 20px; font-size:14px; text-align:center; line-height:40px; height:40px; }
.c-pw__btn:hover { background:#333; color: #fff; }
.c-pw__btn--register { min-width: 160px; margin-bottom:32px; }
.c-pw__btn--submit { background:#111; color:#fff; min-width: 100px; border:0; cursor:pointer; top:-1px; position:relative; }
.c-pw .c-pw__btn:hover { text-decoration: none; }
.c-pw__box { width:100%; border:1px solid #ddd; padding: 25px 36px; display:inline-block; margin-bottom:40px; box-sizing: border-box; }
.c-pw__box .c-pw__box-desc { line-height:1.2; margin-bottom: 20px; }
.c-pw__box-label { margin-right: 14px; }
.c-pw__box-input { border:1px solid #ddd; background:#fff; height:40px; width:250px; margin-right: 13px; flex: 1; box-sizing: border-box; padding: 0 10px; }
.post_content .c-pw__btn, .post_content .c-pw__btn:hover { color: #fff; }


/* Cardlink style - カードリンクのスタイル */
.cardlink { word-wrap: break-word; max-width: 100%; margin: 45px 0 !important; padding: 12px; border: 1px solid #ddd; background: #fafafa; }
.cardlink_thumbnail { margin-right: 20px; float: left; }
.cardlink_content { line-height: 1.6; }
.cardlink_timestamp { display: inline; margin: 0; padding: 0; color: #222; font-size: 12px; line-height: 1.6; vertical-align: top; }
.cardlink_title { margin: 0 0 5px; font-size: 14px; }
.cardlink_title a { color: #000; font-weight: bold; text-decoration: none; }
.cardlink_title a:hover { text-decoration: underline; }
.cardlink_excerpt { overflow: hidden; color: #333; font-size: 12px; line-height: 1.8; }
.cardlink_footer { clear: both; }
.clear { clear: both; }
@media screen and (max-width: 767px) {
.cardlink_thumbnail { float: none; }
.cardlink_timestamp { line-height: 2.4; vertical-align: middle; }
.cardlink_excerpt { float: none; }
}




/* 共通 ##################################################################
#########################################################################
#######################################################################*/

/* Google Mapの設定 */
.p-btn {-webkit-box-sizing:border-box; box-sizing:border-box; display:inline-block; min-width:180px; height:50px; padding:0 15px; border-radius:0; color:#fff; font-size:14px; line-height:50px; text-align:center;}
@media screen and (max-width: 767px) {
.p-btn {height:45px; font-size:12px; line-height:45px;}
}

/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
.wpcf7{background:none !important; border:none !important; padding:0 !important; margin:0 auto !important;}
.form_wrap{width:40%; margin:0 auto;}
.check_left{float:left;}
.check_right{padding-top:4px !important;}
.accept{width:310px; margin:0 auto;}
label.check{width:30%; margin:0 auto;}
.inquiry th{text-align:left; padding-right:2%; width:30%; border:solid 1px #d7d7d7; vertical-align:middle;}
.inquiry td{border:solid 1px #d7d7d7; vertical-align:middle;}
.entry-content .inquiry tr,.entry-content table{border:solid 1px #d7d7d7;}
.haveto{font-size:7px; padding:5px; background:#ff9393; color:#fff; border-radius:2px; margin-right:5px; position:relative; bottom:1px;}
.any{font-size:7px; padding:5px; background:#93c9ff; color:#fff; border-radius:2px; margin-right:5px; position:relative; bottom:1px;}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{display:block;}
/*送信ボタンのデザイン変更*/
#formbtn{display:block; padding:1em 0; margin-top:30px; width:30%; background:#ffaa56; color:#fff; font-weight:bold; border-radius:5px; border: none;}
/*送信ボタンマウスホバー時*/
#formbtn:hover{background:#fff; color:#ffaa56;}
p.check input[type="checkbox"]{float:left !important; vertical-align: middle;}

@media(max-width:480px){
iframe{ width: 100% !important; height:auto !important; }
.form_wrap{width:100% !important; margin:0 auto !important; padding:0 !important;}
.wpcf7{width:100% !important; margin: 0 !important; padding:0 !important;}
.wpcf7-submit{width:60% !important;}
.screen-reader-response{width:100% !important; margin:0 !important; padding:0 !important;}
.inquiry table{width:100% !important; margin:0 !important; padding:0 !important;}
.inquiry th,.inquiry td {display:block!important; width:100%!important; border-top:none!important; -webkit-box-sizing:border-box!important; -moz-box-sizing:border-box!important; box-sizing:border-box!important;}
.inquiry tr:first-child th{border-top:1px solid #d7d7d7!important;}
.accept{width:100%; height:auto; margin:0 auto;}
}


/*class*/

.mt1{margin-top:1%;}
.mt2{margin-top:2%;}
.mt3{margin-top:3%;}
.mt4{margin-top:4%;}
.mt5{margin-top:5%;}
.mt10{margin-top:10%;}
.mt20{margin-top:20%;}
.mt30{margin-top:30%;}
.mt40{margin-top:40%;}
.mt50{margin-top:50%;}
.mt60{margin-top:60%;}
.mt70{margin-top:70%;}
.mt80{margin-top:80%;}
.mt90{margin-top:90%;}
.mt100{margin-top:100%;}
.mb5{margin-bottom:5%;}
.font200{font-size:200%;}
.font90{font-size:90%;}
.font80{font-size:80%;}
.center{text-align:center;}
img.left{float:left; margin-right:5%;}
.blue{color:#52658f;}
.lightred{color:#de5b5e;}
.big{font-size:240%;}
.bg_yellow{background:#ffe893;}
.bold{font-weight:700;}

/*文章の強調ドット*/
span.dot-text {position:relative; padding-top:0.2em;}
span.dot-text::before {position:absolute; content:""; width:0.12em; height:0.12em; border-radius:50%; background-color:#000; top:-5%; left:50%; transform:translate(-50%, 0);}
span.dot-text-white {position:relative; padding-top:0.2em;}
span.dot-text-white::before {position:absolute; content:""; width:0.12em; height:0.12em; border-radius:50%; background-color:#FFF; top:-5%; left:50%; transform:translate(-50%, 0);}

table.left-short td:first-child {width:20%; vertical-align:middle; border-left:none; border-right:none; background:none;}
table.left-short td:last-child{border-left:none; border-right:none; background:none;}
table.left-short td:nth-child(1),table.left-short td:nth-child(2) {border-top:none;}
table.left-long td:nth-of-type(2),table.left-long td:nth-of-type(4){width:10%; vertical-align:middle; text-align:center;}
table.left-long td:nth-of-type(1),table.left-long td:nth-of-type(3){background-image:linear-gradient(180deg, #ffffff 10%, #f9f8f7 90%);}
table.middle{font-size:95%;}
table.middle td{padding:0.5% 0 0.5% 0;}
table.middle td:first-child {width:60%; vertical-align:middle; border-left:none; border-right:none; background:none;}
table.middle td:last-child{border-left:none; border-right:none; background:none;}
table.middle td:nth-child(1),table.middle td:nth-child(2) {border-top:none;}
table.middle td i{font-size:60%;}
table.middle td i.title{font-size:100%;}

h3.contents_title{color:#4f5941; border-bottom: solid 3px #4f5941; position: relative; margin-bottom:3%;}
h3.contents_title:after {position:absolute; content: ""; display: block; border-bottom: solid 3px #c0ccaf; bottom: -3px; width: 20%;}
h3.base1:after {display: block; content: ""; height: 1px; background: -moz-linear-gradient(to right, rgb(0, 0, 0), transparent); background: -webkit-linear-gradient(to right, rgb(0, 0, 0), transparent); background: linear-gradient(to right, rgb(0, 0, 0), transparent);}

/* タブ切替｜事業実績・募集要項 */
.tab_wrap{width:100%; margin:3% auto;}
.tab_wrap input[type="radio"]{display:none;}
.tab_area{margin:0 1%;}
.tab_area label{width:15%; margin:0 1%; display:inline-block; padding:2% 0; color:#999; background:#f6f6f6; text-align:center; cursor:pointer; transition:ease 0.2s opacity;}
.tab_area label:hover{opacity:0.5;}
.panel_area{}
.tab_panel,.tab_panel2,.tab_panel3,.tab_panel4,.tab_panel5
{width:96%; padding:2%; display:none; font-size:85%;}
.tab_panel h4,.tab_panel2 h4,.tab_panel3 h4,.tab_panel4 h4,.tab_panel5 h4{font-weight:normal;}
table.panelin{margin-bottom:0;}
table.panelin td.title{background-image:linear-gradient(180deg, #ffffff 10%, #f9f8f7 90%);}
table.panelin td:first-child{width:25%;}
table.panelin td:last-child{width:25%;}

#tab1:checked ~ .tab_area .tab1_label,
#tab2:checked ~ .tab_area .tab2_label,
#tab3:checked ~ .tab_area .tab3_label,
#tab4:checked ~ .tab_area .tab4_label,
#tab5:checked ~ .tab_area .tab5_label{background:#7da0b4; color:#FFF;}

#tab1:checked ~ .panel_area #panel1,
#tab2:checked ~ .panel_area #panel2,
#tab3:checked ~ .panel_area #panel3,
#tab4:checked ~ .panel_area #panel4,
#tab5:checked ~ .panel_area #panel5{display:block;}

#tab1:checked ~ .panel_area #panel2,
#tab1:checked ~ .panel_area #panel3,
#tab1:checked ~ .panel_area #panel4,
#tab1:checked ~ .panel_area #panel5,

#tab2:checked ~ .panel_area #panel1,
#tab2:checked ~ .panel_area #panel3,
#tab2:checked ~ .panel_area #panel4,
#tab2:checked ~ .panel_area #panel5,

#tab3:checked ~ .panel_area #panel1,
#tab3:checked ~ .panel_area #panel2,
#tab3:checked ~ .panel_area #panel4,
#tab3:checked ~ .panel_area #panel5,

#tab4:checked ~ .panel_area #panel1,
#tab4:checked ~ .panel_area #panel2,
#tab4:checked ~ .panel_area #panel3,
#tab4:checked ~ .panel_area #panel5

#tab5:checked ~ .panel_area #panel1,
#tab5:checked ~ .panel_area #panel2,
#tab5:checked ~ .panel_area #panel3,
#tab5:checked ~ .panel_area #panel4
{display:none;}


.panel_bg1{background-image: -webkit-linear-gradient(top, #EBEBEB 0%, #DCDDDF 48%, #C4C5C7 99%);
  background-image: linear-gradient(-180deg, #EBEBEB 0%, #DCDDDF 48%, #C4C5C7 99%);}
.panel_bg2{
  background:#f3f9fd; }

/* モーダル */
.pum-content p{margin-bottom:2% !important;}
.pum-title{font-size:110% !important;}

a.flash:hover img {opacity:1; -webkit-animation:flash 1s; animation:flash 2.5s;}
@-webkit-keyframes flash { 0% {opacity:.4;}  100% {opacity:1;}}
@keyframes flash { 0% {opacity:.4;} 100% {opacity:1;}}
a.opacity li:hover{background:#fafcd2;}

@media screen and (max-width: 480px){
.wpcf7{width:90% !important; margin:0 auto !important;}
.tab_area label{width:40%;}
}

/* モーダル（jQuery Modal） */
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:1;padding:20px;box-sizing:border-box;background-color:#000;background-color:rgba(0,0,0,0.75);text-align:center}
.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-0.05em}.blocker.behind{background-color:transparent}
.modal{display:none; vertical-align:middle; position:relative; z-index:2; max-width:800px; box-sizing:border-box; width:90%; background:#fff; padding:2.5%; -webkit-border-radius:8px; -moz-border-radius:8px; -o-border-radius:8px; -ms-border-radius:8px; border-radius:8px; -webkit-box-shadow:0 0 10px #000; -moz-box-shadow:0 0 10px #000; -o-box-shadow:0 0 10px #000; -ms-box-shadow:0 0 10px #000; box-shadow:0 0 10px #000; text-align:left; margin-top:150px;}
.modal p{font-size:100%; line-height:1.4em;}
.modal img{max-width:100%; height:auto; margin-top:3%;}
table.middle a:hover{text-decoration: underline; color:#bc7d7e;}
.modal a.close-modal{position:absolute;top:-12.5px;right:-12.5px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-repeat:no-repeat;background-position:center center;background-image:url('img/download.png')}
.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}
.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}
.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.modal-spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}.modal-spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}
@-webkit-keyframes sk-stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.5)}20%{-webkit-transform:scaleY(1.0)}}
@keyframes sk-stretchdelay{0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}}

@media screen and (max-width: 480px){
.modal{margin-top:80px; margin-bottom:100px;}
}


/* トップページ ###########################################################
#########################################################################
#######################################################################*/

.maincatch{animation: fadeInUp 2s; text-align: center; color: #FFF; margin-top:-600px !important; position:relative; z-index:10;}
.maincatch h2{font-size:200% !important; text-shadow: 1px 2px 3px #808080;}
.maincatch p{line-height: 1.8 !important; text-shadow: 1px 2px 3px #808080;}
@keyframes fadeInUp {
0% {transform: translateY(10%); opacity: 0;}
100% {transform: translateY(0); opacity: 1;}
}

.groupvision{background:#008cd6; width:100%;}
.groupvision p{margin:0; text-align: center;}


/* Newpost Catch */

#npcatch li{overflow:hidden; clear:both; vertical-align:top; border-bottom: 1px dotted #CCC;}
#npcatch img{float:left; width:50px; padding:10px 10px 0 0;}
#npcatch .title{font-size:100%;}
#npcatch .title a{font-weight: 700; text-decoration: none;}
#npcatch .date {font-size: small; font-weight: 600; display:block; color: #adb5bf; margin-bottom: 5px;}
ul#npcatch li:before {width:0; height:0;}

.mt-5{margin-top:-5%;}
.home_about{min-height:400px; background:url(img/home_about.png) no-repeat left top; padding:0 0 0 800px; margin-top:3%;}
.home_about p,.home_service p,.home_recruit p{line-height:2.4rem;}
.home_service{min-height:400px; background:url(img/home_service.png) no-repeat right top; padding:0 800px 0 0; margin-top:3%; float:right;}
.home_recruit{min-height:400px; background:url(img/home_recruit.png) no-repeat left top; padding:0 0 0 800px; margin-top:3.5%;}
h2.home{font-size:200% !important; margin-bottom:4% !important;}

/* 会社案内ボタン */
button.homebtn{background:#609139; color:#fff; border:none; position:relative; height:60px; padding:0 4em; cursor:pointer; transition:800ms ease all; outline:none; clear:both; margin:4% 0;}
button.homebtn:hover{background:#fff; color:#609139;}
button.homebtn:before,button.homebtn:after{content:''; position:absolute; top:0; right:0; height:2px; width:0; background: #609139; transition:400ms ease all;}
button.homebtn:after{right:inherit; top:inherit; left:0; bottom:0;}
button.homebtn:hover:before,button.homebtn:hover:after{width:100%; transition:800ms ease all;}
/* 事業内容ボタン */
button.homebtn1{background:#c9b64a; color:#fff; border:none; position:relative; height:60px; padding:0 4em; cursor:pointer; transition:800ms ease all; outline:none; clear:both; margin:4% 0;}
button.homebtn1:hover{background:#fff; color:#c9b64a;}
button.homebtn1:before,button.homebtn1:after{content:''; position:absolute; top:0; right:0; height:2px; width:0; background: #c9b64a; transition:400ms ease all;}
button.homebtn1:after{right:inherit; top:inherit; left:0; bottom:0;}
button.homebtn1:hover:before,button.homebtn1:hover:after{width:100%; transition:800ms ease all;}
/* 採用情報ボタン */
button.homebtn2{background:#43a7e1; color:#fff; border:none; position:relative; height:60px; padding:0 4em; cursor:pointer; transition:800ms ease all; outline:none; clear:both; margin:4% 0;}
button.homebtn2:hover{background:#fff; color:#43a7e1;}
button.homebtn2:before,button.homebtn2:after{content:''; position:absolute; top:0; right:0; height:2px; width:0; background: #43a7e1; transition:400ms ease all;}
button.homebtn2:after{right:inherit; top:inherit; left:0; bottom:0;}
button.homebtn2:hover:before,button.homebtn2:hover:after{width:100%; transition:800ms ease all;}

h3.home_service2{font-weight: normal; text-align: center; font-size:125% !important;}
h3.home_service2 span{background:#c0b990; padding:0.5em; color:#fff; border-radius: 3px;}

.home_items {display: flex; justify-content: space-between;}
.home_items img{padding-top:8%;}
.home_items a{margin-right:2%; width:30%;}
.home_item-title{margin:2% 0 !important;}
.home_item-title span{background:#c0b990; padding:0.5em; color:#fff; border-radius: 3px;}
.home_item p{font-size:80%; line-height:1em;}

#global_menu > ul > li > a:hover {
  color: #aaa !important;
}

.top-page-bottom {
  margin-right: 10%;
  margin-left: 10%;
}

.article-list article {
  padding-top: 3%;
  padding-bottom: 6%;
  margin-left: 3%;
}

.article-list h3 {
  padding-top: 3%;
}

.article-list time {
  font-size: 12px;
}

.news .news-flex1 {
  flex: 1
}

.news .news-flex2 {
  flex: 2
}

.article-list hr:last-child {
  display: none;
}

.new-information {
  padding-top: 7%;
  max-width: 2224px;
  margin-left: auto;
  margin-right: auto;
}

.new-information .prev {
  display: none;
}

.new-information .next {
  display: none;
}

.new-information .pagination {
  justify-content: center;
  padding-top: 5%;
  padding-bottom: 2%;
}

.new-information .pagination .page-numbers {
  margin-right: 1%;
  padding: 15px;
}

.new-information .pagination .page-numbers:not(.current) {
  color: #aaa;
}

.new-information .flex1 {
  flex: 1
}

.new-information .flex2 {
  flex: 2
}

.new-information .news-item1 {
  margin-left: 9%;
  margin-top: 14%;
}

.new-information .news-item2 {
  margin-left: 9%;
  margin-top: 14%;
}

.new-information .news-item3 {
  margin-left: 25%;
  margin-top: 14%;
}

.new-information .breadcrumb {
  padding-bottom: 3px;
}

.consul .consul-box {
  flex: 1; /* 子要素が均等にスペースを占有する */
  display: flex;
}

.page-id-12 {
  padding-top: 0 !important;
}

.page-id-12 #header {
  display: none;
}

.page-id-479 {
  padding-top: 0 !important;
}

.page-id-479 #header {
  display: none;
}

.recurit-title-main {
  margin-left: 18%;
  margin-right: 3%;
  margin-top: 2%;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.senpai-info {
  margin-left: 200px;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.senpai-info .senpai-info-row1-left .senpai-info-name2 {
  font-size: 50px;
}

.senpai-info .senpai-info-row1-left .senpai-info-name2 .senpai-info-name2-small {
  font-size: 30px;
}

.senpai-info .senpai-info-row1-right div {
  font-size: 78px;
  font-weight: bold;
}

.senpai-info .senpai-info-row1-left .senpai-info-question-title {
  font-weight: bold;
}

.senpai-info .senpai-info-row1-left .senpai-info-question-title div {
  height: 40px;
}

.senpai-info .senpai-info-row1-left .senpai-info-question-title .senpai-info-question-title-left {
  border-right: 1px solid #fff;
}

.senpai-info .senpai-info-question1-detail-sentence {
  line-height: 2;
  min-width: 362px;
  padding-left: 1rem;
  padding-right: 1rem;
  margin: auto 2%;
}

.senpai-info .senpai-info-question1-detail-img {
  min-width: 265px;
}

/* Hamburger menu styling */
.hamburger-menu {
  display: none;
  flex-direction: column;
  cursor: pointer;
  width: 30px;
  height: 25px;
}

.hamburger-menu span {
  background-color: #333;
  height: 3px;
  margin: 4px 0;
  width: 100%;
  border-radius: 2px;
}

/* Default menu state (visible on larger screens) */
.menu-list {
  list-style-type: none;
  display: flex;
  gap: 20px;
}



@media screen and (max-width: 1050px){
  .recruit-button{
    display: none;
  }
  .respo-large-news {
    display: none !important;
  }
  .vr {
    display: none;
  }
  .respo-small-news {
    display: flex !important;
  }
  .respo-small-news .title {
    margin-top: 30px;
    margin-bottom: 14px;
    margin-left: 14.781px;
  }
  .respo-title {
    width: 30% !important;
  }
  .news-respo-small .respo-small-hr {
    display: block !important;
  }
  .main-respo-small .news-respo-small {
    margin-bottom: 7% !important;
  }
  .news-respo-small .news-respo-all-see-link {
    display: flex !important;
    justify-content: center;
  }
  .news-respo-small .news-respo-all-see-btn {
    position: initial;
    width: 250px !important;
    height: 60px;
  }
  .main-respo-small .home-business-contents .home-business-contents-1 {
    justify-content: center;
  }
  .main-respo-small .home-business-contents .home-business-contents-3 {
    justify-content: center;
  }
  .main-respo-small .top-page-bottom-small {
    display: block !important;
  }
  .main-respo-small .top-page-bottom-small .top-page-bottom1 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .main-respo-small .top-page-bottom-small .top-page-bottom2 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .main-respo-small .top-page-bottom-small .respo-small-hr {
    display: block !important;
  }
  .footer-respo-small .footer_logoimg {
    display: none;
  }
  .footer_information-small .company-information-div {
    display: flex;
    flex-direction: column;
    /* align-items: center; */
    margin-top: 30px;
  }
  .footer_information-small .foot-Text-Content {
    margin-left: 0px !important;
  }
  .footer_information-small .foot-Recruit-Menu ul {
    justify-content: start;
  }
  .footer_information-small .company-information .c-astsoil {
    margin-left: 0px !important;
  }
  .senpai1-main {
    background-image: none !important;
  }
  .senpai-info {
    margin-left: 20px !important;
  }
}
@media screen and (max-width: 780px){
  .slideshow .slide{
    width: 25%;
  }
  .slideshow .slide img{
    height: 70%;
  }
  .main-respo-small .slideshow .slide{
    display: list-item !important;
  }
}
@media screen and (max-width: 768px){
  .main-respo-small .home-business-contents .home-business-contents-2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .senpai-info-row1-right{
    display:none;
  }
  .senpai-info-question1-detail{
    display: block !important;
  }
  .senpai-info-question-title{
    width:95% !important;
  }
}
@media screen and (max-width: 480px){
/* .slideshow .slide img{
  height: 50%; */
/* .hamburger-menu {
  display: flex;
}
.menu-list {
  display: none;
  flex-direction: column;
  position: absolute;
  top: 60px;
  left: 0;
  background-color: white;
  width: 100%;
  text-align: center;
}
.menu-list.active {
  display: flex;
}
.menu-list li {
  padding: 10px 0;
} */
.Recruitment-Section {
  padding: 0% !important;
} 

.home_news { width:100%; height:200px; margin:0 auto 0 auto; overflow-y:scroll; -ms-overflow-style:none; scrollbar-width: none; font-size:80%;}
.detail{line-height:1.2rem; min-height:60px;}
ul#npcatch li img{margin-top:-2%;}
.news_title{text-align:center; width:70%; margin:0 auto;}
.home_about{width:90%; background:url(img/home_about.png) no-repeat top; background-size: contain; padding:0 5% 0 5%; margin-top:10%; font-size:80%;}
.home_about h2,.home_service h2,.home_recruit h2{padding-top:200px; font-size:100%;}
.home_about p,.home_service p,.home_recruit p{line-height:2em;}
.home_service{width:90%; background:url(img/home_service.png) no-repeat top; background-size: contain; padding:0 5% 0 5%; margin-top:5%; font-size:80%; margin-bottom:10%;}
.home_recruit{width:90%; background:url(img/home_recruit.png) no-repeat top; background-size: contain; padding:0 5% 0 5%; margin-top:10%; font-size:80%; margin-bottom:-20%;}
.home_item-title span{font-size:80%;}
button.homebtn,button.homebtn1,button.homebtn2{height:40px; padding:0 2em; margin:0;}
.maincatch{animation: fadeInUp 2s; text-align: center; color: #FFF; margin-top:-150px !important; position:relative; z-index:10;}
.maincatch h2{font-size:100% !important;}
.maincatch p{line-height: 1.4 !important; font-size:70%;}
.groupvision p{margin:65px 0 0 0; text-align: center;}
}

/* 会社案内 ###############################################################
#########################################################################
#######################################################################*/

.about_main{width:100%; min-height:480px; margin:0 auto; background:url(img/about_main.png) no-repeat #639137; background-position:center;}
.about_main_left{padding:3%; width:18%; float:left;}
.about_main_center{padding:3% 3% 3% 0; width:18%; float:left; margin-top:2%;}
.about_main_right{padding:3% 3% 3% 0; width:18%; float:left; margin-top:4%;}
.about_main_menu{float:right; margin:2% 2% 0 0;}
.about_main_menu ul li{display:block; padding:0.5em; background:#FFF; color:#65882f; border-radius:4px; margin-bottom:5%;}
.about_main h2{color:#FFF;}
.about_main p{color:#FFF; line-height:2em;}
.about1{min-height:400px;  background:url(img/about1_x2.png) no-repeat left top; padding:0 0 0 750px; margin-top:3%;}
.about2{min-height:400px;  background:url(img/about2.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right;}
.about2-map{min-height:400px; width:auto; padding:0 0 0 0 ; margin-top:1%; float:right; display: flex;}
.about3{min-height:400px; background:url(img/about3.png) no-repeat left top; padding:0 0 0 750px; margin-top:3%;}
.about4{min-height:400px; background:url(img/about4.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right;}
.about5{min-height:400px; background:url(img/about5.png) no-repeat left top; padding:0 0 0 750px; margin-top:3%;}
.about6{min-height:400px; background:url(img/about6.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right;}
.about7{padding:1% 0 1% 1%; background-image: -webkit-linear-gradient(left, #F4F4F4 4%, #DFDEDC 99%); background-image: linear-gradient(to right, #F4F4F4 4%, #DFDEDC 99%); margin-top:3%;}
.about7 h3{text-align:center; letter-spacing:1.1em; margin:2% 0;}
p.adress{padding-bottom:5%;}
.flex_test-box {display: flex; flex-wrap: wrap; align-content:stretch;}
.flex_test-item {padding:1%; margin:0.9%; border-radius:5px; width:29.2%; text-align:center; background: #FFF;}
.flex_test-item img{margin-bottom:-30px; padding:0;}
.flex_test-item h5{margin:30px 0 15px 0;}
.flex_test-item p{line-height:1.4rem; margin:0;}
.flex_test-item p.title{font-weight:600; margin:3% 0;}
.flex_test-item:nth-child(1) {}
.flex_test-item:nth-child(2) {}
.flex_test-item:nth-child(3) {}
.flex_test-item:nth-child(4) {}
.d-inline-flex { display: inline-flex; }

/* 組織図 */
section {min-height: 100%; display: flex;  flex-direction: column; padding: 50px 0; position: relative; }
section .github-badge {position: absolute; top: 0; left: 0; }
section .hv-container {flex-grow: 1; overflow: auto; justify-content: center; }
p.simple-card {margin:0; background:#fff; color:#000; padding:30px; border-radius:7px; min-width:100px; text-align:center; box-shadow:0 3px 6px #000; }
.hv-item-parent p {color: #000; }
.hv-wrapper {display: flex; }
.hv-wrapper .hv-item {display: flex; flex-direction: column; margin: auto; }
.hv-wrapper .hv-item .hv-item-parent {margin-bottom: 50px; position: relative; display: flex; justify-content: center; }
.hv-wrapper .hv-item .hv-item-parent:after {position:absolute; content:''; width:2px; height:25px; bottom:0; left:50%; background:#000; transform: translateY(100%); }
.hv-wrapper .hv-item .hv-item-children {display: flex; justify-content: center; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child {padding: 0 15px; position: relative; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child:before, .hv-wrapper .hv-item .hv-item-children .hv-item-child:not(:only-child):after {content: ''; position: absolute; background-color:#000; left: 0; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child:before {left: 50%; top: 0; transform: translateY(-100%); width: 2px; height: 25px; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child:after {top: -25px; transform: translateY(-100%); height: 2px; width: 100%; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child:first-child:after {left: 50%; width: 50%; }
.hv-wrapper .hv-item .hv-item-children .hv-item-child:last-child:after {width: calc(50% + 1px); }

/* タイムライン */
.timeline {list-style:none;}
.timeline > li {margin-bottom:60px;}
@media ( min-width : 640px ){
.timeline > li {overflow:hidden; margin:0; position:relative;}
.timeline-date {width:110px; float:left; margin-top:20px;}
.timeline-content {width:75%; float:left; border-left:3px #e5e5d1 solid; padding-left:30px;}
.timeline-content:before {content: ''; width:12px; height:12px; background:#6fc173; position:absolute; left:106px; top:14px; border-radius:100%;}
}

@media screen and (max-width: 480px){
.about_main{width:100%; min-height:auto; margin:-2% 0 0 0 !important; background:url(img/about_main.png) no-repeat #639137; background-position:top; background-size: contain;}
.about_main_menu{padding:0; width:100%; float:none;}
.about_main_left{width:90%; margin:15% auto 0 auto; float:none; clear:both;}
.about_main_center{width:90%; margin:-10% auto 0 auto; float:none;}
.about_main_right{width:90%; margin:-10% auto 0 auto; float:none;}
.about_main_menu ul{margin:2% 0 0 2%; padding:100px 0 0 0;}
.about_main_menu ul li{display:block; padding:0.5em; background:#FFF; color:#65882f; border-radius:4px; margin:0 2% 2% 0; float:left; width:44%;}
.about1{width:100%; background:url(img/about1_x2.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about2{width:100%; background:url(img/about2.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about3{width:100%; background:url(img/about3.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about4{width:100%; background:url(img/about4.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about5{width:100%; background:url(img/about5.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about6{width:100%; background:url(img/about6.png) no-repeat; padding:0; margin-top:3%; background-size: contain;}
.about7{padding:1% 0 1% 1%; background-image: -webkit-linear-gradient(left, #F4F4F4 4%, #DFDEDC 99%); background-image: linear-gradient(to right, #F4F4F4 4%, #DFDEDC 99%);}
.about7 h3{text-align:center; letter-spacing:1.1em; margin:2% 0;}
p.adress{padding-bottom:5%;}
.flex_test-box {display: flex; flex-wrap: wrap; align-content:stretch;}
.flex_test-item {padding:1%; margin:0.9%; border-radius:5px; width:100%; text-align:center; background: #FFF; overflow: hidden;}
.flex_test-item img{margin-bottom:-30px; padding:0;}
.flex_test-item h5{margin:30px 0 15px 0;}
.flex_test-item p{line-height:1.4rem; margin:0;}
.flex_test-item p.title{font-weight:600; margin:3% 0;}
.flex_test-item:nth-child(1) {}
.flex_test-item:nth-child(2) {}
.flex_test-item:nth-child(3) {}
.flex_test-item:nth-child(4) {}
}

@media screen and (max-width: 480px){
.about1,.about2,.about3,.about4,.about5,.about6{margin-top:30px; padding-top:170px;}
table.left-short td:first-child{width:25%;}
.about7 h3{padding-top:3px;}
.timeline > li {overflow:hidden; margin:0; position:relative;}
.timeline-date {width:110px; float:left; margin-top:20px;}
.timeline-content {width:50%; float:left; border-left:3px #e5e5d1 solid; padding-left:30px;}
.timeline-content:before {content: ''; width:12px; height:12px; background:#6fc173; position:absolute; left:105px; top:10px; border-radius:100%;}
}

/* 事業内容 ###############################################################
#########################################################################
#######################################################################*/

.service_title{font-size:250% !important;}
.service_title span{ padding:1em 1em 0 1em;}
.service_title_left{margin-left:10px !important; margin-top:100px !important;}
.service_title_right{margin-right:10px !important; float:right; z-index:50 !important; position:relative; margin-bottom:-30px !important;}
.service_main_wrap{width:100%; height:480px; margin:0 auto; background:url(img/service_main_bg.png) repeat-x;}
.service_main{width:100%; height:480px; margin:0 auto; background:url(img/service_main.png) no-repeat; background-position:center;}
.service_menu_wrap{display:flex; justify-content: space-between; width:1200px; margin:0 auto; padding-top:100px;}
.service_menu_top_wrap{width:350px; margin:0 auto;}
.service_menu_top{display:inline-block; text-decoration:none; color:#FFF; font-size:250%; width:350px; line-height:85px; margin:60px 0 0 -10px; height:80px; padding:25px 10px 25px 10px; border-radius:30px; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in1; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); background:#462c12 url(img/service_menu_top_bg.png) repeat;}
.service_menu{display:inline-block; text-decoration:none; color:#000; font-size:190%; width:350px; padding:25px 10px 0 10px; border-radius:30px; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in1; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); background:#f6f1d8 url(img/service_menu_btn_bg.png) repeat;}
.service_menu ul{margin-top:5%;}
.service_menu ul li{font-size:45%; line-height:2em; list-style:none; margin:0 0 0 -40px; padding:0;}
@keyframes fade-in1 {0%{opacity:0; transform:translate3d(0, -20px, 0);}100%{opacity:1; transform: translate3d(0, 0, 0);}}
.service_menu a:link,
.service_menu a:visited{}
.service_menu a:hover{}
.service1{min-height:400px; width:650px; background:url(img/service1.png) no-repeat left top; padding:0 0 0 750px;}
.service2{min-height:400px; width:650px; background:url(img/service2.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right; z-index:1 !important;}
.service3{min-height:400px; width:650px; background:url(img/service3.png) no-repeat left top; padding:0 0 0 750px;}
.service4{min-height:400px; width:650px; background:url(img/service4.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right; z-index:1 !important;}
.service1 p,.service2 p,.service3 p,.service4 p{line-height:1.8rem;}
.form_wrap{width:1250px; margin:3% auto;}
.btn_wrap{width:1250px; margin:3% auto;}
.service-item{border:2px solid #f1f4e9; background:#FFF; padding:3% 3% 0 3%; border-radius:5px; margin-top:2%;}
.service-item p{font-size:95%; line-height:1.6rem;}
.service-item h5{padding:0 0 1.5% 0;}
.service-item h5 span{position:relative; padding:.75em 1em .75em 1em;}
.service-item h5 span::after{position:absolute; top:.5em; left:0; content:''; width:6px; height:-webkit-calc(100% - 1em); height:calc(100% - 1em); background-color:#4f5941; border-radius:4px;}
a.service:hover {opacity:1; -webkit-animation:flash 1s; animation:flash 2.5s;}
@-webkit-keyframes flash { 0% {opacity:.4;}  100% {opacity:1;}}
@keyframes flash { 0% {opacity:.4;} 100% {opacity:1;}}
img.catch{width:50%; margin:0 3% 0 0; float:left; border-radius:5px;}
.slide_wrap{width:50%; float:right; margin:0 0 0 2%;}

@media screen and (max-width: 480px){
.service_main_wrap{width:100%; height:185px !important; margin:0 auto; background:url(img/service_main_bg.png) repeat-x contain; }
.service_menu_top_wrap{width:30% !important; margin:0 auto !important; padding-top:5%;}
.service_menu_top{display:block; text-decoration:none; color:#FFF; font-size:100%; width:100%; line-height:1; margin:0 0 2% -10%; height:auto; padding:10%; border-radius:10px; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in1; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); background:#462c12 url(img/service_menu_top_bg.png) repeat;}
.service_title{display: none;}
.service_main{width:100%; min-height:auto; margin:-2% 0 0 0 !important; background:none; background-position:top; background-size: contain;}
.service_menu_wrap{display: contents; height:200px !important; width:90%; margin:0 auto !important; padding-top:3%;}
.service_menu{display:block; text-decoration:none; color:#000; font-size:100%; width:80%; padding:10px; margin:0 auto 1% auto; border-radius:10px; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in1; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); background:#f6f1d8 url(img/service_menu_btn_bg.png) repeat;}
.service_menu_wrap ul{display:none;}
.service1{width:100%; background:url(img/service1.png) no-repeat; padding:0; margin-top:3%;}
.service2{width:100%; background:url(img/service2.png) no-repeat top right; padding:0; margin-top:3%;}
.service3{width:100%; background:url(img/service3.png) no-repeat; padding:0; margin-top:3%;}
.service4{width:100%; background:url(img/service4.png) no-repeat top right; padding:0; margin-top:3%;}
.service1,.service2,.service3,.service4{background-size:45%;}
.service_wrap1{width:62%; padding-left:38%;}
.service_wrap2{width:62%; padding-right:38%;}
.form_wrap{width:100%; margin:3% auto;}
.btn_wrap{width:100%; margin:3% auto;}
}

/* 事業実績 ###############################################################
#########################################################################
#######################################################################*/

.works_wrap{display:flex; flex-wrap: wrap; width:94%; margin:0 auto;}
.works_detail{width:calc(50% - 7%); justify-content: space-between; background:#CCC; border-radius: 1rem; padding:2%; margin:1.5% 1.5% 1.5% 1.5%;}
.works_detail:nth-child(odd){}

/* 採用情報 ###############################################################
#########################################################################
#######################################################################*/

.recruit_title{text-align:center; width:30%; margin:5% auto;}
.recruit_title h3{border-bottom:1px solid #000; padding-bottom:5%; font-size:200% !important; margin-bottom:5%;}
.recruit_main{width:100%; min-height:130px; padding-top:350px; margin:0 auto; background:url(img/recruit_main.png) no-repeat #43a7e1; background-position:center;}

.recruit_menu_wrap{display:flex; justify-content: space-between; width:750px; margin:-10% auto 0 auto;}
.recruit_menu{/*display:inline-block;*/ text-decoration:none; font-size:150%; width:200px; height:80px; padding-top:30px; line-height:35px; border-radius:50%; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in2; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); border:5px solid #fff;}
@keyframes fade-in2 {0%{opacity:0; transform:translate3d(0, -20px, 0);}100%{opacity:1; transform: translate3d(0, 0, 0);}}
.bg_lightblue{background:#42a6e1;}
.bg_yellow{background:#ffe893;}
.text_white{color:#FFF;}
.text_lightblue{color:#42a6e1;}
.recruit1{min-height:400px; width:650px; background:url(img/recruit1.png) no-repeat left top; padding:0 0 0 750px; margin-top:3%;}
.recruit2{min-height:400px; width:650px; background:url(img/recruit2.png) no-repeat right top; padding:0 750px 0 0; margin-top:3%; float:right;}
.recruit3{min-height:400px; width:650px; background:url(img/recruit3.png) no-repeat left top; padding:0 0 0 750px; margin-top:3%;}
.post_content h4.recruit {position:relative; padding: 7px 7px 7px 42px; background:#4acbfb; font-size:20px; color:white; margin-left:-33px; line-height:1.3; z-index:-1; margin-bottom:4%;}
.post_content.recruit h4:before {position:absolute; content: ''; left:-2px; top:-2px; border:none; border-left:solid 40px white; border-bottom:solid 79px transparent; z-index:-2;}
.item {width:100%;}
.item-img {padding:0; max-height:160px; overflow:hidden;}
.item-body {padding:0;}
.item-title {margin:3px 0 8px; font-size:16px;}
.item-body p {font-size:16px; font-weight:400; color:#333;}
.items {display:flex; justify-content:space-between; margin-bottom:2%;}
.items .item {width:30%;}
.item:last-child{justify-content: start;}
table.recruit td{border-color:#c6d6e0;}
table.recruit td.title{background:#e1eff7 !important; text-align:left !important; font-size:130%;}
table.recruit td:first-child{background:#f7fafc; text-align:center; vertical-align:middle;}
table.recruit td.title:before {background-color: #c6d6e0; border-radius: 3px; content: ""; display: inline-block; height: 25px; margin-right: 15px; vertical-align: middle; width: 7px;	margin-top:-5px;}
img.mynavi{width:20%;}
p.fusen{transform: rotate(-10deg); font-size:120% !important; line-height:1.4em !important; width: 19.5rem; height: 2.5rem; padding: 1.5em 1em 1em 3em; overflow: hidden; box-shadow: .25rem 0 .25rem hsla(0, 0%, 0%, .1); background-image:linear-gradient(90deg, hsla(0, 0%, 45%, .1) 2rem, hsla(0, 100%, 100%, 0) 2.5rem) , linear-gradient(90deg, hsla(60, 100%, 85%, 1), hsla(60, 100%, 85%, 1)); font-size: 1.125rem; line-height: 1.8; white-space: nowrap; text-overflow: ellipsis; font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}

@media screen and (max-width: 480px){
.recruit_title{text-align:center; width:75%; margin:5% auto;}
.recruit_title h3{border-bottom:1px solid #000; padding-bottom:5%; font-size:150% !important; margin-bottom:5%;}
.recruit_title p{font-size:90%;}
.recruit_main{width:100%; min-height:130px; padding-top:20px; margin:0 auto; background:url(img/recruit_main.png) no-repeat #43a7e1; background-position:center;}
.recruit_menu_wrap{display:flex; justify-content: space-between; width:80%; margin:-10% auto 0 auto;}
.recruit_menu{display:inline-block; text-decoration:none; font-size:100%; width:90px; height:auto; padding:10%; margin-right:2% !important; line-height:100%; border-radius:50%; text-align:center; overflow:hidden; opacity:0; animation-name:fade-in2; animation-duration:2s; animation-timing-function:ease-out; animation-delay:1s; animation-iteration-count:1; animation-direction:normal; animation-fill-mode:forwards; box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -moz-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); -webkit-box-shadow: 0px 0px 5px rgba(000,000,000,0.5); border:3px solid #fff;}
.recruit_menu:first-child{margin-left:-10%;}
.recruit1{min-height:auto; width:100%; background:url(img/recruit1.png) no-repeat; background-size:contain; padding:170px 0 0 0; margin-top:3%;}
.recruit2{min-height:auto; width:100%; background:url(img/recruit2.png) no-repeat; background-size:contain; padding:170px 0 0 0; margin-top:3%; float:none;}
.recruit3{min-height:auto; width:100%; background:url(img/recruit3.png) no-repeat; background-size:contain; padding:170px 0 0 0; margin-top:3%;}
}

/* ワイヤーフレーム */

/*ここからTOP*/

.Fv-loader{
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 555;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: white;
}

.Fv-loader img {
  opacity: 0; /* 初期状態で透明 */
  transition: opacity 3s ease; /* フェードインのトランジション */
}

.first_view {
  position: relative;
}

button{
  margin: 5% 10%;
}

.first-view img{
  position: absolute;
}

#top .change{
  position: absolute;
  top: 0;
  left: 0;
	width: 100%;
  height: 100%;
	opacity: 0;
  background-color: #fff;
	animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

@keyframes change-img-anim {
  0%{ opacity: 0;}
  30%{ opacity: 1;}
  36%{ opacity: 1;}
  45%{ opacity: 1;}
  100%{ opacity: 1;}
}

.sokuryo-jump {
  width: 11vw;
  position: absolute;
  z-index: 5;
  top: 64%;
  left: 63%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.kyoryo-jump {
  width: 9vw;
  position: absolute;
  z-index: 5;
  top: 72%;
  left: 16%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.bridge-check-jump {
  width: 9vw;
  position: absolute;
  z-index: 5;
  top: 76%;
  left: 34%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.access-jump {
  width: 7vw;
  position: absolute;
  z-index: 5;
  top: 54%;
  left: 76%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.ground-check-jump {
  width: 5vw;
  position: absolute;
  z-index: 5;
  top: 46%;
  left: 23%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.spt-jump {
  width: 4vw;
  position: absolute;
  z-index: 5;
  top: 41%;
  left: 69%;
  opacity: 0;
  object-fit: contain;
  animation: change-img-anim 15s forwards;
  animation-delay: 2s;
}

.kurashi{
  position: absolute;
  top: 12%;
  left: 8%;
}

.big{
  position: absolute;
  top:80%;
  left:85%;
  transition: 1s;
}

.big:hover {
  transform: perspective(250px)translateZ(100px);
  transition: 1s;
}

.turn{
  position: fixed;
  top:57%;
  left:87%;
  z-index: 30;
  transition: 1s;
}

.turn:hover {
  transform: rotateY(180deg);
  transition: 2s;
}

main{
  width: 100%;
  height: auto;
  background-color: #ecebe6;
  margin: auto;
  padding-bottom: 5%;
  max-width: 2224px;
}

.wrap{
  display: flex;
  align-items: center;
  overflow: hidden;
}

.slideshow{
  display: flex;
  list-style-type: none;
  animation: loop-slide 20s infinite linear 1s both;
  margin-top: 5%;
}

@keyframes loop-slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

.news{
  width: 80%;
  margin: 5% 10% 3% 10%;
  font-size: 20pt;
  background-color: #ecebe6;
}

.news small{
  font-size: 10pt;
}

.title{
  width:53%;
  margin-top: 3%;
  margin-bottom: 5%;
}

.jigyou-button{
  display: none;
}

.news button{
  width: 44%;
  height: 70%;
  margin: 3% 0;
  background-color: #FFF;
  border: solid 3px;
  border-radius: 20px;
}
.news p{
  margin: 3% 0 5% 3%;
}

.content img{
  margin: 0 10% 0 10%;
}

/* .justify-content-center{
  margin-left: 7%;
} */

.boder{
  margin: 0 8%;
}

.turn1{
  margin: 3% 0 3% 10%;
  transition: 1s;
}

.turn1:hover{
  transform: rotateY(360deg);
  transition: 2s;
}

main .img-1 {
  width: 20%;
  background: url(img/access_03.png) no-repeat;
  background-size: 87%;
  margin: 7% 2% 7% 4%;
  }

main .img-1:hover{
  background: url(img/access_long03_03.png) no-repeat;
  background-size: 100%;
}

main .img-2 {
  width: 20%;
  background: url(img/saiyo.png) no-repeat;
  background-size: 80%;
  margin: 7% 7% 3% 4%;
}

main .img-2:hover{
  background: url(img/saiyo_long.png) no-repeat;
  background-size: 92%;
}

.vr{
  height: auto;
  color: #b5b6b7;
}

.pagetop{
  position: fixed;
  bottom: 2%;
  right: -3%;
}

.pagetop a{
  display: block;
  text-decoration: none;
}

.pagetop:hover{
  opacity: 0.5 ;
}


/*ここからabout*/

#top{
  position: relative;
}

.company1{
  z-index: 1;
}

.company2{
margin: 5% 5% 0 0;/* 修正案31 */
}

.about-top {
  display: flex;
}

.bussiness-top {
  display: flex;
}

.scroll {
  position: absolute;
  top: 0;
  overflow: hidden;
}

.scroll_item{
    position: relative;
    width: 10%;
    left: 5%;
    margin-top: 10%;
    z-index: 5;
}

.scroll_item2{
    position:relative;
    width: 16%;
    left: 35%;
    margin-top: 17%;
    margin-bottom: 25%;
    z-index: 5;
  }

.scroll_item3{
  position:relative;
  width: 10%;
  left: 67%;
  margin-top: 14%;
  z-index: 5;
}
  
.scroll_item4{
  position:relative;
  width: 10%;
  left: 93%;
  margin-top: 8%;
  z-index: 5;
}
  
.scroll_list {
    display: flex;
    list-style-type: none;
    animation: loop-slide 20s infinite linear 1s both;
}

@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
  
.breadcrumb{
  position:relative;
  width: 100%;
  height: auto;
  background-color: #ecebe6;
  color: #b5b6b7;
  padding: 2% 0;
  margin: 0;
}
  
article{
  width: 100%;
  margin: 0 auto;
  background-color:  #ecebe6;
  position: static;  
  max-width: 2224px;
}

.hr1{
  position:static;
  width: 90%;
  margin: 0 auto;
  border-top: 3px solid #b5b6b7;
  }

section{
  padding: 3% 5%;
  letter-spacing: 0.12em;
  position: relative;
  background-color: #ecebe6;
  max-width: 2224px;
  margin-left: auto;
  margin-right: auto;
}
  
section small{
  font-size: 15pt;
  font-weight: 100;
  letter-spacing: 0;
}
  
section h1{
  font-size: 30pt;
  font-weight: bold;
  letter-spacing: 0.2em;
}

section h2{
  margin: 2% 0;
  font-size: 18pt;
  font-weight: bold;
}

section p {
  line-height: 40px;
}
  
.about-title{
  margin: 2% 0;
}
  
.turn2{    
  width: 30%;
  height: 30%;
  margin: 2% 5%;
  transition: 1s;
}
  
.turn2:hover {
  transform: rotateY(180deg);
  transition: 2s;
}
  
.half{
  width:100%;
  height:auto;
  margin: auto;
  background: linear-gradient(180deg, #ecebe6 0%, #ecebe6 50%, #fff 50%, #fff 100%);
}

.half img{
  margin: 3% 10%;
}
  
.white{
  background-color: #fff;
  padding: 3% 5%;
  letter-spacing: 0.12em;
  position: relative;
}
.white small{
  font-size: 15pt;
  font-weight: 100;
  letter-spacing: 0;
}
  
.white h1{
  font-size: 30pt;
  font-weight: bold;
  letter-spacing: 0.2em;
}

.white h2{
  margin: 2% 0;
  font-size: 18pt;
  font-weight: bold;
}

.white p {
  line-height: 30px;
}


.outline{
  font-size: 12pt;
  margin-top: 2%;
  line-height: 20px;
}

.outline td{
  padding-bottom: 0.5rem;
}

.outline td:first-child {
  min-width: 106px;
}

.outline td:nth-of-type(2) {
  padding: 0 1rem;
}
.soshiki{
  width: 50%;
  height: 40%;
  margin-top: 2%;
}
  
.flex-row{
  position: relative;
}
  
.history{
  width: 100%;
  height: auto;
  font-size: 12pt;
}
  
.history .left-td{
  text-align: right;
}
  
.history th{
  font-size: 25pt;
}

.history td {
  line-height: 2em;
}

.history td:nth-of-type(2) {
  padding: 0 0.25rem;
}

.history td:nth-of-type(3) {
 min-width: 110px;
}
.history td:nth-of-type(4) {
  padding: 0 0.25rem;
}

.space_2{
  font-size: 70%;
}

.fluffy-width{
  position: absolute;
  top: 29%;
  left: 1%;
  width: 16%;
}

.fluffy-width1{
  position: absolute;
  top: 25%;
  left: 78%;
  width: 16%;
}

.fluffy-width2{
  position: absolute;
  top: 50%;
  left: 78%;
  width: 16%;
}

.fluffy{
  /* margin-left: 8%; */
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1.5s;
}
  
.keyframe{
  animation-name: anim_po;
  position: absolute;
}
   
@keyframes anim_po {
  0% {
    top: 0px;
  }
  100% {
    top: 100px;
  }
}
  
.fluffy1{
  position: absolute;
  margin-left: 18%;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1.5s;
}

.keyframe1{
  animation-name: anim_po1;
  position: absolute;
}
     
@keyframes anim_po1 {
  0% {
    top: 100px;
  }
  100% {
    top: 0px;
  }
}

.merger{
  font-size: 15pt;
  text-align: center;
  font-weight: bold;
  position: static;
}

.moves{
  position: relative;
  bottom: 30vh;
  left: 80%;
  width: 20%;
  height: 20%;
}

.ball-1{
  position: absolute;
  top: 56%;
  left: -33%;
  width: 18%;
  height: auto;
}

.ball-2{
  position: absolute;
  top: -3%;
  left: -31%;
  width: 18%;
  height: auto;
  margin-top: -56%;
}

.ball-3{
  position: absolute;
  top: -5%;
  left: -8%;
  width: 18%;
  height: auto;
  margin-top: -32%;
}

.ball-4{
  position: absolute;
  top: -31%;
  left: 21%;
  width: 18%;
  height: auto;
  margin-top: -47%;
}

.ball-5{
  position: absolute;
  top: -35%;
  left: 53%;
  width: 18%;
  height: auto;
  margin-top: -47%;
}

.ball-6{
  position: absolute;
  top: -67%;
  left: 87%;
  width: 18%;
  height: auto;
  margin-top: -65%;
}

.ball-7{
  position: absolute;
  top: -23%;
  left: 87%;
  width: 18%;
  height: auto;
  margin-top: -42%;
}

.ball-8{
  position: absolute;
  top: 15%;
  left: 104%;
  width: 18%;
  height: auto;
  margin-top: -18%;
}

.ball-9{
  position: absolute;
  top: 57%;
  left: 95%;
  width: 18%;
  height: auto;
}


.fluffy2{
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1.5s;
}
  
.keyframe2{
  animation-name: anim_po2;
  position: absolute;
}
   
@keyframes anim_po2 {
  0% {
    top: 0px;
  }
  100% {
    top: 100px;
  }
}

.fluffy3{
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1.5s;
}
  
.keyframe3{
  animation-name: anim_po3;
  position: absolute;
}
   
@keyframes anim_po3 {
  0% {
    top: 100px;
  }
  100% {
    top: 0px;
  }
}

.move{
  position: relative;
}

.qualification{
  width:50%;
  font-size: 12pt;
  margin: 2%;
  height: auto;
}

.space{
  font-size: 130%;
}

.qualification th{
  font-weight: bold; 
  min-width: 175px;
  padding-right: 0.5rem;
}

.qualification td{
  border-left: solid 4px #dee2e6;
  padding: 0.2em 0.5rem;

}
.keyframe-height {
  height: 0;
}

.light{
  position: absolute;
  bottom: 15vh;
  width: 13%;
  margin-left: 30%;
  animation-timing-function: steps(2, end);
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1s;
}
.keyframe4{
  animation-name: anim_po4;
  position: relative;
}
     
@keyframes anim_po4 {
  0% {
    left: 10px;
    transform: rotate(-15deg);
  }
  100% {
    left: 0px;
    transform: rotate(15deg);
  }
}
  
.congra {
  position: absolute;
  bottom: 55vh;
  width: 13%;
  margin-left: 85%;
  animation-timing-function: steps(2, end);
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1s;
}

.keyframe5{
  animation-name: anim_po5;
  position: relative;
}
     
@keyframes anim_po5 {
  0% {
    left: 0px;
    transform: rotate(15deg);
  }
  100% {
    left: 10px;
    transform: rotate(-35deg);
  }
}
.access-content{
  margin-top: 5%;
  width: 48%;
}

.access-content p{
  padding-right: 1rem;
}

.access-content img{
  width: 100%;
}

.drive{
  position: absolute;
  top: 100%;
  left: 93%;
  overflow: hidden;
  width: 15%;
  height: auto;
  animation: anim_po6 10s infinite;
}

@keyframes anim_po6 {
  to {
    transform:translate(-1200%,-1000%);
    }
}

.affiliate{
  margin: 2% 3%;
}


/*ここからservice*/

.business{
  z-index: 1;
}
.business2{
  margin: 5% 5% 0 0;
}
/* 変更か不明
.link{
  width: 200px;
	padding: 1em;
	position: relative;
	box-sizing: border-box;
  font-size: 12pt;
  margin-top: 5%;
}
.link::before,
.link::after {
	content: '';
	width: 10px;
	height: 100%;
	position: absolute;
	box-sizing: border-box;
	border-top: solid 2px #a9a9a9;
	border-bottom: solid 2px #a9a9a9;
	top: 0;  
}
.link::before {
	border-left: solid 2px #a9a9a9;
	left: 0;
}
.link::after {
	border-right: solid 2px #a9a9a9;
	right: 0;
}
.link li{
  height: 20px;
}*/

.title_img{
  margin-top: 2%
}

.title_sub{
  margin: 2% 0 1% 0;
}

.title_thrid{
  margin-bottom: 1%;
}

.service-imege-box-bottom{
  display:flex;
  width:50%;
}

.service-imege-box-bottom2{
display: flex;
flex-direction: row;
justify-content: space-between;
}

.item-1{
  width: 30%;
  background-color: #FFF;
  border-radius: 20px;
  padding: 2%;
  margin: 5% 2% 0 2%;
}
.item-1 h3{
  font-weight: bold;
  margin-bottom: 5%;
  font-size: 15pt;
}
.item-1 p{
  font-size: 12pt;
  margin: 5% 0;
  text-align: justify;
}
.item-2{
  width: 45%;
  background-color: #FFF;
  border-radius: 20px;
  padding: 2%;
  margin: 5% 2% 0 2%;
}
.item-2 h3{
  font-weight: bold;
  margin-bottom: 5%;
  font-size: 15pt;
}
.item-2 p{
  font-size: 12pt;
  margin: 5% 0;
  text-align: justify;
}
.item-3 {
  flex: 1; /* ボックスの高さを均等にする */
  width: 100%; /* 幅を親要素に合わせる */
  border-radius: 20px;
  border: 1px solid #a9a9a9;
  padding: 2%;
  margin: 5% 0 0 0;
  display: flex;
  flex-direction: column; /* 内部の要素を縦に配置 */
}
.item-3 h3{
  font-weight: bold;
  margin-bottom: 5%;
  font-size: 15pt;
}
.item-3 p {
  font-size: 12pt;
  margin: 5% 0;
  text-align: justify;
  flex-grow: 1; /* テキスト部分が余ったスペースを占有する */
}
.roller{
  position: relative;
  z-index: 2;
}

.img_work_01{
  background-image: url("img/shigoto02.png");
}

.parallax_box_work {
  height: 400px;
  overflow-x: hidden;
  overflow-y: hidden;
}

.parallax_content_work{
  display: flex;
  height: 100%;
  padding: 100%;
  justify-content: center;
  align-items: center;
  background-size: contain;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
}

.roll_1{
  position: absolute;
  left: 68%;
  width: 8%;
  height: auto;
  margin-top: -4%;
  overflow: hidden;
  animation: anim_po7 10s infinite;
}

.roll_2{
  position: absolute;
  left: 76%;
  width: 8%;
  height: auto;
  margin-top: -4%;
  overflow: hidden;
  animation: anim_po7 10s infinite;
}

.roll_3{
  position: absolute;
  left: 84%;
  width: 8%;
  height: auto;
  margin-top: -4%;
  overflow: hidden;
  animation: anim_po7 10s infinite;
}

.roll_4{
  position: absolute;
  left: 92%;
  width: 8%;
  height: auto;
  margin-top: -4%;
  overflow: hidden;
  animation: anim_po7 10s infinite;
}

.roll_5{
  position: absolute;
  left: 100%;
  width: 8%;
  height: auto;
  margin-top: -4%;
  overflow: hidden;
  animation: anim_po7 10s infinite;
}

@keyframes anim_po7 {
  to {
    transform:translate(-1600%,0) rotate(-720deg);

    }
}



.consul-box .item-3{
  width: 95%;
  border-radius: 20px;
  border: 1px solid #a9a9a9;
  margin: 4% 0;
}

.jump{
  background-color: #fff;
}

.jump-up1{
  overflow: hidden;
  z-index: 0;
  animation: floating-y 1s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(-10%);
  }
  100% {
    transform: translateY(30%);
  }
}


.results tr{
  height: 35px;
  font-size: 11pt;
  border-bottom: 1px solid #a9a9a9;
  vertical-align: middle;
  font-weight: bold;
  letter-spacing: 0;
}
.results th{
  height: 50px;
  background-color: #fff;
  vertical-align: bottom;  
  text-align: center;
  vertical-align: middle;
}
.results th td{
  width: 30%;
}

.privacy{
  background-color: #FFF;
  margin-top: 10%;
}
.privacy h3{
  margin-top: 3%;
  font-weight: normal;
}
.address{
  margin-top: 2%;
}
.mb-2{
  margin: 3% 5%!important;
}
.overflow-y-scroll{
  background-color: #FFF;
  height: 300px;
  padding: 5%;
  background-color: #ecebe6;
}
.check{
  margin: 5% auto;
  white-space: nowrap;
}
.submit{
  margin: 5% auto;
  white-space: nowrap;
}
.faq{
    line-height: 30px;
    margin: 3% 5% 3% 0;
}
.hr2{
  margin: 0;
  border-top: 3px solid #b5b6b7;
}
.contact{
  width: 30%;
  height: 30%;
  margin: 2% 5%;
}
.contact2{
  position: absolute;
  top:16%;
  left:66%;
  z-index: 10;
}

.news-page th,.news-page td {
  border-top: rgb(181 182 183 / 25%) solid 3px;
}

.left-item{
  width: 20%;
  border-right: rgba(181, 182, 183, 0.25) solid 3px;
}

.news-title{
  margin: 10% 0 20% 0;
}

.post-area{
  padding: 5%;
}

.new-post #post_title_area .date{
  font-size: 20px;
}

.new-post #post_title_area .title {
  white-space: nowrap;
  font-size: 32px;
}

.new-post .post_content img{
  width: 96%;
  margin: 0 1% 5%;
}

.new-post .post_content p {
  width: 75%;
  line-height: 1.8;
  margin: 0;
}









.service-people-box {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}

.service-people-box-image {
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
  
}

.service-people-box-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.service-people-box-image div {
  position: relative;
  overflow: hidden;
  opacity: 0; /* 初期状態で非表示 */
  transform: translateY(100%); /* 下に隠れる */
}

.service-people-box-image div.custom-animated { 
  animation: shakeAnimation 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) forwards; /* 滑らかな動きを適用 */
}

@keyframes shakeAnimation {
  0% {
    opacity: 0; /* 完全に非表示 */
    transform: translateY(120%); /* 完全に隠れる */
  }
  20% {
    opacity: 1; /* 20%地点で表示開始 */
    transform: translateY(80%); /* 途中まで移動 */
  }
  40% {
    transform: translateY(60%); /* 徐々に上に移動 */
  }
  60% {
    transform: translateY(40%); /* さらに上に移動 */
  }
  80% {
    transform: translateY(-10%); /* ほぼ表示 */
  }
  100% {
    opacity: 1; /* 100%時点で完全に表示 */
    transform: translateY(0); /* 最終位置に到達 */
  }
}

@media (max-width: 768px) {
.business2 {
  display: none;
  }
}




/* serviceモーダル */
/* service-モーダルの基本スタイル */
.service-modal {
  display: none; /* 初期は非表示 */
  position: fixed;
  z-index: 10000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* 背景を半透明に */
}
@media (max-width: 768px) {
  .service-modal {
    display: none;
    }
  }

/* service-モーダルのコンテンツボックス */
.service-modal-content {
  position: relative;
  background-color: #fff;
  margin: 5% auto;
  padding: 20px;
  width: 50%;
  display: flex;
  justify-content: space-between;
  border-radius: 10px;
  max-height: calc(100% - 15%);
  overflow: auto;
}

/* 閉じるボタン */
.service-close {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 30px;
  cursor: pointer;
  display: inline-block;
}

.service-close::before {
  content: '';
  position: absolute;
  top: -30px; /* 拡張する範囲 */
  bottom: -30px;
  left: -30px;
  right: -30px;
  background: transparent; /* 背景は透明 */
}


/* service-モーダルの左側メニュー */
.service-modal-left {
  flex: 1;
  padding-right: 20px;
  border-right: 1px solid #ddd;
}

.service-modal-left ul {
  list-style: none;
  padding: 0;
}

.service-modal-left ul li {
  margin-bottom: 10px;
}

.service-modal-left ul li a {
  text-decoration: none;
  font-weight: bold;
}

/* モーダル二つ目 */
.service-modal-left2 {
  flex: 1;
  padding-right: 20px;
  border-right: 1px solid #ddd;
}

.service-modal-left2 ul {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  margin-top: 33%;
  padding-bottom:81%;
}

.service-modal-left2 ul li {
  margin-bottom: 10px;
}

.service-modal-left2 ul li a {
  text-decoration: none;
  font-weight: bold;
}


/* service-モーダルの右側コンテンツ */
.service-modal-right {
  flex: 2;
  padding-left: 20px;
}

/* 画像のスタイル */
.service-modal-right img {
  margin-top: 20px;
  border-radius: 5px;
  max-width: 100%;
  height: auto;
}

/* service-モーダルのフェードインアニメーション */
.service-modal.fade-in {
  display: block;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}


.service-modal-listtitle{
  background-color: green;
  color: white;
  text-align: center;
  border-radius: 5px;
  padding: 2%;
  font-size: 135%;
}

.service-modal-left ul li {
  margin: 3%;
}

.service-modal-maintitle{
  font-size: 140%;
  color: green;
}


.service-open-modal{
  cursor:pointer;
}

/* modalがわかるように+ボタン */
.service-more-button {
  font-size: 24px;
  height: 50px;
  width: 50px;
  background-color: rgba(223, 220, 220, 0.8); 
  color: #000;
  border-radius: 50%;
  text-align: center;
  line-height: 50px;
  position: absolute;
  bottom: 8px; /* 画像の下から8px */
  right: 8px; /* 画像の右から8px */
  z-index: 50;
  cursor: pointer;
  box-sizing: border-box;
}


.m-moreBtn2 {
  font-size: 24px;
  height: 50px;
  width: 50px;
  background-color: #fff;
  color: #000;
  border-radius: 50%;
  text-align: center;
  line-height: 50px;
  position: absolute;
  bottom: 8px; /* 画像の下から8px */
  right: 8px; /* 画像の右から8px */
  z-index: 50;
  cursor: pointer;
  box-sizing: border-box;
}

.service-more-button2 {
  bottom: 8px; /* 画像の下から8px */
  right: 51%; /* 画像の右から8px */ 
}


.service-more-button3 {
  bottom: 8px; /* 画像の下から8px */
  right: 8px; /* 画像の右から8px */ 
}

@media (max-width: 768px) {
  .service-more-button {
    display: none;
  }
  .service-more-button2 {
    font-size: 20px;
    line-height: 40px;
    bottom: 3px;
    right: 51%; 
    height: 40px;
    width: 40px;
  }
  
  .service-more-button3 {
    font-size: 20px;
    line-height: 40px;
    bottom: 3px;
    right: 8px;
    height: 40px;
    width: 40px;
  }
}

@media (max-width: 480px) {
  .service-more-button2 {
    font-size: 16px;
    line-height: 30x;
    bottom: 3px;
    right: 51%; 
    height: 30px;
    width: 30px;
  }
  
  .service-more-button3 {
    font-size: 16px;
    line-height: 30px;
    bottom: 3px;
    right: 8px;
    height: 30px;
    width: 30px;
  }
}



/* 野上CSS対応 */
.home-news-container{
  display: flex;
}

.home-news{
  display: flex;
  flex-shrink: 1 ;
  flex-direction: column;
  justify-content: space-between;
}

.news button{
  width: 200px;
  background-color: #FFF;
  margin: auto 0 10% 0;
}

.home-news .title{
  width: 53%;
  margin-top: 3%;
}

.home-business-contents-text{
  width: 15%;
}

.home-business-contents{
  display: flex;
  justify-content: center;
  margin: 5% 10% 3% 10%;
}

.home-business-contents a{
  display: flex;
}

.home-business-contents-1 {
  justify-content: start;
}

.home-business-contents-2 {
  justify-content: center;
}

.home-business-contents-3 {
  justify-content: end;
}

.home-business-contents-consultant{
  width: 75%;
}

.home-others-contents{
  display: flex;
  justify-content: center;
}

.big1{
  transition: 1s;
}

.big1:hover{
  transform: perspective(200px)translateZ(30px);
  transition: 1s;
}

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

.access-content-address{
  display: flex;
}


.servise-title-80 {
  width: 80%;
}
.servise-title-9 {
  width: 9%;
}
.servise-title-40 {
  width: 40%;
}
.servise-title-50 {
  width: 50%;
}
.servise-title-30 {
  width: 30%;
}
.servise-title-12 {
  width: 12%;
}
.servise-title-10 {
  width: 10%;
}
.servise-title-65 {
  width: 65%;
}
.servise-title-45 {
  width: 45%;
}
.servise-title-29 {
  width: 29%;
}
.servise-title-8 {
  width: 8%;
}
.servise-title-70 {
  width: 70%;
}

@media (max-width: 768px) {
  .servise-title-80 {
    width: 100%;
  }
  .servise-title-9 {
    width: 15%;
  }
  .servise-title-40 {
    width: 28%;
  }
  .servise-title-50 {
    width: 33%;
  }
  .servise-title-20 {
    width: 28%;
  }
  .servise-title-30 {
    width: 20%;
  }
  .servise-title-12 {
    width: 25%;
  }
  .servise-title-10 {
    width: 20%;
  }
  .servise-title-65 {
    width: 43%;
  }
  .servise-title-45 {
    width: 31%;
  }
  .servise-title-29 {
    width: 20%;
  }
  .servise-title-8 {
    width: 11%;
  }
  .servise-title-70 {
    width: 90%;
  }
}
@media screen and (max-width: 768px) {
  .service-modal-content {
    width: 90%; /* モーダルの幅を広げる */
    margin: 10% auto; /* 上下の余白を調整 */
    padding: 15px; /* パディングを調整 */
    font-size: 14px; /* 必要ならフォントサイズも調整 */
  }
}

@media (max-width: 768px) {
  .logo_wrap{
    width: 50% !important;
    margin: 0 !important;
  }

  #header_logo .mobile_logo_image{
    width: 100% !important;
    height: auto !important;
  }

  .home-news-container{
    display: block !important;
  }

  .home-news{
    display: block !important;
  }

  .news{
    margin-bottom: 25% !important;
  }

  .news button{
    width: 140px !important;
    background-color: #FFF !important;
    margin: auto 0 10% 0 !important;
    position: relative;
    top: 76vh;
  }

  .home-news .title{
    width: 53% !important;
    margin-top: 3% !important;
    margin-bottom: 0 !important;
  }

  .home-business-contents{
    display: flex !important;
    flex-direction: column !important;
    align-items: end !important;
  }

  .home-business-contents-text{
    width: 40%;
  }

  .home-business-contents-consultant{
    width: 65%;
    margin-left: 7%;
  }

  .home-others-contents{
    display: flex !important;
    flex-direction: column !important;
    align-items: end !important;
  }

  .company-information {
    position: relative !important;
    bottom: 0vw !important;
    left: 0 !important;
  }

  .c-astsoil {
    margin: 3% 10% !important;
    width: auto !important;
    text-align: left !important;
    padding: 0.25rem 0.5rem !important
  }

  .foot-Text-Content {
  margin: 0 5% !important;
  }

  /* .foot-Recruit-Menu ul li a{
  font-size: 10px !important;
  } */

  .about-display{
    flex-direction: column !important;
  }

  .turn2{
    margin-left: 60% !important;
  }

  .outline td:nth-of-type(2) {
    padding: 0 0.25rem;
  }

  .soshiki{
    width: 100%;
  }

  .history{
    font-size: 10pt;
  }

  .history th{
    font-size: 10pt;
  }

  .history .left-td{
    text-align: left;
  }
  .history td:nth-of-type(3){
    min-width: 65px;
    text-align: center;
  }
  
  .history .write{
    line-height: 25px;
  }
  .fluffy-width{
    width: 20%;
    top: 24%;
  }
  
  .fluffy-width1{
    width: 25%;
    top: 14%;
  }

  .fluffy-width2{
    top: 62%;
  }

  .keyframe-content{
    position: relative;
    bottom: 150vh;
  }

  .merger{
    padding: 15px 30px !important
  }
  .moves{
    margin: 20vh auto 0 auto;
    position: relative;
    top: 0;
    left: 0;
    width: 60%;
    height: 20%;
  }
  .qualification{
    font-size: 10pt;
    width: 100%;
    margin: 5% 0;
  }
  .qualification th{
    width: 50%;
  }
  .qualification td{
    width: 50%;
    line-height: 1.5;
    padding: 0 0 0.5rem 0.5rem;
    border-left: solid 2px #dee2e6;
  }

  .keyframe-height{
    height: 25vh;
  }

  .light{
    bottom: 0;
    width: 26%;
    margin-left: 15%;
  }

  .congra{
    bottom: 4vh;
    width: 20%;
    margin-left: 20%;
  }

  .access-content{
    width: 100%;
  }

  .access-content-address{
    display: block;
  }

  .affiliate-content-top{
    display: flex;
    flex-direction: column !important;
  }

  .affiliate{
    margin: 5% 0 0 0;
    width: 100%;
  }


}

/* 野上CSS対応ここまで */


/* 髙橋CSS対応ここから */
.investigation{
  display: flex;
}

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

.position{
  display: flex;
}

.surveying_2{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
  
.surveying_pic{
  width: 48%;
}

.consul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch; /* 子要素の高さを揃える */
  gap: 2%; /* ボックス間の隙間を追加 */
}

@media (max-width: 768px) {

  .investigation{
    display: block;
  }

  .item-1{
    width: 100%;
  }

  .material{
    display: block;
  }

  .item-2{
    width: 100%;
  }

  .position{
    display: block;
  }

  .surveying_2{
    display: block;
  }

  .surveying_pic{
    width: 100%;
    margin-bottom: 3%;
  }

  .consul{
    display:block;
  }

  .item-3{
    width: 100%;
  }
  .nav .nav-tabs{
    width: 100%;
  }
  .nav-item{
    width: 15%;
    white-space: nowrap;
    font-size: small;
  }
}
@media (max-width: 480px) {
  .nav-item {
    width: 24%;
    white-space: nowrap;
    font-size: 0.6rem;
    margin-left: -5%;
}
}

/* 髙橋CSS対応ここまで */

/*ここからworks(山内)*/
.yamauchiFlex{
  display:flex;
  background-color:blue;
  justify-content: flex-end;
  align-items: flex-end;
  margin: 50px;
  padding: 50px;
}

.yamauchiTest{
  display:inline-flex;
  color:red;
  margin: 10px;
}

.yamauchiFlex2{
  display:flex;
  background-color:red;
  justify-content: center;
  align-items:center;
  margin: 50px;
  padding: 50px;
}

.yamauchiTest2{
  display:flex;
  color:blue;
  margin: 15px;
}

.yamauchi_th{
  width: 15%;
}

.yamauchiImg{
  display: flex;
  flex-flow:column;
  row-gap:100px;
}

.yamauchiWidelink{
  padding: 0;
	height: 0;
}

.yamauchiWidelink a{
  display: block; 
  width: 100%; 
  height: 100%;
}

/* 山内採用情報 */

.recruit-margin h1{
  margin-bottom: 1%;
}

.recruit-entry {
  position: fixed;
  display: flex;
  justify-content: center;
  width: 100%;
  top: 86%;
  z-index: 5;
  opacity: 0; /* 初期状態では非表示 (透明) */
  transition: opacity 0.5s ease-in-out; /* スムーズに表示/非表示 */
  object-fit: contain;
  max-width: 100%;
  height: auto;
  white-space: nowrap;
}

.entry-left img{
  margin-right: 2%;
  object-fit: contain;
  max-width: 95%;
  height: auto;
}
.entry-right img{
  margin-left: 5%;
  object-fit: contain;
  max-width: 95%;
  height: auto;
}

.recruit-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/team.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
  background-position: -70px -30px;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
  font-weight: bold;
}

.font-none {
  /* font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; */
  /* font-family: inherit; */
  font-family: "Kosugi Maru", sans-serif;
}

.recruit-small-dot {
  letter-spacing: -0.2em;
}

/* .Recruitment-Section {
  padding: 40px 20px;
} */

.Recruitment-Section {
  padding: 0px 20px 20px 20px;
  position: fixed;
  top: 23px;
  right: 3px;
  background-color: #FFF;
  /* padding-bottom: 28px; */
  z-index: 9999999;
  /* width: 100%; */
  /* height: 34px; */
}
.Recruitment-Section-interview {
  padding: 4px 20px 13px 20px;
  position: fixed;
  top: -2px;
  right: 0px;
  background-color: #FFF;
  /* padding-bottom: 28px; */
  z-index: 9999999;
  /* width: 100%; */
  /* height: 34px; */
}

.Recruitment-Section.scrolled {
  width: 100%;
  height: 88px;
  top: 0px;
  left: -3px;
  /* right: 78px; */
  padding-top: 25px;
}

.Recruitment-Section2 {
  padding: 0px 20px 20px 20px;
  position: fixed;
  top: 0px;
  right: 0px;
  background-color: #FFF;
  /* padding-bottom: 28px; */
  z-index: 9999999;
  width: 101%;
  height: 34px;
}

/* 固定ヘッダーの高さ分だけ余白を追加 */
#recruit-works, #recruit_12, #recruit-numbers, #chishitsu, #consultant, #in-situ-test, #construction, #access {
  scroll-margin-top: 100px;
}

#recruit-point5 {
  scroll-margin-top: 110px;
}

.Recruitment-Section .Recruit-Menu{
  font-weight: normal !important;
}

.Recruitment-Section2 .Recruit-Menu{
  font-weight: normal !important;
}

.Content-Container {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: flex-end; /* 全てを右端に寄せる */
  margin-left: 100%;
}

.Text-Content {
  display: flex;
  align-items: flex-end; 
  justify-content: flex-end;
  width: 100%;
}

.Recruit-Menu{
  width: 100%;
}

.Recruit-Menu ul {
  list-style: none;
  width: 100%;
  padding: 0;
  margin-top: 10px;
  display: flex;
  gap: 25px; /* リンク間にスペース */
  justify-content: flex-end; /* リンクを右揃えにする */
}

.Recruit-Menu ul li a {
  text-decoration: none;
  font-size: 16px;
  color: #000;
  white-space: nowrap; /* リンクの改行を防ぐ */
  padding: 50% 0; 
}

.Recruit-Menu ul li a:hover {
  text-decoration: underline;
}

.recruit-bottom-wrap {
  margin-left: 3%;
  margin-right: 3%;
}

@media (max-width: 768px) {
  .Text-Content {
      flex-direction: column;
      align-items: center;
  }

  /* .Recruit-Menu ul {
      justify-content: center;
  } */
}

.Recruit-Img {
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
  height: 40vw;
  object-fit: contain;
  margin-left: 18%;
  margin-right: 3%;
  margin-top: 100px;
}


.Recruit-Img img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  width:100%;
}

.Recruit-Img .ast_rec{
  width: 50%;
}


.Recruit-Img .manga1{
  position:relative;
  background-image: url("img/recruit_coma1.png");
  background-repeat: no-repeat;
  background-size: 100%;
  top: 0;
  left: 0;
  width: 37vw;
  height: 14.5vw;
}

.Recruit-Img .manga1:hover {
  background-image: url("img/recruit_coma1_c.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.Recruit-Img .manga2{
  position:relative;
  background-image: url("img/recruit_coma2.png");
  background-repeat: no-repeat;
  background-size: 100%;
  top: 0.5vw;
  left: 0;
  width: 41vw;
  height: 22.3vw;
}

.Recruit-Img .manga2:hover {
  background-image: url("img/recruit_coma2_c.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.Recruit-Img .manga3{
  position:relative;
  background-image: url("img/recruit_coma3.png");
  background-repeat: no-repeat;
  background-size: 100%;
  top: -36.8vw;
  left: 45%;
  width: 41vw;
  height: 21.5vw;
}

.Recruit-Img .manga4{
  position:relative;
  background-image: url("img/recruit_coma4.png");
  background-repeat: no-repeat;
  background-size: 100%;
  top: -35.7vw;
  left: 50%;
  width: 37vw;
  height: 15.5vw;
}

.Recruit-Img .manga4:hover {
  background-image: url("img/recruit_coma4_c.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.Jinbutsu-Img {
  display: flex;
  padding-left: 10%;
  justify-content: flex-end;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-left: 10%;
  box-sizing: border-box;
}

.Image-Wrapper {
  flex: 1; /* 各画像が均等なスペースを占める */
  padding: 0 10px; /* 画像間のスペース */
  box-sizing: border-box;
}

.Jinbutsu-Img img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}


.recruit-title{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
  margin-left: 18%;
  margin-right: 3%;
}

.recruit-title-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  width: 99%;
}

.recruit-title-main {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}


.recruit-title-main-h1 div {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}


.recruit-title-T {
  display: flex;
  /* justify-content: center; */
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
  font-size: 150%;
  margin-bottom: 1%;
  padding-left: 1rem;
}

.recruit-title-Title {
  display: flex;
  /* justify-content: center; */
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
  font-size: 150%;
  margin-bottom: 2%;
}

.recruit-title-T-text {
  display: flex;
  gap: 2%;
  width: 100%;
  /* justify-content: center; */
}

.recruit-title-T-text p {
  font-size: 20px;
}

.recruit-title-C-text p {
  font-size: 20px;
}

.recruit-title-B-text p {
  font-size: 20px;
}

.recruit-title-T-text div {
  width: 40%;
}

.recruit-title-C-text div {
  width: 40%;
}

.recruit-title-B-text div {
  width: 40%;
}

.index-border {
  border-bottom: 1px solid #000;
}

.index-margin {
  margin-left: 3%;
}

.recruit-title-Title-text {
  display: flex;
  gap: 2%;
  width: 100%;
  /* justify-content: center; */
}

.recruit-title-Title-text p {
  font-size: 33px;
  font-weight: bold;
}


.recruit-title-C {
  display: flex;
  /* justify-content: center; */
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
  font-size: 150%;
  margin-bottom: 1%;
  padding-left: 1rem;
}

.recruit-title-C-text {
  display: flex;
  gap: 2%;
  width: 100%;
  /* justify-content: center; */
}

/* .recruit-title-C-text p {
  border-bottom: 2px solid #000;
} */

.recruit-title-B {
  display: flex;
  /* justify-content: center; */
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
  font-size: 150%;
  margin-bottom: 1%;
  padding-left: 1rem;
}

.recruit-title-B-text {
  display: flex;
  gap: 2%;
  width: 100%;
  /* justify-content: center; */
}

/* .recruit-title-B-text p {
  border-bottom: 2px solid #000;
} */

.recruit-consultant-detail{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.recruit-consultant-detail-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.recruit-position{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2cqh;
}

.recruit-position img{
  max-width: 100%;
  width: 92%;
  height:auto;
  object-fit: contain;
  margin-top: 3%;
  margin-bottom: 10%;
}

.new-recruit-img {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-bottom: 3%;
}

.new-recruit-img-image{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/*下の四枚の画像の配置が終わったら以下二つは消す*/
.recruit-position-test{
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2cqh;
}

.recruit-position-test img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 3%;
  margin-bottom: 10%;
}
/* ここまで消す*/


/*四枚の画像の配置関係*/
.New-Recruit-Body{
  margin-top: 12%;
  margin-bottom: 25%;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative; 
}

.New-Recruit-Img {
  position: relative;
  width: 800px;
  height: 600px;
}

.New-Recruit-Img img{
  position: absolute;
  display: block;
  max-width: 100%; /* アスペクト比を保持しつつ画像を調整 */
  max-height: 100%;
}

.red {
  bottom: 90%;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: auto;
}

.green {
  top: 60%;
  right: 13%;
  transform: translateX(-50%);
  width: auto;
  height: auto;
  border: 1px solid black;
  transform: scale(2.3);
}

.yellow {
  top: 125%;
  /* left: 50%; */
  transform: translateX(-50%);
  width: auto;
  height: auto;
  transform: scale(0.95)
}

.Recruit-rectangle {
  color: #fff;
  height: 34rem;
  font-size: 14px;
  background-color: #F3C73D;
  /* padding: 20px; */
  float: right;
  position: relative;
  top: 35rem;
  left: 31.5rem;
  width: 67.9rem;
  opacity: 0.5;
}

.blue {
  top: 173%;
  left: 108%;
  width: auto;
  height: auto;
  /* opacity: 0.5; */
  transform: scale(1.75);
}

.blue-text {
  position: absolute;
  top: 330px;  /* 青の画像内に文字を配置 */
  left: 65%;
  color: white;
  font-size: 18px;
}

.blue-text a {
  text-decoration: none;
  color: white;
}

.black {
  top: 30%;
  left: 165%;
  width: auto;
  height: auto;
  transform: scale(2);
}

.Midway-Recruit-Img{
  display: flex;
  align-items: center;
  margin: 5% 10%;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  flex-wrap: nowrap;
}

.Midway-Recruit-Img-Item img{
max-width: 100%;
height: auto;
object-fit: contain;
}
/*ここまで配置関係*/


.work-about {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-bottom: 3%;
}

.work-about-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.work-about-top4 {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}

.work-about-top4-image {
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
}

.work-about-top4-image div {
  /* 各画像を包む要素にマージンやその他のスタイルを指定する場合 */
}

.work-about-top4-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.work-about-bottom3{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
}

.work-about-bottom3-image {
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
}

.work-about-bottom3-image div {
  /* 各画像を包む要素にマージンやその他のスタイルを指定する場合 */
}

.work-about-bottom3-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
}

.Senior{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 4%;
  margin-bottom: 2%;
}

.senior-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
}


.Senior-Massage-bottom{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
}

.Senior-Massage-bottom-image{
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  max-width: 1300px;
  justify-content: center;
  margin-bottom: 2%;
}

.Senior-Massage-bottom-image div {
  /* 各画像を包む要素にマージンやその他のスタイルを指定する場合 */
}

.Senior-Massage-bottom-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
}
@media (max-width: 768px) {
  .Senior-Massage-bottom {
    flex-direction: column; /* モバイルサイズでは縦に並べる */
    justify-content: center;
  }
  
  .Senior-Massage-bottom-image{
    flex-direction: column;
    justify-content: center;
  }

  .Senior-Massage-bottom-image div {
    flex-direction: column;
    justify-content: center;
  }
}

.astsoil-in-numbers{
  display: block;
  max-width: 1300px;
  height:auto;
  object-fit:contain;
  margin-top: 4%;
  margin-left: auto;
  margin-right: auto;
}

.astsoil-in-numbers-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  /* width: 90%; */
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.easy-work {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

.easy-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.easy-work-numbers {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
}





/* 
.easy-work-numbers-circle-image {
  text-align: center;
  margin: 20px auto;
} */



.easy-work-numbers-image {
  text-align: center;
  position: relative;
}






/* アニメーション */


/* 採用情報topの人物 */

.jinbutsu-anime1, .jinbutsu-anime2, .jinbutsu-anime3, .jinbutsu-anime4 {
  overflow: hidden;
  position: relative;
  display: flex;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

.jinbutsu-anime1 img, .jinbutsu-anime2 img, .jinbutsu-anime3 img, .jinbutsu-anime4 img {
  opacity: 0; /* 初期状態で透明 */
  visibility: hidden; /* 初期状態で非表示 */
  transform: translateY(100%); /* 下から */
}

.jinbutsu-anime1.animated img, .jinbutsu-anime2.animated img, .jinbutsu-anime3.animated img, .jinbutsu-anime4.animated img {
  visibility: visible; /* アニメーション開始時に表示 */
  animation: slideAndShake 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards; /* アニメーション終了後も状態を保持 */
  opacity: 1; /* アニメーション中に表示 */
}

.jinbutsu-anime1.animated img {
  animation-delay: 0s; /* 遅延なし */
}

.jinbutsu-anime2.animated img {
  animation-delay: 0.5s; /* 0.5秒遅延 */
}

.jinbutsu-anime3.animated img {
  animation-delay: 1s; /* 1秒遅延 */
}

.jinbutsu-anime4.animated img {
  animation-delay: 1.5s; /* 1.5秒遅延 */
}

/* 下から上にスライドしながらピコピコ揺れるアニメーション */
@keyframes slideAndShake {
  0% {
    transform: translateY(100%) rotate(0deg); /* 下から登場 */
    opacity: 0; /* 完全に非表示 */
  }
  10% {
    opacity: 1; /* 10%地点で表示開始 */
    transform: translateY(80%) rotate(0deg); /* 少し上に移動 */
  }
  25% {
    transform: translateY(40%) rotate(0deg); /* スムーズに上へ */
  }
  50% {
    transform: translateY(0%) rotate(0deg); /* 中間地点 (0%) */
  }
  70% {
    transform: translateY(-20%) rotate(0deg); /* 上に少し超える */
  }
  85% {
    transform: translateY(-30%) rotate(0deg); /* 最大上昇点 */
  }
  100% {
    transform: translateY(0%) rotate(0deg); /* 最終的に元の位置に戻る */
  }
}















/* 働きやすさ */

.easy-works6 {
    max-width: 100%;
    height: auto;
    object-fit: contain;
    white-space: nowrap;
    /* margin-top: 4%;
    margin-bottom: 2%; */
    justify-content: center;
}

.easy-work-top-image{
  width: 100%;
  display:flex;
  justify-content: center;
}

.easy-work-top-image img {
  max-width: 100%;
  height: 350px;
  object-fit: contain;
  /* width: 35%; */
}

.easy-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}


.zangyou-text-1 {
  position: absolute;
  font-size: 300%;
  color: #000;
  top: -3%;
  left: 40%;
}
.zangyou-time {
  font-size: 200%;
  color: #F3C73E;
}
.zangyou-text-2 {
  position: absolute;
  font-size: 130%;
  color: white;
  top: 60%;
  left: 23%;
  text-align: center;
}
.zangyou-zenkoku {
  font-size: 150%;
}
.zangyou-kousei {
  font-size: 60%;
}


/* 配置関係 */
.chart-image-container {
  display: flex;
  justify-content: space-between;
  width: 100%;
  gap: 2.6%;
  box-sizing: border-box;
}

/* 画像の幅を固定して縮小しないように設定 */
.paid-holiday-image {
  flex: 0 0 33%; /* 画像の幅を固定して、33%のスペースを使用 */
  /* max-width: 100%; */
  height: auto; /* 縦横比を維持 */
  box-sizing: border-box;
}

/* 平均残業時間 */

.easy-works6-top-anime{
  display: flex;
  justify-content: center;
  max-width: 1300px;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  /* margin-top: 5%;
  margin-bottom: 2%; */
  width: 100%;
}

.easy-works6-top-anime-image {
  text-align: center;
  position: relative;
  width: 100%;
}

.anime-zangyou-header {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  font-size: 1.5rem; */
  position: absolute;
  top: 7%;
  left: 4%;
  background-image: url("img/average.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 150px;

}

.anime-chart-zangyou-wrapper {
  position: absolute;
  bottom: 1rem;
  left: 0;
  width: 100%;
  height: 70%;
  display: flex;
  justify-content: center;
  align-items: center;
}


/* 残業平均アニメ */
.anime-zangyou {
  width: 70%; /* グラフの幅を調整 */
  height: 300px;
  padding-top: calc(2 / 3 * 34%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}

.chart-image-container {
  display: flex;
  align-items: center;
  flex-direction: row; /* 横並びにするためにrowを指定 */
  gap: 30px; /* グラフと画像の間のスペース */
  justify-content: center;
}
/* .zangyou-bar-chart-canvas {
  display: block;
  width: 100% !important;
  height: 300px;
  flex-grow: 1; 
  height: 300px;
  box-sizing: border-box;
} */


/* 有給消化率 */
.overlay-text-paid-holiday {
  position: absolute;
  top: 51%; 
  left: 53%;
  transform: translate(-50%, -50%); /* 完全に中央寄せ */
  color: black;
  font-size: 38px;
  font-weight: bold;
  text-align: center;
}

/* 有給取得率の画像を右に配置 */
.image-container-paid-holiday {
  text-align: center;
  position: relative;
}

/* カウントアップする数字のスタイル */
#count-paid-holiday,
.count-unit-paid-holiday {
  font-size: 150%; /* 数字のサイズを大きく */
  color: #000; /* 色を指定 */
}


/* 二列目配置関係 */
.easy-work-off {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-bottom: 2%;
  justify-content: center;
}

.easy-work-off-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-bottom: 2%;
}

/* コンテナ全体のスタイル（横並びに配置） */
.image-container-recruit-wrapper2 {
  display: flex;             
  justify-content: space-between; 
  width: 100%;
}

/* 各画像のコンテナ */
.image-container-recruit2 {
  position: relative;
  display: inline-block;
  width: 32%;   /* 3つの画像を並べるために幅を調整 */
}


/* 年間休日 */
.overlay-text-recruit-off {
  position: absolute;
  color: black;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.off-day-num {
  font-size: 400%;
  color: #F3C73E;  
}

.off-days {
  color: #000 !important;
  font-size: 200%;
}
/* 年間休日のテキスト位置調整 */
.holiday-text-recruit2 {
  top: 40%;  
  left: 34%; 
  display: flex;
  align-items: center;
}


/* 産休取得率 */
.maternity-off {
  position: absolute;
  color: black;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.maternity-off-num {
  font-size: 250%;  /* フォントサイズを大きくする */
  color: #F3C73E;   /* 色を#F3C73Eに変更 */
}

.women-value {
  color: #000 !important;
  font-size: 200%;
}
.man-value {
  color: #000 !important;
  /* font-size: 200%; */
}

/* 産休取得率（女性）のテキスト位置調整 */
.maternity-women-text-recruit2 {
  top: 50%; 
  left: 6%;
}

/* 産休取得率（男性）のテキスト位置調整 */
.maternity-men-text-recruit2 {
  top: 50%; 
  left: 69%; 
}


/* 育児休業復職率 */
.return-off-num {
  font-size: 300%;
  color: #F3C73E;
}
.return-value{
  color: #000 !important;
  font-size: 1ch00%;
}

/* アイコンとテキストを重ねるためのスタイル */
.overlay-text-recruit2 {
  position: absolute;
  color: black;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

/* 数字と"日"や"%"両方に適用するフォントサイズと色 */
.overlay-text-recruit2 span,
.count-unit-recruit2 {
  font-size: 250%;  /* フォントサイズを大きくする */
  color: #F3C73E;   /* 色を#F3C73Eに変更 */
}

/* 育児休業復職率のテキスト位置調整 */
.return-work-text-recruit2 {
  top: 50%;  /* 縦位置の調整 */
  left: 55%; /* 横位置の調整 */
}







/* 働く人たち */



.anime-container {
  display: flex; /* 横並びに配置 */
  justify-content: space-between; /* 余白を均等にする */
  gap: 1.25rem; /* グラフ同士の間隔をrem指定 */
}

.anime-border {
  width: 45%; /* グラフの幅を少し狭める */
  padding-top: calc(2 / 3* 35%);
  border: 1rem solid black; /* 相対的なサイズでの枠線指定 */
  position: relative;
  box-sizing: border-box;
}

.anime-header-staff {
    /* position: absolute;
    top: 1rem;
    left: 3%;
    transform: translateX(-50%);
    font-size: 1.5rem;
    text-align: start; */
    position: absolute;
    top: 7%;
    left: 8%;
    background-image: url("img/staff.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 6vh;
    width: 150px;
}

.anime-header-generation {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  text-align: start; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/generation.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 150px;
}

.anime-header-join {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  text-align: start; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/join.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 200px;
}

.anime-header-commute {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  text-align: start; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/commute.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 100px;
}

.anime-header-way {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  text-align: start; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/way.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 100px;
}

.anime-header-school {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  transform: translateX(-50%);
  font-size: 1.5rem;
  text-align: start; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/school.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 100px;
}

.anime-chart-wrapper {
  position: absolute;
  bottom: 1rem; /* グラフを枠の下部に配置 */
  left: 0;
  width: 100%;
  height: 70%; /* グラフ部分の高さを調整 */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ドーナツ型グラフはデフォルトのサイズを維持 */
canvas {
  width: 100%;
  height: auto;
  display: block;
}

/* 棒グラフのみに適用するサイズ */
.bar-chart-canvas {
  width: 80%; /* 幅を80%に設定 */
  height: 250px; /* 高さを250pxに設定 */
  margin-top: 2vw;
}


.chart-center-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.chart-number {
  color: #F3C73E;
  font-size: 3rem; /* remで指定 */
}

.chart-label {
  color: black;
  font-size: 1.5rem; /* remで指定 */
}

.chart-left-text {
  position: absolute;
  top: 0rem; /* remに変更 */
  left: 8%; 
  color: #F3C73E;
  font-size: 1.35rem; /* remで指定 */
  text-align: left;
}

.chart-right-text {
  position: absolute;
  bottom: 0rem; /* remに変更 */
  right: 5%; 
  color: black;
  font-size: 1.35rem; /* remで指定 */
  text-align: right;
}


/* グラフ右上の黄色い円とその中のテキスト */
.chart-circle {
  position: absolute;
  top: -30.5%;
  right: 4.2%;
  width: 17%;
  height: 30%;
  background-color: #F3C73E;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}


.chart-circle-text {
  font-size: 1.2rem;
  color: black;
  font-weight: bold;
}

.chart-circle2 {
  position: absolute;
  top: -30.5%;
  right: 4.2%;
  width: 30%;
  height: 55%;
  background-color: #F3C73E;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.chart-circle3 {
  position: absolute;
  top: -30.5%;
  right: 10.2%;
  width: 34%;
  height: 54%;
  background-color: #F3C73E;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.tuukinn{
  font-size: 1rem;
}

.tuukinn2{
  font-size: 2rem;
}

.car-tuukinn{
  font-size: 1rem;
}



.tuukinn-text-t{
  position:absolute;
  top:6%;
  right:65%;
  display: flex;
}

.tuukinn-t{
  font-size: 68%;
  text-align: center;

}

.tuukinn-t-br{
  font-size: 200%;
}


.tuukinn-text-c{
  position:absolute;
  top:40%;
  right:68%;
  display: flex;
}

.tuukinn-c{
  font-size: 68%;
  text-align: center;

}

.tuukinn-c-br{
  font-size: 200%;
}



.tuukinn-text-b{
  position:absolute;
  top:70%;
  right:3%;
  display: flex;
  color: #F3C73E;
}

.tuukinn-b{
  font-size: 68%;
  text-align: center;

}

.tuukinn-b-br{
  font-size: 200%;
}

.horizontal-bar-chart-canvas{
  display: block;
  height: 100%;
  width: 75%;
  margin-right: 15%;
}

.second-row{
  margin-top: 1%;
}




.age20{
  position:absolute;
  top: 8%;
  right: 86.5%;
}
.age30{
  position:absolute;
  top:20%;
  right:67%;
}
.age40{
  position:absolute;
  top:-5%;
  right:47%;
}
.age50{
  position:absolute;
  top:0%;
  right:27%;
}
.age60{
  position:absolute;
  top:0%;
  right:7%;
}

.age-text{
  font-size: 100%;
}

.age-40text{
  font-size: 100%;
  color:#F3C73E;
}

.min15{
  position:absolute;
  top: 43%;
  right: 83.5%;
}
.min30{
  position:absolute;
  top:5%;
  right:63%;
}
.min45{
  position:absolute;
  top:49%;
  right:44.5%;
}
.min60{
  position:absolute;
  top:24%;
  right:25%;
  z-index: 1;
}
.min61{
  position:absolute;
  top:49%;
  right:6.5%;
}


.gakureki1{
  position:absolute;
  top:55%;
  right:83.5%;
}
.gakureki2{
  position:absolute;
  top:47%;
  right:58.5%;
}
.gakureki3{
  position:absolute;
  top:4%;
  right:32%;
}
.gakureki4{
  position:absolute;
  top:65%;
  right:8.5%;
}
 



.numbers-faculty-club{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}

.numbers-faculty-club-image {
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
}


.numbers-faculty-club-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}




/* 最終学部　クラブ */
.club-easy-work {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

.club-easy-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-bottom: 2%;
}




/* コンテナ全体のスタイル（横並びに配置） */
.image-container-recruit-wrapper {
  display: flex;               /* 横並びにするためにflexを使用 */
  justify-content: space-between;  /* 画像の間隔を調整 */
  width: 100%;   /* 横幅全体を使用 */
  margin-top: 1%;
  gap:1%;
}

/* 各画像のコンテナ */
.club-image-container-recruit {
  position: relative;
  display: inline-block;
}

/* アイコンとテキストを重ねるためのスタイル */
.overlay-text-recruit {
  position: absolute;
  color: black;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

/* 数字と"名"両方に適用するフォントサイズと色 */
.overlay-text-recruit span,
.count-unit-recruit {
  font-size: 250%;  /* フォントサイズを大きくする */
  color: #F3C73E;   /* 色を#F3C73Eに変更 */
}

/* 土木系のテキスト位置調整 */
.civil-text-recruit {
  top: 45%;  /* 縦位置の調整 */
  left: 60%;  /* 横位置の調整 */
}

/* 体育系のテキスト位置調整 */
.sports-text-recruit {
  top: 50%;  /* 縦位置の調整 */
  left: 12%; /* 横位置の調整 */
}

/* 文化系のテキスト位置調整 */
.culture-text-recruit {
  top: 50%;  /* 縦位置の調整 */
  left: 44%; /* 横位置の調整 */
}

/* していないのテキスト位置調整 */
.none-text-recruit {
  top: 50%;  /* 縦位置の調整 */
  left: 70%; /* 横位置の調整 */
}






/* 下のアニメ */

.anime-easy-work-numbers {
  display: flex;
  justify-content: center; /* 横方向に中央揃え */
  align-items: center; /* 縦方向に中央揃え */
  max-width: 100%;
  padding: 20px;
}

.anime-easy-work-numbers-wrapper {
  display: flex;
  align-items: center;
  flex-direction: row; /* 横並びにするためにrowを指定 */
  gap: 30px; /* グラフと画像の間のスペース */
}

.anime-easy-work-chart-border {
  width: 250px; /* グラフの幅を調整 */
  height: auto;
  padding-top: calc(2 / 3 * 35%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}

.anime-easy-work-header-country {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  font-size: 1.5rem; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/country.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 150px;
}


.anime-easy-work-chart-wrapper {
  position: absolute;
  bottom: 1rem;
  left: 0;
  width: 100%;
  height: 70%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ドーナツ型グラフ */
.anime-easy-work-chart-wrapper canvas {
  width: 100%;
  height: auto;
  display: block;
}

/* 画像ラッパー */
.anime-easy-work-image-wrapper {
  display: flex;
  flex-direction: row; /* 画像を横に並べる */
  justify-content: center;
  align-items: center;
  gap: 20px; /* 画像間のスペース */
  max-width: 1309px;
  max-height: 300px;
}

/* .anime-easy-work-img {
  width: 200px;
  height: auto;
  object-fit: contain;
} */


.anime-easy-work-img {
  width: 29%; 
  height: auto;
  object-fit: contain;

}

.chart-left-text-kengai {
  position: absolute;
  top: 4rem; /* remに変更 */
  left: 1.5rem; /* remに変更 */
  color: #000;
  font-size: 1.2rem; /* remで指定 */
  text-align: center;
}

.chart-right-text-oita {
  position: absolute;
  bottom: 3rem; /* remに変更 */
  right: 0.5rem; /* remに変更 */
  color: #000;
  font-size: 1.2rem; /* remで指定 */
  text-align: center;
}

/* .anime-easy-work-img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
} */

.anime-easy-work-numbers-wrapper-oita {
  display: flex;
  align-items: center;
  flex-direction: row; /* 横並びにするためにrowを指定 */
  gap: 6%; /* グラフと画像の間のスペース */
  justify-content: center;
}


.anime-easy-work-chart-border-oita {
  width: 30%; /* グラフの幅を調整 */
  height: auto;
  padding-top: calc(2 / 3 * 30%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}



/* ふきだし */

.hukidasi-img-wrap {
  /* overflow: hidden; */
  position: relative;
  display: flex;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

/* .hukidasi-img-wrap img {
  transform: translateX(-100%); /* 初期状態で画面外 */
  /* transition: transform 2s cubic-bezier(0.4, 0, 0.2, 1);
} */


/* .hukidasi-img-wrap.animated img {
  transform: translateX(0); /* スライドして表示 */
/* }  */ 

.hukidasi-title-border {
  border: 10px solid #000;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  max-width: 1310px;
  object-fit: contain;
}



.recruit-anime-scroll-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px; /* 画像の間隔 */
  max-width: 1200px;
  margin: 0 auto;
}

/* 共通スタイル：バラバラな配置 */
.recruit-anime-scroll-item {
  width: 100%;
  max-width: 500px; /* 画像の最大幅 */
  height: auto; /* 縦横比を維持 */
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.recruit-anime-scroll-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 左右に配置するクラス */
.left {
  align-self: flex-start;
}

.right {
  align-self: flex-end;
}

/* 中央に寄った左配置 */
.center-left {
  align-self: flex-start;
  margin-left: 15%; /* 少し中央寄りに配置 */
}

/* 中央に寄った右配置 */
.center-right {
  align-self: flex-end;
  margin-right: 15%; /* 少し中央寄りに配置 */
}

/* オフセットのランダムさを出す */
.small-offset {
  margin-top: 5px;
  margin-bottom: 7px;
}

.medium-offset {
  margin-top: 12px;
  margin-bottom: 15px;
}

.large-offset {
  margin-top: 20px;
  margin-bottom: 25px;
}

.small-offset2 {
  margin-top: 2px;
  margin-bottom: 3px;
}

.medium-offset2 {
  margin-top: 5px;
  margin-bottom: 6x;
}

.large-offset2 {
  margin-top: 8px;
  margin-bottom: 9px;
}

/* モバイル対応：画面幅が狭い場合は中央に配置 */
@media screen and (max-width: 768px) {
    .recruit-anime-scroll-item {
      max-width: 430px; /* 画面サイズに合わせた拡縮 */
      transform: none; /* 余計な中央配置を削除 */
    }
    .recruit-anime-scroll-item {
      width: 50%;
    }
  
    /* 左右配置を継続 */
    .left {
      align-self: flex-start;
      margin-left: 5%; /* 余白調整 */
    }
  
    .right {
      align-self: flex-end;
      margin-right: 5%; /* 余白調整 */
    }
  
    .center-left {
      align-self: flex-start;
      margin-left: 10%; /* PCと同じような配置 */
    }
  
    .center-right {
      align-self: flex-end;
      margin-right: 10%; /* PCと同じような配置 */
    }
  }


/* どんな人と働きたい？ */

.end-who-work {
  /* display: flex; */
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

.end-who-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.who-workers {
  max-width: 1300px;
  margin: 0 auto; /* 横方向に中央に配置 */
  /* text-align: center; */
  display: flex; /* フレックスボックスを使用 */
  justify-content: center; /* 中央揃え */
  align-items: center; /* 縦方向も中央揃え */
}

.anime-border-2 {
  width: 100%;
  height: 450px;
  padding-top: 0;
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
  margin: 0 auto;
}


.anime-header-who {
  /* position: relative;
  font-size: 1.5rem;
  margin-top: 2%;
  margin-left: 2%; 
  margin-bottom: 0; タイトル下の余白を削除
  padding-top: 0; 上部パディングを削除
  left:-31rem; */

  position: absolute;
  top: 7%;
  left: 3%;
  background-image: url("img/with.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 300px;
}


.anime-chart-wrapper-2 {
  position: absolute;
  top: 17%;
  left: 2%;
  width: 100%;
  display: flex;
  justify-content: center; /* 横方向に中央揃え */
  align-items: center; /* 縦方向に中央揃え */
}

.horizontal-bar-chart-canvas-2 {
  width: 90%;
  height: 300px; /* 高さを300pxに固定 */
}

.person-text-1, .person-text-2, .person-text-3, .person-text-4, .person-text-5 {
  position: absolute;
  font-size: 315%;
  /* 各テキストの位置調整 */
}











.end-easy-work {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
  justify-content: center;
}

.end-easy-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
  width: 35%;
}



/* 社員にアンケ―ト */

/* インドアアウトドア */
.indoor-outdoor {
  display: flex;
  flex-direction: row; /* 画像を横に並べる */
  justify-content: center;
  align-items: center;
  gap: 20px; /* 画像間のスペース */
  max-width: 1350px;
  max-height: 300px;
}

.indoor-outdoor-question {
  display: flex;
  justify-content: center; /* 横方向に中央揃え */
  align-items: center; /* 縦方向に中央揃え */
  max-width: 100%;
  margin-top: 3%;
  gap:0.3%;
}

.easy-indoor-numbers-image {
  text-align: center;
  position: relative;
  display: flex;
  gap:2%;
  justify-content: center;
}


.anime-header-2 {
  /* position: relative;
  font-size: 1.5rem;
  margin-top: 2%;
  margin-left: 2%; 
  margin-bottom: 0; タイトル下の余白を削除
  padding-top: 0; 上部パディングを削除 */
  position: absolute;
  top: 7%;
  left: 4%;
  background-image: url("img/healing.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 300px;
}
.anime-easy-work-numbers {
  display: flex;
  justify-content: center; /* 横方向に中央揃え */
  align-items: center; /* 縦方向に中央揃え */
  max-width: 100%;
  padding: 20px;
}

.anime-easy-work-numbers-wrapper {
  display: flex;
  align-items: center;
  flex-direction: row; 
  width: 33%;
}

.indoor-chart-border {
  width: 411px; /* グラフの幅を調整 */
  height: 100%;
  padding-top: calc(2 / 3 * 35%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}

.lunch-text-1, .lunch-text-2, .lunch-text-3, .lunch-text-4 {
  position: absolute;
  font-size: 150%;
}

.megane-text-1,.megane-text-2,.megane-text-3,.megane-text-4,.megane-text-5 {
  position: absolute;
  font-size: 150%; 
}

.anime-lunch-canvas,.anime-megane-canvas{
  width:30%;
  height: auto;
}


/* 住んでいる場所 */
.end-house-work {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  /* margin-top: 4%;
  margin-bottom: 2%; */
  justify-content: center;
}

.end-house-work-image {
  width: 100%;
  display:flex;
  justify-content: center;
}

.end-house-work-image img{
  max-width: 100%;
  height: 350px;
  object-fit: contain;
  /* width: 35%; */
}



.your-house {
  display: flex;
  justify-content: center;
  max-width: 1300px;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  /* margin-top: 5%;
  margin-bottom: 2%; */
  width: 100%;
}

.your-house-image {
  text-align: center;
  position: relative;
  width: 100%;
}

.anime-your-house-wrapper {
  display: flex;
  align-items: center;
  flex-direction: row; /* 横並びにするためにrowを指定 */
  gap: 30px; /* グラフと画像の間のスペース */
  justify-content: center;
}


.anime-your-house-chart-border {
  width: 70%; /* グラフの幅を調整 */
  height: 300px;
  background-image: url("img/oita.png");
  background-position: 72% 25%;
  background-repeat: no-repeat;
  background-size: 38%;
  padding-top: calc(2 / 3 * 34%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}

.house-text-1,.house-text-2,.house-text-3,.house-text-4,
.house-text-5,.house-text-6,.house-text-7 {
  position: absolute;
  font-size: 200%; 
}

.easy-house-numbers-image {
  text-align: center;
  position: relative;

}



/* ストレス解消方法 */

.end-stress-work {
  /* display: flex; */
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  /* margin-top: 4%;
  margin-bottom: 2%; */
  justify-content: center;
}

.end-stress-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.stress-break{
  margin-bottom: 2%;
  max-width: 1300px;
  margin: 0 auto; 
  /* text-align: center; */
  display: flex;
  justify-content: center; 
  align-items: center; 
}

.person-text-8, .person-text-9, .person-text-10, .person-text-11, .person-text-12, .person-text-13, .person-text-14 {
  position: absolute;
  font-size: 280%;
 /* 各テキストの位置調整 */
}





/* サッカー桃太郎 */
.soccer-image {
  width: 50%;
}
.end-soccer-peach-easy-work {
  display: flex;
  max-width: 1274px;
  height: auto;
  white-space: nowrap;
  margin-top: 1%;
  margin-bottom: 2%;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}

.end-soccer-peach-easy-work-image {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 2%
}



.soccer-peach {
  display: flex;
  justify-content: center;
  max-width: 1300px;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  gap:1%;
  width: 100%;
}
 
.soccer-peach-image {
  text-align: center;
  position: relative;
}


.soccer-border {
  width: 49%;
  padding-top: 0;
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
  margin: 0 auto;
}

.peach-border {
  width: 49%;
  padding-top: 0;
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
  margin: 0 auto;
}

.soccer-chart-wrapper-2 {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center; 
  align-items: center; 
}



.soccer-text-1,.soccer-text-2 {
  position: absolute;
  font-size: 150%; 
}

.soccer-text-1 {
  position: absolute;
  font-size: 120%; 
  top:40%; 
  left:4%;
}
.soccer-text-2 {
  position: absolute;
  font-size: 200%; 
  color: #F3C73E;
  top:4%; 
  left:16%;

}
.soccer-text-3 {
  position: absolute;
  font-size: 120%; 
  top:33%; 
  left:29%;
}
.soccer-text-4 {
  position: absolute;
  font-size: 120%; 
  top:50%; 
  left:41.5%;
}
.soccer-text-5 {
  position: absolute;
  font-size: 120%; 
  top:67%; 
  left:53.5%;
}
.soccer-text-6 {
  position: absolute;
  font-size: 120%; 
  top:75%; 
  left:66.5%;
}
.soccer-text-7 {
  position: absolute;
  font-size: 120%; 
  top:50%; 
  left:79%;
}
.soccer-text-8 {
  position: absolute;
  font-size: 120%; 
  top:50%; 
  left:91.5%;
}

@media (max-width: 1165px) {
  .soccer-text-1 {
    position: absolute;
    font-size: 120%; 
    top:37%; 
    left:3%;
  }
  .soccer-text-2 {
    position: absolute;
    font-size: 200%; 
    color: #F3C73E;
    top:3%; 
    left:13%;
  
  }
  .soccer-text-3 {
    position: absolute;
    font-size: 120%; 
    top:30%; 
    left:28%;
  }
  .soccer-text-4 {
    position: absolute;
    font-size: 120%; 
    top:45%; 
    left:40.5%;
  }
  .soccer-text-5 {
    position: absolute;
    font-size: 120%; 
    top:60%; 
    left:52.5%;
  }
  .soccer-text-6 {
    position: absolute;
    font-size: 120%; 
    top:66%; 
    left:64.5%;
  }
  .soccer-text-7 {
    position: absolute;
    font-size: 120%; 
    top:45%; 
    left:77.5%;
  }
  .soccer-text-8 {
    position: absolute;
    font-size: 120%; 
    top:45%; 
    left:89.5%;
  }
}




.peach-text-1 {
  position: absolute;
  font-size: 120%; 
  top: 47%;
  left: 5%;
}
.peach-text-2 {
  position: absolute;
  font-size: 230%; 
  color: #F3C73E;
  top: 10%;
  left: 18%;
}
.peach-text-3 {
  position: absolute;
  font-size: 120%; 
  top: 47%;
  left: 33%;
}
.peach-text-4 {
  position: absolute;
  font-size: 120%; 
  top: 39%;
  left: 47.5%;
}
.peach-text-5 {
  position: absolute;
  font-size: 120%; 
  top: 66%;
  left: 61.5%;
}
.peach-text-6 {
  position: absolute;
  font-size: 120%; 
  top: 47%;
  left: 76%;
}
.peach-text-7 {
  position: absolute;
  font-size: 120%; 
  top: 23%;
  left: 90%;
}

@media (max-width: 1243px) {
  .peach-text-1 {
    position: absolute;
    font-size: 120%; 
    top: 42%;
    left: 4%;
  }
  .peach-text-2 {
    position: absolute;
    font-size: 180%; 
    color: #F3C73E;
    top: 7%;
    left: 17%;
  }
  .peach-text-3 {
    position: absolute;
    font-size: 120%; 
    top: 42%;
    left: 31%;
  }
  .peach-text-4 {
    position: absolute;
    font-size: 120%; 
    top: 35%;
    left: 46%;
  }
  .peach-text-5 {
    position: absolute;
    font-size: 120%; 
    top: 57%;
    left: 60%;
  }
  .peach-text-6 {
    position: absolute;
    font-size: 120%; 
    top: 43%;
    left: 74%;
  }
  .peach-text-7 {
    position: absolute;
    font-size: 120%; 
    top: 21%;
    left: 89%;
  }
}


.anime-easy-work-chart-border {
  width: 550px; /* グラフの幅を調整 */
  height: auto;
  padding-top: calc(2 / 3 * 35%);
  border: 1rem solid black;
  position: relative;
  box-sizing: border-box;
}

.anime-easy-work-header-lunch {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  font-size: 1.5rem; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/lunch-time.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 50%;
}


.indoor-chart-border .lunch-image{
  position: absolute;
  top: 20%;
  left: 70%;
  width: 20%;
}

.indoor-chart-border .glasses-image{
  position: absolute;
  top: 23%;
  left: 62%;
  width: 30%;
}


.anime-easy-work-header-glesses {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  font-size: 1.5rem; */
  position: absolute;
  top: 7%;
  left: 8%;
  background-image: url("img/eye.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 6vh;
  width: 65%;
}

.anime-easy-work-header-live {
  /* position: absolute;
  top: 1rem;
  left: 3%;
  font-size: 1.5rem; */
  position: absolute;
  top: 7%;
  left: 4%;
  background-image: url("img/live.png");
  background-repeat: no-repeat;
  background-size: contain;
  height: 3vh;
  width: 65%;
}

.anime-easy-work-chart-wrapper {
  position: absolute;
  bottom: 0.5rem;
  left: 0;
  width: 100%;
  height: 70%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ドーナツ型グラフ */
.anime-easy-work-chart-wrapper canvas {
  width: 100%;
  height: auto;
  display: block;
}
.person-text-1 {
  font-size: 424%;
  color: #F3C73E;
  top: -3%;
  left: 82%;
}
.person-text-2 {
  top:20%;
  left:46%;
}
.person-text-3 {
  top:39%;
  left:80%
}
.person-text-4 {
  top:58%;
  left:35.5%;
}
.person-text-5 {
  top:76%;
  left:53%;
}
/* アニメーションレスポンシブ調整 */

@media (max-width: 1350px){
  .age20 {
    top: 8%;
    right: 83.5%;
  }
  .age30 {
    top: 27%;
    right: 64%;
  }
  .age40 {
    top: -2%;
    right: 44%;
  }
  .age50 {
    top: 6%;
    right: 25%;
  }
  .age60 {
    top: 0%;
    right: 4%;
  }
  .min15{
    position:absolute;
    top: 39% !important;
    right: 81.5% !important;
  }
  .min30{
    position:absolute;
    top:2% !important;
    right:61% !important;
  }
  .min45{
    position:absolute;
    top:43% !important;
    right:43.5% !important;
  }
  .min60{
    position:absolute;
    top:21% !important;
    right:24.5% !important;
    z-index: 1;
  }
  .min61{
    position:absolute;
    top:43% !important;
    right:5.5% !important;
  }
}



@media (max-width: 1200px) {
  .zangyou-text-1 {
    position: absolute;
    font-size: 200%;
    color: #000;
    top: 5%;
    left: 40%;
  }
  .zangyou-time {
    font-size: 200%;
    color: #F3C73E;
  }
  .zangyou-text-2 {
    position: absolute;
    font-size: 100%;
    color: white;
    top: 62%;
    left: 5%;
    text-align: center;
  }
  .overlay-text-paid-holiday {
    position: absolute;
    top: 51%; 
    left: 53%;
    transform: translate(-50%, -50%); /* 完全に中央寄せ */
    color: black;
    font-size: 28px !important;
    font-weight: bold;
    text-align: center;
  }
  .off-day-num {
    font-size: 300% !important;
    color: #F3C73E;
  }
  .maternity-women-text-recruit2 {
    top: 50%; 
    left: 6%;
    font-size: 100% !important;
  }
  .maternity-men-text-recruit2 {
    top: 50%; 
    left: 69%; 
    font-size: 100% !important;
  }
  .return-work-text-recruit2 {
    top: 50%;
    left: 55%;
    font-size: 100% !important;
  }
  .chart-left-text {
    font-size: 70% !important;
    top: 8% !important;
  }
  .chart-right-text {
    font-size: 70% !important;
  }
  .min15{
    position:absolute;
    top: 39% !important;
    right: 81.5% !important;
  }
  .min30{
    position:absolute;
    top:2% !important;
    right:61% !important;
  }
  .min45{
    position:absolute;
    top:43% !important;
    right:43.5% !important;
  }
  .min60{
    position:absolute;
    top:21% !important;
    right:24.5% !important;
    z-index: 1;
  }
  .min61{
    position:absolute;
    top:43% !important;
    right:5.5% !important;
  }
  .chart-left-text-kengai {
    top: 27% !important;
    left: 1%  !important;
    font-size: 70% !important;
  }
  .chart-right-text-oita {
    bottom: 0% !important;
    font-size: 70% !important;
  }
}


@media (max-width: 1150px){
  .megane-text-1{
    font-size: 130% !important;
    top: -14% !important;
    left: 8% !important;
  }
  .megane-text-2{
    font-size: 130% !important;
    top: 11% !important;
    left: 28% !important;
  }
  .megane-text-3{
    font-size: 130% !important;
    top: 11% !important;
    left: 47% !important;
  }
  .megane-text-4{
    font-size: 130% !important;
    top: 29% !important;
    left: 66.5% !important;
  }
  .megane-text-5{
    font-size: 130% !important;
    top: 31% !important;
    left: 86.5% !important;
  }
}


@media (max-width: 1102px) {
  .lunch-text-1 {
    top: -12% !important;
    left: 13% !important;
  }
  .lunch-text-2 {
    top: 34% !important;
    left: 38% !important;
  }
  .lunch-text-3 {
    top: 42% !important;
    left: 61% !important;
  }
  .lunch-text-4 {
    top: 37% !important;
    left: 83.5% !important;
  }
}









@media (max-width: 1047px) {
  .min15{
    position:absolute;
    top: 30% !important;
    right: 78.5% !important;
    font-size: 70% !important;
  }
  .min30{
    position:absolute;
    top:3% !important;
    right:59% !important;
    font-size: 70% !important;
  }
  .min45{
    position:absolute;
    top:34% !important;
    right:41.5% !important;
    font-size: 70% !important;
  }
  .min60{
    position:absolute;
    top:18% !important;
    right:24.5% !important;
    z-index: 1;
    font-size: 70% !important;
  }
  .min61{
    position:absolute;
    top:35% !important;
    right:6% !important;
    font-size: 70% !important;
  }
  .chart-circle2 {
    width: 25% !important;
    height: 46% !important;
  }
  .tuukinn2 {
    font-size: 1.5rem !important;
  } 
}


@media (max-width: 1020px) {
  .megane-text-1{
    font-size: 130% !important;
    top: -7% !important;
    left: 9% !important;
  }
  .megane-text-4{
    font-size: 130% !important;
    top: 26% !important;
    left: 66.5% !important;
  }
  .megane-text-5{
    font-size: 130% !important;
    top: 29% !important;
    left: 86.5% !important;
  }
}


@media (max-width: 1006px) {
  .gakureki1{
    position:absolute;
    top:32% !important;
    right:81.5% !important;
  }
  .gakureki2{
    position:absolute;
    top:29% !important;
    right:57.5% !important;
  }
  .gakureki3{
    position:absolute;
    top:4% !important;
    right:31% !important;
  }
  .gakureki4{
    position:absolute;
    top:35% !important;
    right:7.5% !important;
  }
}




@media (max-width: 970px) {
  .lunch-text-1 {
    top: -9% !important;
    left: 13% !important;
    color: #000000 !important;
  }
  .lunch-text-2 {
    top: 23% !important;
    left: 38% !important;
  }
  .lunch-text-3 {
    top: 31% !important;
    left: 61% !important;
  }
  .lunch-text-4 {
    top: 26% !important;
    left: 83% !important;
  }
}



@media (max-width: 890px) {
  .zangyou-text-2 {
    position: absolute;
    font-size: 85%;
    color: white;
    top: 62%;
    left: 5%;
    text-align: center;
  } 
}


/*アニメーション縦並び*/
@media screen and (max-width: 768px) {
  .recruit-main {
    background-size: 30vw;
    background-position: -5% 0.2%;
  }
  .Jinbutsu-Img {
    flex-direction: flex; /* モバイルサイズでは縦に並べる */
    padding-left: 0;
    padding-right: 0;
  }

  .Image-Wrapper {
    padding: 10px 0; /* モバイル時のスペース調整 */
  }
  .astsoil-in-numbers {
    max-width: 430px;
  }
  .chart-image-container {
    display: block;
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
  }

  .anime-zangyou {
    max-width: 100%;
    height: 375px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
  .image-container-recruit-wrapper2 {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .image-container-recruit2 {
    display: block;
    /* max-width: 100%; */
    /* height: 375px; */
    margin-bottom: 10px;
    /* margin-left: auto;
    margin-right: auto; */
    width: 100%;
  }
  .easy-work {
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
  }
  .anime-container {
    display: block;
    max-width: 430px;
  }
  .anime-border {
    width: 100%;
    height: 345px;
    margin-bottom: 20px;
  }
  .image-container-recruit-wrapper {
    display: block;
  }

  .anime-easy-work-image-wrapper {
    max-height: none;
  }
  .club-image-container-recruit {
    margin-bottom: 20px;
    display: block;
  }
  .anime-easy-work-numbers-wrapper-oita {
    display: block;
    margin-top: -25px;
  }
  .anime-easy-work-chart-border-oita {
    width: 100%;
    height: 330px;
    margin-bottom: 20px;
  }
  .anime-easy-work-img {
    width: 100%; 
  }
  .easy-work-image img {
    display: block;
    margin-bottom: 20px;
  }
  .hukidasi-img-wrap {
    /* margin-top: 1500px; */
  }
  .hukidasi-title-border {
    max-width: 430px;
  }
  .hukidasi-title-border img {
    max-width: 330px;
  }
  .end-who-work {
    max-width: 430px;
    margin-left: auto;
    margin-right: auto;
  }
  .indoor-outdoor {
    max-height: none;
  }
  .easy-indoor-numbers-image {
    display: block;
  }
  .end-easy-work .end-easy-work-image img {
    width: 96%;
    margin-left: -4%;
    margin-bottom: 20px;
  }
  .anime-easy-work-numbers-wrapper {
    width: 100%;
    height: 330px;
    margin-bottom: 20px;
  }
  .anime-your-house-wrapper {
    flex-direction: column;
  }
  .anime-your-house-chart-border {
    max-width: 415px;
    margin-left: -2%;
    width: 100%;
  }
  .end-house-work-image img {
    max-width: 415px;
    margin-left: -2%;
    width: 100%;
  }
  .stress-break {
    margin-left: -1%;
  }
  .anime-border-2 {
    max-width: 412px;
  }
  .recruit-margin-who-work {
    margin-left: 0%;
  }
  .end-soccer-peach-easy-work-image {
    max-width: 415px;
    margin-left: -1%;
    flex-direction: column;
  }
  .soccer-image {
  width: 100%;
  margin-top: 5px;
  margin-bottom: 10px;
  }


  /* 縦並び数値調整 */
  .zangyou-text-2 {
    top: 65%;
    left: 6%;
  }
  .holiday-text-recruit2 {
    top: 44%;
    left: 41%;
  }
  .maternity-women-text-recruit2 {
    top: 51%;
    left: 14%;
  }
  .return-work-text-recruit2 {
    left: 60%;
  }
  .anime-chart-wrapper .chart-left-text {
    font-size: 1.5rem !important;
    left: 3%;
  }
  .anime-chart-wrapper .chart-right-text {
    font-size: 1.5rem !important;
    right: 3%;
  }
  .age20 {
    top: 4%;
    right: 86.5%;
  }
  .age30  {
    top: 21%;
    right: 67%;
  }
  .age40 {
    top: -8%;
    right: 47%;
  }
  .age50 {
    top: 2%;
    right: 27%;
  }
  .age60 {
    top: -2%;
    right: 7%;
    z-index: 2;
  }
  .min15 {
    right: 84.5% !important;
    font-size: 1rem !important;
  }
  .min30 {
    top: -9% !important;
    right: 64% !important;
    font-size: 1rem !important;
  }
  .min45 {
    top: 33% !important;
    right: 45.5% !important;
    font-size: 1rem !important;
  }
  .min60 {
    top: 11% !important;
    right: 26.5% !important;
    font-size: 1rem !important;
  }
  .min61 {
    top: 33% !important;
    right: 7% !important;
    font-size: 1rem !important;
  }
  .gakureki1 {
    right: 84.5% !important;
  }
  .gakureki2 {
    right: 58.5% !important;
  }
  .gakureki3 {
    top: -9% !important;
    right: 33% !important;
  }
  .gakureki4 {
    top: 54% !important;
    right: 9.5% !important;
  }
  .sports-text-recruit {
    left: 7%;
  }
  .culture-text-recruit {
    left: 40%;
  }
  .none-text-recruit {
    left: 66%;
  }
  .chart-left-text-kengai {
    left: 6% !important;
  }
  .chart-right-text-oita {
    right: 6%;
  }
  .person-text-1 {
    font-size: 1.5rem;
    top: 8%;
    left: 86%;
  }
  .person-text-2 {
    font-size: 1.5rem;
    top:27%;
    left:86%;
  }
  .person-text-3 {
    font-size: 1.5rem;
    top:45%;
    left:86%
  }
  .person-text-4 {
    font-size: 1.5rem;
    top:65%;
    left:86%;
  }
  .person-text-5 {
    font-size: 1.5rem;
    top:82%;
    left:86%;
  }
  .lunch-text-1 {
    top: -13% !important;
    left: 8% !important;
  }
  .lunch-text-2 {
    top: 41% !important;
    left: 34% !important;
  }
  .lunch-text-3 {
    top: 48% !important;
    left: 58% !important;
  }
  .lunch-text-4 {
    top: 44% !important;
    left: 84% !important;
  }
  .megane-text-1 {
    top: -16% !important;
    left: 7% !important;
  }
  .megane-text-2 {

  }
  .megane-text-3 {

  }
  .megane-text-4 {

  }
  .megane-text-5 {

  }
  .house-text-1 {
    font-size: 1.5rem !important;
    top: -11% !important;
    left: 8.5% !important;
  }
  .house-text-2 {
    font-size: 1.5rem !important;
    left: 23.5% !important;
  }
  .house-text-3 {
    font-size: 1.5rem !important;
    left: 37% !important;
  }
  .house-text-4 {
    font-size: 1.5rem !important;
    left: 50% !important;
  }
  .house-text-5 {
    font-size: 1.5rem !important;
    left: 63% !important;
  }
  .house-text-6 {
    font-size: 1.5rem !important;
    left: 77% !important;
  }
  .house-text-7 {
    font-size: 1.5rem !important;
    left: 89.5% !important;
  }
  .person-text-8 {
    font-size: 1.5rem !important;
    top: 5% !important;
    left: 85% !important;
  }
  .person-text-9 {
    font-size: 1.5rem !important;
    top:18% !important;
    left:86% !important;
  }
  .person-text-10 {
    font-size: 1.5rem !important;
    top:32% !important;
    left:86% !important;
  }
  .person-text-11 {
    font-size: 1.5rem !important;
    top:45% !important;
    left:86% !important;
  }
  .person-text-12 {
    font-size: 1.5rem !important;
    top:58% !important;
    left:86% !important;
  }
  .person-text-13 {
    font-size: 1.5rem !important;
    top:71% !important;
    left:85% !important;
  }
  .person-text-14 {
    font-size: 1.5rem !important;
    top:84% !important;
    left:86% !important;
  }
}

@media (max-width: 430px){
  .end-easy-work .end-easy-work-image img {
    width: 100%;
    margin-left: 0%;
  }
  .anime-chart-wrapper .chart-left-text {
    font-size: 1.2rem !important;
  }
  .anime-chart-wrapper .chart-right-text {
    font-size: 1.2rem !important;
  }
  .age-text {
    font-size: 0.9rem;
  }
  .chart-circle {
    top: -34.5%;
    right: 1.2%;
  }
  .age60 {
    top: -5%;
  }
  .sports-text-recruit {
    top: 43%;
    left: 12%;
  }
  .culture-text-recruit {
    left: 43%
  }
  .culture-text-recruit {
    top: 43%;
  }
  .none-text-recruit {
    top: 43%;
    left: 68.5%;
  }
  .anime-header-who {
    width: 200px;
  }
  .anime-header-2 {
    width: 200px;
  }
  .overlay-text-recruit {
    font-size: 15px;
  }
  .civil-text-recruit {
    top: 46%;
    left: 64%;
  }
  .anime-your-house-wrapper {
    gap: 0px;
  }
}

@media (max-width: 415px){
  .chart-image-container {
    max-width: 370px;
  }
  .easy-work-off {
    max-width: 370px;
    margin-left: 3%;
  }
  .easy-work {
    max-width: 370px;
  }
  .hukidasi-title-border {
    max-width: 370px;
  }
  .end-who-work {
    max-width: 370px;
  }
  .end-easy-work-image img {
    max-width: 362px;
  }
  .recruit-employee-survey-text-image {
    margin-left: 5% !important;
  }
  .indoor-chart-border {
    width: 360px;
  }
  .anime-your-house-chart-border {
    max-width: 360px;
    margin-left: 0%;
  }
  .end-house-work-image img {
    max-width: 360px;
    margin-left: 0%;
  }
  .anime-border-2 {
    margin-left: 5%;
    max-width: 360px;
  }
  .end-soccer-peach-easy-work {
    max-width: 362px;
    margin-left: 4%;
  }
  .recruit-margin-who-work {
    margin-left: 1% !important;
  }
}

@media (max-width: 375px){
  .zangyou-text-1 {
    top: 10%;
    left: 33%;
  }
  .easy-work-off {
    margin-left: 0%;
  }
  .hukidasi-title-border img {
    max-width: 310px;
  }
  .anime-border-2 {
    margin-left: 0%;
  }
  .recruit-employee-survey-text-image {
    margin-left: 0% !important; 
  }
  .easy-indoor-numbers-image {
    max-width: 355px;
  }
  .anime-chart-wrapper .chart-right-text {
    right: 1%;
  }
  .anime-border-stress {
    margin-left: 1% !important;
  }
  .end-soccer-peach-easy-work {
    margin-left: 0%;
  }
  .end-soccer-peach-easy-work-image {
    margin-left: 0%;
  }
  .end-house-work-image img {
    height: 315px
  }
  .recruit-margin-who-work {
    margin-left: 0% !important;
  }
}


/* ここまでアニメーション */






.overlay-link {
  position: absolute;
  display: block;
  background: transparent; /* 透明に設定 */
  z-index: 10; /* 他の要素より前面に表示 */
}






  
/* .easy-work-numbers-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
} */

.easy-work-numbers .recruit-point {
  margin-top: 8%;
}

.easy-work-numbers .recruit-point2 {
  margin-top: 8%;
}

.easy-work-numbers .recruit-point3 {
  margin-top: 8%;
}

.easy-work-numbers .recruit-point4 {
  margin-top: 8%;
}

.easy-work-numbers .recruit-point5 {
  margin-top: 8%;
  margin-bottom: 10%;
  position: relative;
}

.point-box {
  width: 77%;
  margin-left: 12%;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.click-point1 {
  position: absolute;
  bottom: 0px;
  width: 50%;
  height: 8%;
  cursor: pointer;
}

.click-point2 {
  position: absolute;
  bottom: 0px;
  width: 50%;
  height: 8%;
  right: 0px;
  cursor: pointer;
}

#point1-content {
  display: none;
}

#point2-content {
  display: none;
}

.point-div {
  white-space: normal;
  padding: 28px 50px;
  max-width: 1200px;
}


.fooo-Recruitment-Section {
  max-width: 1400px;
  display: flex;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
}

.fooo-Text-Content {
  display: flex;
  justify-content: center;

}

.fooo-Recruit-Menu {
  font-family: normal !important;
  display: flex;
  justify-content: center;
  gap: 2%;
}

.fooo-Recruit-Menu img {
  position: relative;
  top: -8%;
  left: 0%;
}

.fooo-Recruit-Menu ul {
  list-style: none;
  width: 30%;
  display: flex;
  gap: 15px;
  align-items: center;
  font-size: 75%;
}

.fooo-post {
  font-size: 74%;
  margin-top: auto;
  margin-bottom: auto;
}

.fooo-copy-right {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  color: white;
  background-color: #000;
  height: 75%;
  margin-top: auto;
  margin-bottom: auto;
}

@media (max-width: 1440px) {
  .fooo-Recruit-Menu ul {
    width: auto;
    gap: 15px;
    font-size: 60%;
  }
  .fooo-post {
    font-size: 60%;
  }
  .fooo-copy-right {
    height: 60%;
    font-size: 85%;
  }
}


@media (max-width: 1110px) {
  .fooo-Recruit-Menu {
    gap: 1%;
  }
  .fooo-Recruit-Menu ul {
    width: auto;
    gap: 7px;
    font-size: 55%;
  }
  .fooo-post {
    font-size: 55%;
  }
  .fooo-copy-right {
    height: 60%;
    font-size: 70%;
  }
}

@media (max-width: 925px) {
  .fooo-Recruit-Menu ul {
    width: auto;
    gap: 5px;
    font-size: 45%;
  }
  .fooo-post {
    font-size: 45%;
  }
  .fooo-copy-right {
    height: 60%;
    font-size: 55%;
  }
}


.sp-easy-work-numbers .sp-recruit-point {
  margin-top: 8%;
}

.sp-easy-work-numbers .sp-recruit-point2 {
  margin-top: 8%;
}

.sp-easy-work-numbers .sp-recruit-point3 {
  margin-top: 8%;
}

.sp-easy-work-numbers .sp-recruit-point4 {
  margin-top: 8%;
}

.sp-easy-work-numbers .sp-recruit-point5 {
  margin-top: 8%;
  margin-bottom: 10%;
  position: relative;
}

.sp-easy-work-numbers .sp-recruit-point6 {
  margin-top: 8%;
  margin-bottom: 10%;
  position: relative;
}



.sp-point-box {
  width: 77%;
  margin-left: 4%;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.sp-click-point3 {
  position: absolute;
  bottom: 0px;
  width: 50%;
  height: 40%;
  cursor: pointer;
}

.sp-click-point4 {
  position: absolute;
  bottom: 0px;
  width: 50%;
  height: 40%;
  right: 0px;
  cursor: pointer;
}

#sp-point3-content {
  display: none;
}

#sp-point4-content {
  display: none;
}

.sp-point-div {
  white-space: normal;
  padding: 28px 50px;
}


.sp-c-carousel {
  position: relative;
  width: 80%;
  margin: 0 auto;
  margin-bottom: 10%;
}
.sp-c-carousel__activator-main {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.sp-c-carousel__main {
  overflow: hidden;
  position: relative;
}
.sp-c-carousel__main-track {
  display: flex;
  white-space: nowrap;
  transition: transform 0.3s ease-out;
}
.sp-c-carousel__main-item {
  flex-shrink: 0;
  width: 100%;
}
.sp-c-carousel__main-image {
  display: block;
  width: 100%;
}

.sp-c-carousel__main-control-item {
  display: none;
}
.sp-c-carousel__btn-prev-main, .sp-c-carousel__btn-next-main {
  position: absolute;
  top: 50%;
  right: 32px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  transform: translateY(-50%);
  background-color: #000;
  border-radius: 50%;
  transition: opacity 0.3s;
  cursor: pointer;
}
.sp-c-image-arrow {
  width: 61px;
}
.sp-c-carousel__btn-prev-main {
  right: auto;
  left: 32px;
}
.sp-c-carousel__activator-main:nth-child(1):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(1) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(2):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(2) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(3):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(3) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(4):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(4) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(5):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(5) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(6):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(6) {
  display: block;
}
.sp-c-carousel__activator-main:nth-child(7):checked ~ .sp-c-carousel__main .sp-c-carousel__main-control-item:nth-child(7) {
  display: block;
}

.sp-c-carousel__activator-main:nth-child(1):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 0));
}
.sp-c-carousel__activator-main:nth-child(2):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 1));
}
.sp-c-carousel__activator-main:nth-child(3):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 2));
}
.sp-c-carousel__activator-main:nth-child(4):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 3));
}
.sp-c-carousel__activator-main:nth-child(5):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 4));
}
.sp-c-carousel__activator-main:nth-child(6):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 5));
}
.sp-c-carousel__activator-main:nth-child(7):checked ~ .sp-c-carousel__main .sp-c-carousel__main-track {
  transform: translateX(calc(-100% * 6));
}














































.c-carousel {
  position: relative;
  width: 80%;
  margin: 0 auto;
  margin-bottom: 10%;
}
.c-carousel__activator-main {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.c-carousel__main {
  overflow: hidden;
  position: relative;
}
.c-carousel__main-track {
  display: flex;
  white-space: nowrap;
  transition: transform 0.3s ease-out;
}
.c-carousel__main-item {
  flex-shrink: 0;
  width: 100%;
}
.c-carousel__main-image {
  display: block;
  width: 100%;
}

.c-carousel__main-control-item {
  display: none;
}
.c-carousel__btn-prev-main, .c-carousel__btn-next-main {
  position: absolute;
  top: 50%;
  right: 32px;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  transform: translateY(-50%);
  background-color: #000;
  border-radius: 50%;
  transition: opacity 0.3s;
  cursor: pointer;
}
.c-image-arrow {
  width: 61px;
}
.c-carousel__btn-prev-main {
  right: auto;
  left: 32px;
}
.c-carousel__activator-main:nth-child(1):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(1) {
  display: block;
}
.c-carousel__activator-main:nth-child(2):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(2) {
  display: block;
}
.c-carousel__activator-main:nth-child(3):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(3) {
  display: block;
}
.c-carousel__activator-main:nth-child(4):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(4) {
  display: block;
}
.c-carousel__activator-main:nth-child(5):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(5) {
  display: block;
}
.c-carousel__activator-main:nth-child(6):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(6) {
  display: block;
}
.c-carousel__activator-main:nth-child(7):checked ~ .c-carousel__main .c-carousel__main-control-item:nth-child(7) {
  display: block;
}

.c-carousel__activator-main:nth-child(1):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 0));
}
.c-carousel__activator-main:nth-child(2):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 1));
}
.c-carousel__activator-main:nth-child(3):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 2));
}
.c-carousel__activator-main:nth-child(4):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 3));
}
.c-carousel__activator-main:nth-child(5):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 4));
}
.c-carousel__activator-main:nth-child(6):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 5));
}
.c-carousel__activator-main:nth-child(7):checked ~ .c-carousel__main .c-carousel__main-track {
  transform: translateX(calc(-100% * 6));
}

.workrs {
 display: flex;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
 margin-top: 4%;
 margin-bottom: 2%;
}
    
.workrs-image img{
 max-width: 100%;
 height: auto;
 object-fit: contain;
}
  
.works-number {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
}
      
.works-number-image img{
 max-width: 100%;
 height: auto;
 object-fit: contain;
}

.Look-at-Numbers-body {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f0f0f0;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.Look-at-Numbers {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 90vw;  /* 画面幅の90%に制限 */
}

.Look-at-Numbers-L, .Look-at-Numbers-R {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.Look-at-Numbers-L img, .Look-at-Numbers-R img {
  width: 100%;  /* 親要素に対して幅を自動調整 */
  height: auto; /* 縦横比を保つ */
  max-width: 300px; /* 各画像の最大幅を設定 */
  margin-bottom: 10px; /* 画像の間隔を調整 */
}

.Look-at-Numbers-C {
  display: flex;
  justify-content: center; /* 中央揃え */
  align-items: center;
  margin: 0 20px; /* 左右の列とのスペースを調整 */
}

.Look-at-Numbers-C img {
  width: auto;
  height: 100%; /* 高さを左右の列と揃える */
  max-height: calc(5 * 300px + 4 * 10px); /* 左右の画像と同じ高さに制限 */
}

.coming-soon{
  margin-top: 5%;
}



/*採用関係スマホ関係*/

.sp-recruit-main{
  width: 100%;
  height:auto;
  min-width: 20%;
}

.sp-recruit-title-list{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-recruit-title-list-text{
  display: block;
  margin: 10%;
}

.sp-recruit-title-list-text p{
  border-bottom: 2px solid black;
  margin-bottom: 6%;
}

.sp-recruit-img{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-recruit-img-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.sp-recruit-consultant-detail{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-recruit-consultant-detail-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

/* 横スクロール用のコンテナ */
.image-scroll-container {
  width: 100%;              /* 表示領域の横幅を画面幅に設定 */
  overflow-x: scroll;        /* 横スクロールを有効にする */
  white-space: nowrap;       /* 画像が改行されずに横に並ぶようにする */
  -webkit-overflow-scrolling: touch; /* スムーズスクロール（iOS用） */
  padding-left: 15%;
}

/* 画像を横スクロールで表示 */
.scroll-image {
  width: 200%;              /* 画像の横幅を通常の2倍に設定 */
  display: inline-block;     /* インラインブロック要素として画像を扱う */
}

/* 視覚的にスクロール可能なことを示すためのスタイル */
.image-scroll-container::after {
  content: '';               /* 空の要素を作成 */
  display: block;
  width: 100%;               /* デフォルトで画像の左半分のみ表示 */
  height: 2px;
  background: linear-gradient(to right, transparent, black); /* スクロールを示す線 */
  position: relative;
  top: -10px;                /* 画像の下にスクロールを示す線を表示 */
}


.sp-new-recruit{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-new-recruit-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

/* recruit_sp03は四枚の画像を取り急ぎ一枚の画像で表示、配置の調整必要 */
.sp-recruit-sp03{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-recruit-sp03-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.sp-work-about-2{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}

.sp-work-about-2-image {
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
}

.sp-work-about-2-image div {
  /* 各画像を包む要素にマージンやその他のスタイルを指定する場合 */
}

.sp-work-about-2-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-work-about-1{
  /* display: flex; */
  /* justify-content: center; */
  max-width: 50%; /*100→50へ*/
  height:auto;
  object-fit:contain;
  /* margin-top: 2%; */
  /* margin-bottom: 2%; */
  margin:auto;
  display:block
}

.sp-work-about-1-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.sp-senior{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-senior-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.sp-senior-voice{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 2%;
  margin-bottom: 2%;
}

.sp-senior-voice-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  margin-top: 10%;
}

.sp-astsoil-in-numbers{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 4%;
  margin-bottom: 2%;
}

.sp-astsoil-in-numbers-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
}

.sp-easy-work {
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
}

.sp-easy-work-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-easy-work-numbers {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
 margin-bottom: 10%;
}
  
.sp-easy-work-numbers-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-workrs{
  display: flex;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
  margin-top: 4%;
  margin-bottom: 2%;
}

.sp-workrs-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-workrs-number {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
}
  
.sp-workrs-number-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-welfare-programme {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}
   
.sp-welfare-programme-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-working-environment {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}
   
.sp-working-environment-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.sp-working-environment-text {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
}
   
.sp-working-environment-text-image img{
 max-width: 100%;
 height: auto;
 object-fit: contain;
}

.sp-working-environment-button {
 display: flex;
 justify-content: center;
 max-width: 100%;
 height: auto;
 object-fit: contain;
 white-space: nowrap;
}
   
.sp-working-environment-button-image img{
 max-width: 100%;
 height: auto;
 object-fit: contain;
}




/* sp-footer */
.sp-footer{
  width: 100%;
  height:auto;
  min-width: 20%;
  margin-top: 10%;
}



.sp-recruit-footer-logo {
  display: flex;
  justify-content:flex-start;
  max-width: 80%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}
    
.sp-recruit-footer-logo-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
 
 
.sp-Text-Content {
 display: flex;
 align-items: flex-end; 
 justify-content: flex-end;
 width: 100%;
}



.sp-Recruit-Menu{
  width: 100%;
}

.sp-Recruit-Menu ul {
  list-style: none;
  width: 100%;
  padding: 0;
  margin-top: 10px;
  display: flex;
  gap: 10px; 
  justify-content: flex-end; 
}

.sp-Recruit-Menu ul li a {
  text-decoration: none;
  font-size: 14px;
  color: #000;
  white-space: nowrap; 
}

.sp-Recruit-Menu ul li a:hover {
  text-decoration: underline;
}


.sp-footer-last {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  white-space: nowrap;
}
    
.sp-footer-last-image img{
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/* ここからfooter*/

.company-address p{
  color:black;
}

.foot-Text-Content {
  display: flex;
  align-items: flex-end; 
  justify-content: flex-end;
  width: 100%;
}

.foot-Recruit-Menu{
  width: 100%;
}

.foot-Recruit-Menu ul {
  list-style: none;
  width: 100%;
  padding: 0;
  margin-top: 10px;
  display: flex;
  gap: 15px; /* リンク間にスペース */
}

.foot-Recruit-Menu ul li a {
  text-decoration: none;
  font-size: 14px;
  color: #000;
  white-space: nowrap; /* リンクの改行を防ぐ */
}

.foot-Recruit-Menu ul li a:hover {
  text-decoration: underline;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .foot-Text-Content {
      flex-direction: column;
      align-items: center;
  }

  .foot-Recruit-Menu ul {
      justify-content: center;
  }
}

/* .footer-beppu {
  position: relative;
  left: -14vw;
  bottom: -15.6vw;
} */

.company-information {
 /* position: relative;
 left: 50vw;
 bottom: -5vw; */
 width: 85%;
 /* margin-left: 0; */
 display: flex;
 margin-top: auto;
 margin-bottom: auto;
 /* display: flex;
 flex-direction: column;
 justify-content: center; */
}

.company-information-div {
  width: 100%;
  /* display: flex;
  flex-direction: column;
  justify-content: center; */
 }

/* .foot-Recruit-Menu ul {
  justify-content: center;
} */

.company-information div {
  margin: 0;
}

#footer_information .company-information .company-address p {
  font-size: 14px;
  margin-left: 0;
  padding-bottom: 2%;
}
 

.foot_img {
  width:64%;
  margin-left: 5%;
}

/* #rc-anchor-container {
  display: none;
} */

#return_top {
  display: none;
}

.c-astsoil {
  color: white;
  background-color: black;
  position: relative;
  text-align: right;
  width: 29vw;
  margin-left: 10%;
  padding: 1%;
  margin-top: 10%;
 
}

/* Contact Form 7 基本スタイル */
.wpcf7 {
  width: 100%;
  margin: 0 0 2.5em !important;
  padding: 20px;  /* paddingを追加 */
  border: 1px solid #ddd;  /* ボーダーを追加 */
  background: #fafafa;
  font-size: 14px;
}

/* フォームラベルとフィールドの横幅を統一 */

.wpcf7 select {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 56.5%;  /* 横幅を統一 */
  padding: 1%;
  margin: 2% 0;
  border: 1px solid #ccc;
  line-height: 1.2;
}
.wpcf7 input {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 40%;  /* 横幅を統一 */
  padding: 1%;
  margin: 1% 2%;
  border: 1px solid #ccc;
  line-height: 1.2;
}
.wpcf7 textarea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;  /* 横幅を統一 */
  padding: 1%;
  margin: 2% 2%;
  margin-right: -33%;
  border: 1px solid #ccc;
  line-height: 1.2;
}

.wpcf7-list-item-label{
  margin: 0 -25%;
  padding : 1em;
}

.hr3{
  border-top: 3px solid #b5b6b7;
}

.confirmation{
margin-left: 66%;
}

/* ラジオボタンを横並びに */
.wpcf7-list-item {
  display: inline-block;
  margin-right: 5em;
  white-space: nowrap;
}

/* プライバシーポリシーのスクロール可能なボックス */
.privacy-policy {
  margin-top: 20px;
  font-size: 14px;
}

.privacy-policy h4 {
  margin-bottom: 10px;
}

.policy-content {
  max-height: 200px;
  overflow-y: scroll;
  padding: 10px;
  margin-left: 2%;
  background-color: #ecebe6;
}

/* ボタンのスタイル */
.wpcf7 .wpcf7-submit {
  width: 20%;
  height: auto;
  padding: 2%;
  margin: 5% 35%;
  background-color: #fff;
  color: #000;
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  border-radius: 15px;
  border: solid 2px;
}

@media (max-width: 480px) {
  .wpcf7 .wpcf7-submit{
    margin: 5% 25%;
  }
  }

.wpcf7 .wpcf7-submit:hover {
  background-color: #bcbdb6;
  color:#fff;
}

/* 画像のサイズを調整 */
.contact-text {
  width: 100%; /* 適切なサイズに調整 */
  object-fit: contain;
  margin-right: 10% 0;
}

/* フォーム全体と画像を横並びに配置 */
.contact-flex {
  display: flex;
  align-items: flex-start;
}

/* フォーム全体を左に配置し、画像を右側に */
.contact-form {
  width: 80%;
  padding-top: 1%;
  position: relative;
}

.contact-left {
  width: 20%;
  margin-top: 3%;
  padding-right: 2%;
}

.confirmation_2{
  margin: 2% 0 0 27%;
}

@media (max-width: 768px) {
  .confirmation_2{
    margin: auto;
    margin-left: -11vw;
  }
  }

  @media (max-width: 400px) {
    .confirmation_2{
      margin-left: -17vw;
    }
    }

.combination{
  margin-left: 2%;
}
.choice{
  margin: 1% 0 0 -3%;
}

.contact-overlay{
  position: absolute;
  margin-top: -100%;
  left: 72%;
  width: 26%;
  height: auto;
}
@media (max-width: 1400px) {
  .contact-overlay{
    margin-top: -167%;
  }
}

@media (max-width: 574px) {
  .contact-overlay{
    margin-top: -277%;
  }
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .contact-flex {
      flex-direction: column;
      align-items: center;
  }

  .contact-left,
  .contact-form {
      width: 100%;
  }

  .breadcrumb {
      text-align: center;
  }
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .contact-flex {
      flex-direction: column;
      align-items: center;
  }

  .contact-left,
  .contact-form {
      width: 100%;
  }

  .breadcrumb {
      text-align: center;
  }
}


.ast_respo__pc {
  display: block;
}

.ast_respo__sp {
  display: none;
}

@media (max-width: 768px) {
  .ast_respo__pc {
    display: none;
  }
  
  .ast_respo__sp {
    display: block;
  }
}
.unique-menu-button {
  position: fixed;
  top: -2vw;
  right: -5vw;
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 50%;
  background-color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  z-index: 1001;
  transition: background-color 0.3s ease;
}

.unique-menu-button .unique-icon {
  color: #fff;
  font-size: 1.5rem;
  font-weight: bold;
  pointer-events: none;
  line-height: 1; /* 行の高さを調整 */
  text-align: center; /* アイコンを中央揃え */
  font-weight: bold;
  padding-bottom: 1px;
}

.unique-menu-button:hover {
  background-color: #555;
}

.unique-side-menu {
  position: fixed;
  top: 0;
  left: -100%;
  width: 300px;
  height: 100%;
  background-color: #fff;
  box-shadow: 2px 0 5px rgba(0, 0, 0, 0.2);
  transition: left 0.3s ease;
  padding: 20px;
  z-index: 999;
}

.hamburger_list_mini_text {
font-size: 1rem !important;
}

.unique-side-menu.active {
  left: 0;
}
.hamburger_list_padding_tp {
padding-top: 11% !important;
}

.unique-side-menu .unique-logo-container {
  text-align: center;
  margin-bottom: 7%;
}

.unique-side-menu .unique-logo-link {
  display: inline-block;
  text-decoration: none;
}

.unique-side-menu .unique-logo {
  max-width: 80%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.unique-side-menu .unique-menu-list {
list-style: none;
  padding: 0;
  margin: 10px;
  margin-left: 10%;
  font-weight: bold;
  font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}

.unique-side-menu .unique-menu-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.unique-side-menu .unique-menu-list li {
  margin: 12px 0;
  /* padding-top: 10%; */
  font-size: 1.5rem;
}

.unique-side-menu .unique-menu-list li a {
  text-decoration: none;
  color: #000
}


/* センパイの声１*/

.page-id-479 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/mizuki.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}

.page-id-507 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/ayumi.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}

.page-id-505 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/sunada.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}

.page-id-510 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/hirose.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}

.page-id-512 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/masuda.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}

.page-id-514 .senpai1-main{
  width: 100%;
  height:auto;
  min-width: 20%;
  background-image:url("img/masuo.png");
  border: 1px solid #000;
  background-repeat: no-repeat;
}


.page-id-507{
  padding-top: 0 !important;
}

.page-id-505{
  padding-top: 0 !important;
}

.page-id-510{
  padding-top: 0 !important;
}

.page-id-512{
  padding-top: 0 !important;
}

.page-id-514{
  padding-top: 0 !important;
}

.page-id-507 #header{
  display: none !important;
}

.page-id-505 #header{
  display: none !important;
}

.page-id-510 #header{
  display: none !important;
}

.page-id-512 #header{
  display: none !important;
}

.page-id-514 #header{
  display: none !important;
}

.senpai1-main .in-Senior-Massage-bottom img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.senpai1-main .Senior-Massage-bottom-image {
  display: flex;
  gap: 2%;
  width: 100%;
  justify-content: center;
  margin-bottom: 2%;
}

.senpai1-img {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  /* margin-top: 4%; */
  margin-bottom: 2%;
}

.senpai1-img-image {
z-index: -1;
}

.senpai1-img-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
  border: 4px solid #000;
}


.senpai1-img2 {
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-left: 10%;
}

.senpai1-img2-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  width:100%;
  margin-left: -6.5%;
  margin-bottom: 5%;
}
  
.senpai1-img3 {
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-left: 10%;
}

.senpai1-img3-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  width:100%;
}

.senpai1-img4-image-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  max-width: 100%;
  height: auto;
}

.senpai1-img4 {
  position: relative;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  margin-top: 4%;
}

.senpai1-img4-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
  border: 4px solid #000;
}

.other-senior {
  position: absolute; /* recruit_08.pngの上に重ねる */
  top: 80%; /* 縦位置の微調整ポイント */
  max-width: 80%; /* 画像のサイズの微調整ポイント */
  height: auto;
  object-fit: contain;
}

@media (max-width: 768px) {
  .other-senior {
      top: 90%; /* スマホサイズではさらに下げる */
      max-width: 90%; /* 必要に応じてサイズも調整可能 */
  }
}

@media (max-width: 480px) {
  .other-senior {
      top: 95%; /* さらに小さいスマホサイズでの調整 */
      max-width: 95%;
  }
}


.other-senior-image img {
  max-width: 100%;
  height: auto;
  object-fit: contain;;
  margin-bottom: 10%;
}



.in-Senior-Massage-bottom{
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  white-space: nowrap;
}

.in-Senior-Massage-bottom-image{
  display: flex; /* 画像をフレックスボックスで並べる */
  gap: 2%; /* 画像間に隙間を作る */
  width: 100%;
  justify-content: center;
  margin-bottom: 2%;
}

.in-Senior-Massage-bottom-image div {
  /* 各画像を包む要素にマージンやその他のスタイルを指定する場合 */
}

.in-Senior-Massage-bottom-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;
}
@media (max-width: 768px) {
  .in-Senior-Massage-bottom {
    flex-direction: column; /* モバイルサイズでは縦に並べる */
    justify-content: center;
  }
  
  .in-Senior-Massage-bottom-image{
    flex-direction: column;
    justify-content: center;
  }

  .in-Senior-Massage-bottom-image div {
    flex-direction: column;
    justify-content: center;
  }
}






.footer-senpai1-main{
width: 100%;
height:auto;
min-width: 20%;
}


.footer-ast {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 4%;
}

.footer.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}ntain;
  margin-top: 4%;
}

.footer.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}ax-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}0%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}nt: center;
  }
}






.footer-senpai1-main{
width: 100%;
height:auto;
min-width: 20%;
}


.footer-ast {
  display: flex;
  justify-content: center;
  max-width: 100%;
  height:auto;
  object-fit:contain;
  margin-top: 4%;
}

.footer.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}ntain;
  margin-top: 4%;
}

.footer.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}ax-width: 100%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}0%;
  height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}height:auto;
  object-fit: contain;

}r.ast-image img{
  max-width: 100%;
  height:auto;
  object-fit: contain;

}