@charset "utf-8";

/*------------------------------------------------------

	グローバル

------------------------------------------------------*/

body { font-size: 0.9em;}

.ta_right-s_center { text-align: center !important;}
.ta_left-s_center { text-align: center !important;}
.ta_center-s_left { text-align: left !important;}

.hidden_s { display: none !important;}

.cont1000, .cont1200 { padding: 0 5%;}

.mb40-20 { margin-bottom: 20px !important;}
.mb60-30, .mb50-30 { margin-bottom: 30px !important;}
.mb80-40 { margin-bottom: 40px !important;}
.mb100-60 { margin-bottom: 60px !important;}
.mb120-60 { margin-bottom: 60px !important;}
.mb120-80 { margin-bottom: 80px !important;}
.mb160-80 { margin-bottom: 80px !important;}


/* ------------------------
	ヘッダー
------------------------ */

.header {
  background-image: image-set(
url("../images/common/header_bg01_sp.webp") 1x,
url("../images/common/header_bg01_sp@2x.webp") 2x,
url("../images/common/header_bg01_sp.png") 1x
  );
  background-position: 37% bottom; height: 11em; font-size: min(2vw,1em);}
.header .cont1200 { display: block; padding-top: 2em;}
.header h1 { width: 50%;}


/* ------------------------
	フッター
------------------------ */
 
.cta { padding: 10% 0px 15%; font-size: min(3.2vw,1em);}
.cta h2 { font-size: 2.5em;}

.footer .bg01 { background-size: auto 115%; margin-top: -12%;}

.pagetop { width: 90px; right: 15px;}

@media only screen and (max-width: 640px) {
.footer .bg01 {
  background-image: image-set(
      url("../images/common/footer_bg01_sp.webp") 1x,
      url("../images/common/footer_bg01_sp@2x.webp") 2x,
      url("../images/common/footer_bg01_sp.png") 1x
    );
    background-size: 100% auto; padding: 11% 0 40px;
  }
  .footer .bg01 .box01 { flex-flow: column; gap: 40px; align-items: center;}
  .footer_nav { order: 1; gap: 1em 2em; padding: 0 5%;}
  .footer .bg01 .box01 .logo { order: 2;}
  .footer .bg01 .box01 .box_inner01 { order: 3;}
  .list_sns li { width: 25px;}
  .footer .bg01 .list02 { flex-wrap: wrap; gap: 0.3em 0;}
  .footer .bg01 .list02 ul { width: 100%;}
  .footer .bg01 .list02 li:nth-child(2):after { display: none;}
}

@media only screen and (max-width: 480px) {
  .footer .bg01 { background-size: auto 100%; font-size: min(4vw,1em);}
  .footer .bg01 .box02 h3 { text-align: center;}
  .footer .bg01 .box02 .list01 { flex-flow: column; align-items: center; gap: 30px;}
}


/*------------------------------------------------------

	トップページ

------------------------------------------------------*/

.viewer { width: 100%; margin-left: 0;}
.slide_wrap:after { display: none;}
.slide_wrap .text01 { right: 5%; top: 25%; transform: none;}
.slide_wrap .text01 p { font-size: min(6.5vw,2.6em);}

.top_sec01 {
  background-image: image-set(
url("../images/top/top_sec01_bg01_sp.webp") 1x,
url("../images/top/top_sec01_bg01_sp@2x.webp") 2x,
url("../images/top/top_sec01_bg01_sp.png") 1x
  );
  background-size: auto 90%; background-position: 35% top; margin-top: -16%; padding-top: 140px; height: auto;}
.top_sec01 .box01 { flex-flow: column; gap: 30px; margin-top: 0;}
.top_sec01 .box01 .box_inner { width: auto; margin-top: 30px;}
.top_sec01 h2 { font-size: 2em;}
.top_sec01 .box01 > figure { padding-left: 50%;}

.top_en_ttl { font-size: 0.85em;}
.top_en_ttl.mb30 { margin-bottom: 10px !important;}

.top_sec02 { height: auto; padding: 70px 0 100px;}
.top_sec02 .box01 { width: auto; font-size: 1em; margin-bottom: 60px;}
.top_sec02 .ttl_box { display: table; margin: auto;}
.top_sec02 .fo17 { font-size: min(5.5vw,1.7em) !important;}
.top_sec02 .list01 { display: flex; flex-wrap: wrap; justify-content: space-between; font-size: min(2.9vw,1em) !important; gap: 3em 0;}
.top_sec02 .list01 .pos_ab { position: static;}
.top_sec02 .list01 li:nth-child(1) { width: 52%; margin-top: -0.5em;}
.top_sec02 .list01 li:nth-child(2) { width: 40%;}
.top_sec02 .list01 li:nth-child(3) { width: 40%;}
.top_sec02 .list01 li:nth-child(4) { width: 48%; margin: -6em 1% 0 0;}
.top_sec02 .list01 li:nth-child(5) { width: 42%;}
.top_sec02 .list01 li:nth-child(6) { width: 44%; margin-top: -4em;}

.top_sec03:before { height: 30px; top: -29px;}
.top_sec03:after { height: 25px; bottom: -24px;}
.top_sec03 .cont1000 { flex-flow: column; gap: 30px;}
.top_sec03 .cont1000:before, .top_sec03 .cont1000:after { display: none;}
.top_sec03 section { padding: 1.5em;}
.top_sec03 section:nth-of-type(1) { width: 100%;}

.top_sec04 h2 { margin-top: 23%; background-position: 52% 0.4em; background-size: 6.2em auto;}
.top_sec04 th { width: 9em;}
.top_sec04 td { padding: 1em 0.5em;}
.top_sec04 .img01 { top: 8%; width: 40%; left: -15%;}
.top_sec04 .bg01 { top: 13%;}

.top_sec05 h2 { background-position: 51.5% top; background-size: 3.7em auto;}
.top_sec05 .box01 dl { gap: 0.5em; margin-left: 2.7em;}
.top_sec05 .box01 dt { width: 5em;}
.top_sec05 .box01 dt:before { left: -3.5em;}
.top_sec05 .box01 dt:after { width: 1.3em; height: 2px; left: -1.8em; background-size: 6px 2px;}

.top_sec06 h2 { background-size: 1.4em auto;}
.top_sec06 .img01 { width: 200%; margin-left: -50%;}
.top_sec06 .bg { background: none; height: auto;}
.top_sec06 .box01 { width: auto; background: none; padding: 0;}
.top_sec06 h3 { margin-bottom: 5px !important;}

.top_sec07 { background-size: 250% auto; background-position: 80% bottom; padding-bottom: 30%; margin-bottom: 0 !important;}
.top_sec07 .box01 { flex-flow: column; gap: 60px;}
.top_sec07 .box01 section:nth-child(1) { max-width: initial;}
.top_sec07 .box01 section:nth-child(2) { width: auto;}
.top_sec07 .box02 { font-size: 1em;}
.top_sec07 h4 { font-size: 1.7em !important;}
.top_sec07 .ttl_box, .top_sec08 .ttl_box { padding-top: 0;}
.top_sec07 .ttl_box:before, .top_sec08 .ttl_box:before { width: 11em; transform: translateX(-52%);}
.top_sec07 .map iframe { height: 250px;}

.top_sec07 .bg01 { width: 50%; top: -6%; left: auto; right: -27%;}
.top_sec07 .bg02 { width: 60%; top: 3%; right: -32%;}
.top_sec07 .bg03 { width: 50%; top: -4%; left: -27%;}
.top_sec07 .bg04 { width: 10%; top: -1%; left: 2%;}

.archive .news_list { gap: 50px 6%;}
.archive .news_list > li { width: calc(94% / 2);}


@media only screen and (max-width: 680px) {
  .news_list { font-size: 1em; flex-flow: column; align-items: center; padding: 0 5% 0 calc(5% + 14px);}
  .news_list > li { width: 100% !important; max-width: 400px;}
}

@media only screen and (max-width: 480px) {
  .top_sec01 { margin-top: -23%; background-position: 37% top;}

  .top_sec07 .box02 { flex-flow: column; gap: 60px; align-items: center;}
  .top_sec07 .bg02 { top: 50%;}
}


/*------------------------------------------------------

	下層ページ

------------------------------------------------------*/

.more_btn a:before { width: 3.2em; height: 3.2em; margin-bottom: 0.3em;}

.heading_large { font-size: 1.7em;}


/* ----------------------------
	固定ページテンプレート
---------------------------- */

.mainimage > figure { aspect-ratio: 4/5; height: auto;}
.mainimage:after {
  background-image: image-set(
    url("../images/common/pagettl_bg_sp.webp") 1x,
    url("../images/common/pagettl_bg_sp@2x.webp") 2x,
    url("../images/common/pagettl_bg_sp.png") 1x
  );
  background-position: 40% top;
  height: 20%; bottom: -2px;}

.pagettl h1 { font-size: min(7.5vw,2.2em);}
.pagettl .bg01 { width: 12%; max-width: 50px; right: -10px;}
.pagettl .bg02 { width: 14%; max-width: 55px; left: -0px;}
.pagettl .bg03 { width: 13%; max-width: 55px; right: 10px;}

.main_contents { padding: 0px 20px;}


/* ------------------------
	recruit
------------------------ */

.rec_ttl.ttl_box_center { writing-mode: vertical-rl; font-size: 1.2em; padding-top: 1em; display: flex;}
.rec_ttl.ttl_bg_left:before { background: #c2d4b5; width: 0.9em; height: 0.9em;}
.rec_ttl.ttl_bg_left:after { background: #faa778; width: 1.7em; height: 1.7em; left: -4.5em; top: 0.2em;}

.ttl_box_center { font-size: min(3.5vw,1em);}

.ttl_bg_left:before { left: -5em;}
.ttl_bg_left:after { width: 2em; height: 2em; left: -3.2em;}

.ttl_bg_center:before { width: 1.8em; height: 1.8em; left: -3em; top: 0;}

.rec_sec01 .box01 { flex-flow: column; gap: 30px 5%;}
.rec_sec01 .box01 .box_inner01 { width: auto; display: contents;}
.rec_sec01 .box01 .box_inner02 { padding-top: 0; order: 2; display: flex; flex-flow: row-reverse; align-items: flex-end; justify-content: center; margin-top: -30px;}
.rec_sec01 .box01 .box_inner02 p { width: 7em; margin-bottom: 1em;}
.rec_sec01 .box01 .box_inner02 .img01 { flex: 1; margin-bottom: 0 !important; width: 70%; max-width: 470px;}

.rec_sec01 .ttl { order: 1; margin-bottom: -30px;}
.rec_sec01 .text { order: 3;}
.grad_wrap { height: 25em;}

.rec_sec01 .bg01 { width: 50%; top: -30%; right: -23%;}
.rec_sec01 .bg02 { width: 80%; bottom: -15%; right: -17%;}
.rec_sec01 .bg01 img, .rec_sec01 .bg02 img { max-width: 100%;}

.rec_sec02 .bg02 { width: 45%; right: -12%; top: auto; bottom: -90px;}

.scroll_wrap { overflow-x: scroll;}

.rec_sec03 .list01 { flex-wrap: nowrap; gap: 1em; max-width: initial; width: 104em; font-size: min(3.5vw,1em);}
.rec_sec03 .list01 li { width: 20em;}
.rec_sec03 .list01 figcaption { background: rgba(255,255,255,0.9); border-radius: 0.8em; bottom: 1em; left: 1.2em; right: 1.2em; padding: 1em 1.8em;}
.rec_sec03 .list01 figcaption:after { content: ""; position: absolute; width: 2.6em; height: 2.6em; border-radius: 50%; border: solid 1px #535835; background: url("../images/common/more_btn.svg") no-repeat center center #fcc8cc; background-size: cover; right: 0.8em; top: 50%; transform: translateY(-50%); transition: 0.3s;}
.rec_sec03 .list01 a:hover figcaption:after { background-color: #d9e8e6;}

.rec_sec04 .list01 .box01 { padding: 2em 0.5em;}
.rec_sec04 .list01 h3.mb25 { margin-bottom: 0.5em !important;}
.rec_sec04 .bg02 { width: 45%; right: -15%; bottom: auto; top: -15%;}

.rec_sec05 .bg01 { width: 45%; left: -20%; top: 2%;}
.rec_sec05 .bg02 { width: 50%; bottom: -6%;}

.rec_sec07 { margin: 100px 0; padding: 20px 0 30px;}
.rec_sec07:before { height: 34px; top: -33px;}
.rec_sec07:after { height: 25px; bottom: -24px;}
.rec_sec07 section { padding: 20px;}

.rec_sec08 .bg01 { width: 45%; left: -30%; bottom: -5%;}
.rec_sec08 .bg05 { position: static; width: 13%; transform: scale(-1,1); margin: -2em 0 0.5em auto;}

.rec_sec09 .ttl_bg_center:before { top: -0.8em; left: -2.5em; width: 1.6em; height: 1.6em;}
.rec_sec09 .ttl_bg_center:after { top: 1.7em; right: -2.5em; width: 0.8em; height: 0.8em;}
.rec_sec09 .list01 a { font-size: 0.8em; padding-bottom: 4.5em;}
.rec_sec09 .list01 a:after { width: 3.8em; height: 3.8em;}

@media only screen and (max-width: 640px) {
  .rec_sec02 .list01 { flex-flow: column; gap: 50px; align-items: center;}
  .rec_sec02 .list01 > li { width: 100%; max-width: 500px;}

  .rec_sec04 .list01 { justify-content: space-between; gap: 1em; font-size: min(2.5vw,1em);}
  .rec_sec04 .list01 li { width: calc((100% - 1em) / 2) !important;}
  .rec_sec04 .list01 li:nth-child(4) { order: 5;}
  .rec_sec04 .list01 li:nth-child(5) { order: 4;}
  .rec_sec04 .list01 .text02 { position: absolute; bottom: 0; right: 0;}
  .rec_sec04 .list01 .box01 { margin-bottom: 0 !important; border-radius: 1.2em;}
  .rec_sec04 .list01 li:nth-child(4) .num { letter-spacing: 0.03em; margin-left: 0.2em;}

  .rec_sec04 .list01 li:nth-child(1) .img01 { width: 3em; left: 1em;}
  .rec_sec04 .list01 li:nth-child(2) .img01 { width: 1.8em;}
  .rec_sec04 .list01 li:nth-child(3) .img01 { width: 3em; left: 1em;}
  .rec_sec04 .list01 li:nth-child(4) .img01 { width: 2.5em; left: 1em; bottom: 2.8em;}
  .rec_sec04 .list01 li:nth-child(4) .img02 { width: 2.5em; right: 1em; bottom: 2.8em;}
  .rec_sec04 .list01 li:nth-child(5) .img01 { width: 3em; left: 2em;}

  .rec_sec05 .list01 { gap: 50px 7%;}
  .rec_sec05 .list01 li { width: calc((100% - 7%) / 2);}
  .rec_sec05 .list01 figure:before { left: -10px; bottom: -10px; right: 10px; top: 10px;}
  .rec_sec05 .list01 figure:after { left: -5px; bottom: -5px; right: 5px; top: 5px;}

  .rec_sec06 .list01 { font-size: min(4.3vw,1.3em); flex-flow: column; gap: 0; max-width: 22em; margin: auto;}
  .rec_sec06 .list01 li:nth-child(even) { align-self: flex-end;}
  .rec_sec06 .list01 li:nth-child(1) { width: 13.94em;}
  .rec_sec06 .list01 li:nth-child(2) { width: 13.31em; margin: 0;}
  .rec_sec06 .list01 li:nth-child(3) { width: 13.38em; margin: 1em 0 0;}
  .rec_sec06 .list01 li:nth-child(4) { width: 14.19em; margin: 0;}
  .rec_sec06 .list01 li:nth-child(5) { width: 14em; margin: 1em 0;}
  .rec_sec06 .list01 li:nth-child(6) { width: 14.19em; margin: 0;}
  
  .rec_sec06 .bg01 { display: block; width: 48%; left: -25%; top: 37%;}
  .rec_sec06 .bg02 { display: block; width: 55%; right: -20%; bottom: 20%;}
  .rec_sec06 .ttl_box_center { transform: translateX(1.3em);}

  .rec_sec07 .scroll_wrap { margin: 0 -20px;}
  .rec_sec07 .list02 { gap: 1em; width: 41em; font-size: min(3vw,1em);}
  .rec_sec07 .list02 li { width: 13em;}

  .rec_sec08 dl { max-width: initial; margin: 0 0 0 2em; font-size: min(4vw,1em); margin-top: 3em;}
  .rec_sec08 dl:first-of-type { margin-top: 5em;}
  .rec_sec08 dt { width: 5em; top: 0; left: 0; transform: translate(-50%,-50%);}

  .rec_sec08 .bg05 { margin: -2em 1em -4.5em auto; font-size: min(4vw,1em);}

  .rec_sec09 .list01 { flex-flow: column; gap: 40px; font-size: 0.9em;}
}

@media only screen and (max-width: 400px) {
  .grad_wrap { height: 35em;}
}

@media only screen and (max-width: 400px) {
  .rec_sec05 .list01 li { width: 100%; max-width: 280px; margin: auto;}
  .rec_sec05 .bg02 { bottom: -3%;}
}


/* ----------------------------
	interview
---------------------------- */

.int_wrap .mainimage { padding: 30% 0 33%;}
.int_wrap .mainimage .cont1200 { flex-flow: column;}
.int_wrap .mainimage .box_inner { width: 100%; font-size: min(4.5vw,1.25em);}
.int_box01, .int_box02 { margin-bottom: 70px !important;}


/* ------------------------
	contact
------------------------ */

.contact_sec dl { display: block;}
.contact_sec dt, .contact_sec dd {
  display: block;
  border-bottom: none;
  padding: 0px;
}
.contact_sec dt {
  width: 100%;
  margin-bottom: 10px;
}
.contact_sec dt span {
  display: inline-block;
  vertical-align: middle;
  padding: 3px 5px;
  float: none;
  margin-left: 10px;
}

/* ------------------------
	投稿
------------------------ */

.post_pad { padding-top: 17%;}
.post_pad > header, .post_pad .archive_pad { padding: 20px 0;}

.blog_header h1, .blog_content h1 { font-size: 1.8em;}

.side_sec01 dd { font-size: 1.1em;}
.side_sec02 .cat_list { flex-flow: row; flex-wrap: wrap;}

.blog_related h2 { font-size: 1.8em;}

@media only screen and (max-width: 640px) {
  .post_pad { padding-top: 22%;}
}

/* ブロックエディタ用 */

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