@charset "utf-8";
:root{
  /* Base Font Size 1.0rem = 10px */
  font-size: 10px;

  /* フォントカラー */
  --font-primary: #222;
  --font-wht: #fff;
  --font-red: #b10102;
  --font-red_light: #fcebeb;

  --bg-a: #fff; /* 背景_白 */
  --bg-b: #c20118; /* 背景_赤 */
  --bg-c: #222; /* 背景_黒 */

  --ff: "Noto Sans JP", sans-serif;
  --ff_serif: "Noto Serif JP", serif;
  --ff-en: "Roboto Condensed", sans-serif;
}
/* 320対応（374以下は、ルートベースフォントサイズを9pxに） */
@media screen and (max-width: 374px){
    :root{
        font-size: 8px;
    }
}
*{box-sizing: border-box;}
html{
  scroll-behavior: smooth;
}
body {
  position: relative;
  background: var(--bg-a);
  font-family: var(--ff);
  font-size: 1.6rem;
  line-height: 1.8;
  color: var(--font-primary);
  overflow-x: hidden;
}
img{
  width: 100%;
  height: auto;
}
p{
  position: relative;
  text-align: justify;
  font-size: 1.6rem;
}
a,
a:hover,
a:hover img {
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  text-decoration: none;
}
a:hover img{opacity: 0.9;}
ul,ol{
  padding-inline-start: 0;
  list-style-position: inside;
}

main{margin-top: 80px;}

.sec{padding: 60px 0;}

.wrap_full{
  position: relative;
  width: 100%;
}
.wrapper{
  /* box-sizing: border-box; */
  max-width: 980px;
  width: 92.1875%;
  margin-inline: auto;
}
.wrap720{
  max-width: 720px;
  width: 100%;
  margin-inline: auto;
}

.item_container,
.item_container_r{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.item_container_r{
  flex-direction: row-reverse;
}
.itembox02{width: 48%;}
.itembox03{width: 32%;}
.itembox04{width: 23%;}

.pc_case{display: block;}
.sp_case{display: none;}

@media (min-width: 751px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

@media (max-width: 768px) {
  main{margin-top: 60px;}

  p{font-size: 1.6rem;}
  .pc_case{display: none;}
  .sp_case{display: block;}
  .itembox02,
  .itembox03,
  .itembox04{
    width: 100%;
  }
  .sec{padding: 30px 0;}
}

/* ==============================
    共通設定
=============================== */
.bg_blk{background: var(--bg-c);}
.color_red{color: var(--font-red);}
.font_s{font-size: 1.3rem;}
.font_m{font-size: 1.8rem;}
.text_c{text-align: center;}
.text_r{text-align: right;}
.mb10{margin-bottom: 10px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb50{margin-bottom: 50px;}
.border_gry{border: 1px solid #ccc;}

@media (max-width: 768px) {

}

/* ==============================
    home MV
=============================== */
/* #mv{margin-top: 80px;} */
.home_cta .item_container{
  align-items: center;
}
.home_cta{
  background: var(--bg-c);
  padding: 20px 0;
}
.home_cta dt{
  width: 45%;
  color: var(--font-wht);
}
.home_cta dd{
  width: 55%;
  display: flex;
  justify-content: space-between;
  gap: 5%;
}
.cta_btn,
.cta_btn:visited{
  width: 50%;
  display: inline-block;
  background: var(--bg-b);
  color: var(--font-wht);
  text-align: center;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 2.4;
  border-radius: 0.3em;
}
.cta_btn:hover{
  color: var(--font-wht);
  opacity: 0.8;
}
/* @media (max-width: 959px) {
  #mv{margin-top: 66px;}
}
@media (max-width: 768px) {
  #mv{margin-top: 145px;}
} */

/* ==============================
    タイトル
=============================== */
.title_sub,
.title_sub_wht,
.title_sub_c{
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.4;
}
.title_sub_wht{color: var(--font-wht);}
.title_sub_c{text-align: center;}
.title_sub02{
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 30px;
}
.title_main,
.title_main_wht,
.title_main_whtall,
.title_other,
.title_main_c{
  font-family: var(--ff-en);
  font-size: 12rem;
  font-weight: 700;
  line-height: 1.0;
  letter-spacing: -1px;
  margin-bottom: 40px;
}
.title_main_wht,
.title_main_whtall{
  color: var(--font-wht);
}
.title_other{margin-bottom: 0;}
.title_main_c{text-align: center;}

.title_main::first-letter,
.title_main_wht::first-letter,
.title_other::first-letter,
.title_main_c::first-letter{
  color: var(--font-red);
}
.title_main span,
.title_other span{
  color: var(--font-red);
}
.title_maru{
  position: relative;
  font-size: 4.0rem;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 20px;
  z-index: 1;
}
.title_maru::before{
  content: "";
  position: absolute;
  top: 0;
  left: -15px;
  background: rgba(175,1,2,0.15);
  border-radius: 50%;
  width: 60px;
  height: 60px;
  z-index: -1;
}
.title_maru span{font-size: 3.2rem;}

.title_service{
  font-size: 3.2rem;
  font-weight: 600;
  line-height: 1.8;
}
.title_service span{
  color: var(--font-red);
  background: linear-gradient(transparent 80%, rgba(175,1,2,0.3) 80%);
}
.back_slash,
.back_slash_blk_c{
  position: relative;
  display: inline-block;
  text-align: center;
  color: var(--font-red);
  font-size: 1.8rem;
  font-weight: 600;
  padding: 0 20px;
}
.back_slash_blk_c{
  color: var(--font-primary);
  margin: auto;
}
.back_slash::before,
.back_slash::after,
.back_slash_blk_c::before,
.back_slash_blk_c::after{
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 30px;
  height: 2px;
  background: var(--bg-b);
}
.back_slash_blk_c::before,
.back_slash_blk_c::after{
  background: var(--bg-c);
}
.back_slash::before,
.back_slash_blk_c::before{
  left: -10px;
  transform: rotate(60deg);
}
.back_slash::after,
.back_slash_blk_c::after{
  right: -10px;
  transform: rotate(-60deg);
}

.sub_title_c{
  text-align: center;
  font-size: 3.0rem;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 30px;
}
.title_linered{
  border-left: 5px solid var(--bg-b);
  font-size: 3.0rem;
  font-weight: 700;
  line-height: 1.4;
  padding-left: 20px;
  margin-bottom: 20px;
}
.title_linered span{
  display: block;
  font-size: 2.4rem;
}
.title_serif{
  font-family: var(--ff_serif);
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 20px;
}
.underline_red{
  background: linear-gradient(transparent 70%, rgba(175,1,2,0.3) 70%);
  background-size: 100% 0.6em;
  background-repeat: no-repeat;
  background-position: 0 70%;
}
.grad_red{
  background-image: linear-gradient(90deg, rgba(134, 0, 1, 1), rgba(177, 1, 2, 1));
  color: var(--font-wht);
  font-size: 4.0rem;
  font-weight: 500;
  line-height: 1.8;
  padding: 0 15px;
}
.title_linebottm{
  position: relative;
  color: var(--font-red);
  font-size: 3.2rem;
  font-weight: 700;
  margin-bottom: 30px;
}
.title_linebottm::before{
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0;
  border-bottom: 5px solid var(--bg-b);
  width: 32px;
}
.subtitle_red{
  color: var(--font-red);
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 10px;
}

@media (max-width: 768px) {
  .title_sub,
  .title_sub_wht{
    font-size: 2.0rem;
  }
  .title_main,
  .title_main_wht,
  .title_main_whtall,
  .title_other,
  .title_main_c{
    font-size: 7.0rem;
    margin-bottom: 20px;
  }
  .title_maru{font-size: 3.2rem;}
  .title_service{
    font-size: 2.8rem;
    line-height: 1.6;
  }
  .back_slash::before,
  .back_slash::after{
    top: 65%;
  }
  .title_linered span{font-size: 2.0rem;}
  .grad_red{
    display: inline-block;
    font-size: 2.4rem;
    line-height: 1.6;
    margin-bottom: 10px;
    padding: 0 10px;
  }
}

/* ==============================
    共通ボタン
=============================== */
.btn_red,
.btn_red02{
  position: relative;
  display: block;
  background: var(--bg-b);
  border-radius: 25px;
  max-width: 380px;
  width: 90%;
  color: var(--font-wht);
  font-size: 1.8rem;
  padding: 0 20px;
  line-height: 50px;
  margin: 50px auto;
}
.btn_red02{
  max-width: 300px;
  width: 100%;
  margin: 30px auto 0 0;
}
.btn_red::before,
.btn_red02::before{
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 12px;
  height: 12px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}
.btn_red:hover,
.btn_red02:hover{
  color: var(--font-wht);
  background: #444;
}
.btn_red:visited,
.btn_red02:visited{
  color: var(--font-wht);
}
@media (max-width: 768px) {
  #home_news .btn_red{
    margin: 0 auto;
  }
}

/* 数字で見るSTABBLE */
#data{
  /* box-sizing: border-box; */
  background: var(--bg-c);
  border-top: 1px solid rgba(255,255,255,0.5);
  border-bottom: 1px solid rgba(255,255,255,0.5);
}
.datebox{
  /* box-sizing: border-box; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 25%;
  border-right: 1px solid rgba(255,255,255,0.5);
  padding: 20px;
}
.datebox:first-child{
  border-left: 1px solid rgba(255,255,255,0.5);
}
.title_date{
  border-left: 5px solid var(--bg-b);
  color: var(--font-wht);
  font-size: 2.4rem;
  line-height: 1.2;
  padding-left: 10px;
}
.title_date02{
  text-align: center;
  color: var(--font-wht);
  font-size: 2.4rem;
  line-height: 1.4;
  margin-top: auto;
}
.date_big{font-size: 6.0rem;}
.date_icon{
  display: block;
  width: 60%;
  margin: 10px auto;
}
@media (max-width: 768px) {
  .datebox{
    display: block;
    width: 50%;
    padding: 20px 10px;
  }
  .datebox:first-child,
  .datebox:nth-child(2){
    border-left:none;
    border-bottom: 1px solid rgba(255,255,255,0.5);
  }
  .title_date{padding-left: 5px;}
  .title_date02{font-size: 2.0rem;}
  .date_big{font-size: 4.0rem;}
}

/* home_onayami */
#home_onayami{
  padding: 40px 0 0;
}
.title_onayami{
  text-align: center;
  font-size: 5.0rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 30px;
}
.onayami_bg{
  position: relative;
  background: var(--bg-c);
  padding: 15px 0;
}
.onayami_bg::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 40px solid var(--bg-c);
  border-right: 50px solid transparent;
  border-left: 50px solid transparent;
}

.onayami_bg .item_container {
  /* box-sizing: border-box; */
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0;
}
.onayami_box{
  background: var(--bg-a);
}

.onayami_box:first-child,
.onayami_box:last-child {
  width: 14%;
  min-width: 100px;
}
.onayami_box:first-child {
  border-radius: 0 20px 20px 0;
  background: url(../images/onayami_img_left.jpg) no-repeat top right /cover;
}
.onayami_box:last-child {
  border-radius: 20px 0 0 20px;
  background: url(../images/onayami_img_right.jpg) no-repeat top left / cover;
}
.onayami_box:nth-child(2) {
  /* box-sizing: border-box; */
  max-width: 980px;
  width: 70%;
  border-radius: 20px;
  flex-shrink: 1;
  padding: 10px 20px;
}
ul.onayami_txtbox{
  list-style: none;
}
ul.onayami_txtbox li,
.icon_question{
  position: relative;
  font-size: 2.4rem;
  padding-left: 35px;
  margin-bottom: 10px;
}
ul.onayami_txtbox li:last-of-type{
  margin-bottom: 0;
}
ul.onayami_txtbox li::before,
.icon_question::before{
  content: "";
  position: absolute;
  top: 10px;
  left: 0;
  width: 28px;
  height: 28px;
  background: url(../images/onayami_icon.svg) no-repeat;
  background-size: contain;
}
ul.onayami_txtbox li span{
  color: var(--font-red);
  font-weight: 700;
}
.onayami_box.item_container{
  align-items: center;
}
.onayami_txtbox:first-child{
  width: 73%;
}
.onayami_txtbox:last-child{
  width: 25%;
}

@media (max-width: 768px) {
  #home_onayami{
    padding: 20px 0 0;
  }
  .title_onayami{
    display: inline-block;
    text-align: left;
    font-size: 3.2rem;
    margin-bottom: 20px;
  }
  .title_onayami_img{
    float: right;
    width: 25%;
  }
  .onayami_bg{
    padding: 15px;
  }
  .onayami_box:first-child,
  .onayami_box:last-child,
  .onayami_txtbox:last-child{
    display: none;
  }
  .onayami_box:nth-child(2),
  .onayami_txtbox:first-child{
    width: 100%;
  }
  ul.onayami_txtbox li{
    text-align: justify;
    font-size: 2.0rem;
  }
}

/* service */
#home_service{
  padding: 60px 0 0;
  background: url(../images/service_bg.gif);
}

/* #home_service_media */
#home_service_media .itembox03,
#media_support .itembox03{
  position: relative;
  z-index: 1;
}
#home_service_media .itembox03.no01::before,
#media_support .itembox03.no01::before{
  content: "01";
}
#home_service_media .itembox03.no02::before,
#media_support .itembox03.no02::before{
  content: "02";
}
#home_service_media .itembox03.no03::before,
#media_support .itembox03.no03::before{
  content: "03";
}
#home_service_media .itembox03.no01::before,
#home_service_media .itembox03.no02::before,
#home_service_media .itembox03.no03::before,
#media_support .itembox03.no01::before,
#media_support .itembox03.no02::before,
#media_support .itembox03.no03::before{
  position: absolute;
  bottom: -90px;
  right: 0;
  color: rgba(175,1,2,0.1);
  font-family: var(--ff-en);
  font-size: 18.0rem;
  font-weight: 700;
  pointer-events: none;
  z-index: 0;
}
.fukidashi_red{
  position: relative;
  background: var(--bg-b);
  color: var(--font-wht);
  text-align: center;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 1.4;
  padding: 10px 10px 15px;
}
.fukidashi_red span{
  font-size: 2.0rem;
}
.fukidashi_red::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 20px solid var(--bg-b);
  border-right: 20px solid transparent;
  border-left: 20px solid transparent;
}

.service_iconimg{
  position: relative;
  display: block;
  width: 50%;
  height: auto;
  margin: 20px auto;
}
.icon_check{
  position: relative;
  font-size: 1.8rem;
  font-weight: 700;
  padding-left: 28px;
}
.icon_check::before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 28px;
  height: 28px;
  background: url(../images/icon_check.svg) no-repeat;
  background-size: contain;
}

@media (max-width: 768px) {
  #home_service{
    padding: 60px 0 5px;
  }
  #home_service_media .itembox03{
    margin-bottom: 30px;
  }
  #home_service_media .itembox03.no01::before, #home_service_media .itembox03.no02::before, #home_service_media .itembox03.no03::before{
    bottom: -110px;

  }
}

/* #home_service_google */
#home_service_google{
  background: url(../images/service_google_bg.png) no-repeat center center / cover;
  padding: 60px 0 5px;
}
.maru_point,
.maru_point_light{
  position: relative;
  width: 32%;
  aspect-ratio: 1 / 1;
  background: #444;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: var(--font-wht);
  text-align: center;
  font-size: 2.4rem;
  line-height: 1.4;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);
}
.maru_point_light{
  background: #ddd;
  box-shadow:none;
  color: var(--font-primary);
  font-size: 2.4rem;
  font-weight: 800;
}
.maru_point::before{
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  border: 2px solid #fff;
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
}
.txt_big{
  font-size: 5.0rem;
  font-weight: 700;
}
.txt_big b,
.txt_m{
  font-size: 3.4rem;
  font-weight: 700;
  white-space: nowrap;
}
.txt_m b{
  font-size: 2.4rem;
  font-weight: 500;
}
@media (max-width: 768px) {
  .maru_point,
  .maru_point_light{
    width: 70%;
    margin: 0 auto 20px;
  }

}

/* #home_service_sns */
#home_service_sns{
  padding: 60px 0;
}
#home_service_sns .maru_point_light img,
#sns_support .maru_point_light img{
  display: block;
  width: 45%;
  margin: 0 auto 5px;
}
@media (max-width: 768px) {
  #home_service_sns{
    padding: 40px 0 0;
  }
}

/* home_case */
#home_case{
  background: var(--bg-c);
  padding: 60px 0;
}
#home_case a.itembox03{
  color: var(--font-wht);
}
.casebox_img{
  position: relative;
  margin-bottom: 5px;
}
.case_circle{
  box-sizing: border-box;
  position: absolute;
  bottom: 20px;
  left: 10px;
  width: 105px;
  aspect-ratio: 1 / 1;
  background: var(--bg-b);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--font-wht);
  font-size: 2.0rem;
  font-weight: 700;
  line-height: 1.4;
  padding: 10px;
}
.case_circle span{
  font-size: 1.6rem;
}
.title_case{
  text-align: justify;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  transition: color 0.3s ease;
}
.btn_case{
  box-sizing: border-box;
  position: relative;
  border: 1px solid #fff;
  line-height: 1.4;
  padding: 5px 10px;
  margin-top: 10px;
  transition: color 0.3s ease;
}
.btn_case::before{
  content: '';
  position: absolute;
  top: 50%;
  right: 20px;
  width: 12px;
  height: 12px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}
.itembox03:hover .title_case{
  color: var(--font-red_light);
}
.itembox03:hover .btn_case{
  /* border: 1px dashed var(--font-red_light); */
  background: #444;
  color: var(--font-red_light);
}

@media (max-width: 768px) {
  #home_case{
    padding: 40px 0 5px;
  }
  #home_case a.itembox03{
    margin-bottom: 30px;
  }
  #home_case a.itembox03:last-child{
    margin-bottom: 0;
  }
}

/* #home_morgen */
#home_morgen{
  position: relative;
  overflow: hidden;
  background-image: linear-gradient(144deg, rgba(124, 0, 1, 1), rgba(177, 1, 2, 1) 50%, rgba(124, 0, 1, 1));
  padding: 60px 0;
  z-index: 0;
}
#home_morgen::before,
#home_morgen::after{
  content: "";
  position: absolute;
  z-index: 0;
}
#home_morgen::before{
  top: 0;
  left: 0;
  background: url(../images/morgen_bg_left.png) no-repeat top left / contain;
  width: 500px;
  height: 650px;
}
#home_morgen::after{
  bottom: 200px;
  right: 0;
  background: url(../images/morgen_bg_right.png) no-repeat top left / contain;
  width: 300px;
  height: 560px;
}
.morgen_flow {
  position: absolute;
  bottom: -50px;
  width: 200%;
  display: flex;
  white-space: nowrap;
  z-index: 1;
}
.morgen_txt{
  font-family: var(--ff-en);
  font-size: 18.5rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.1);
  flex-shrink: 0;
  animation: scroll-left 60s linear infinite;
  line-height: 1.2;
}
@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}
#home_morgen .wrapper{
  position: relative;
  z-index: 3;
}
.morgen_img{
  display: block;
  max-width: 835px;
  width: 90%;
  margin-bottom: 300px;
}
.morgen_box{
  position: absolute;
  bottom: -250px;
  right: 0;
  width: 510px;
  height: auto;
  background: var(--bg-a);
  padding: 40px;
}

@media (max-width: 768px) {
  #home_morgen{
    padding: 0 0 70px;
  }
  #home_morgen .wrapper{
    width: 100%;
  }
  .morgen_flow{
    bottom: -30px;
  }
  .morgen_txt{
    font-size: 10.0rem;
  }
  .morgen_img{
    max-width: 100%;
    width: 100%;
    margin-bottom: 0;
  }
  .morgen_box{
    position: static;
    display: block;
    width: 100%;
    padding: 20px;
  }
}

/* #home_com */
#home_com{
  background: url(../images/dot_bg.png);
  padding: 60px 0;
}
.title_homecom{
  margin-bottom: 20px;
}
#home_com .item_container_r,
#home_com .item_container{
  background: var(--bg-a);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);
  align-items: flex-end;
  line-height: 0;
  margin-top: 40px;
}
#home_com .item_container_r .com_box{
  padding: 30px 0 30px 30px;
}
#home_com .item_container .com_box{
  padding: 30px 30px 30px 0;
}
#home_com .com_box h2,
#home_com .com_box h3,
#home_com .com_box p{
  line-height: 1.6;
}
#home_com .com_box .title_serif{
  font-size: 2.2rem;
}

@media (max-width: 768px) {
  #home_com{
    padding: 40px 0;
  }
  #home_com .item_container_r .com_box,
  #home_com .item_container .com_box{
    padding: 20px;
  }
  .title_homecom{
    margin-bottom: 10px;
  }
}

/* #home_news */
#home_news{
  padding: 60px 0;
}
.tabnews_line{
  position: relative;
}
.tabnews_line::before,
.tabnews_line::after{
  content: "";
  position: absolute;
  top: 48px;
  background: #ccc;
  width: 20px;
  height: 2px;
}
.tabnews_line::before{
  left: -20px;
}
.tabnews_line::after{
  right: -20px;
}
/* タブ */
.tab_news {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.tab_news::after{
  content: "";
  display: block;
  order: -1;
  width: 100%;
  height: 2px;
  background: #ccc;
}
.tab_news > label {
  /* flex: 1 1; */
  order: -1;
  width: 24%;
  background-color: #eee;
  border-left: 2px solid #ccc;
  border-top: 2px solid #ccc;
  border-right: 2px solid #ccc;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  color: #222;
  font-size: .9em;
  text-align: center;
  cursor: pointer;
  padding: .8em 1em .7em;
  margin-right: 0.25%;
  margin-bottom: -2px;
  -webkit-tap-highlight-color: transparent;
}
.tab_news > label:last-of-type {
  margin-right: 0;
}
.tab_news > label:hover {
  opacity: .8;
}
.tab_news input {
  display: none;
}
.tab_news > div {
  display: none;
  width: 100%;
  padding: 1.5em 1em;
  background-color: #fff;
}

.tab_news label:has(:checked) {
  position: relative;
  background-color: #fff;
  border-left: 2px solid #ccc;
  border-top: 2px solid #ccc;
  border-right: 2px solid #ccc;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  color: var(--font-red);
  z-index: 1;
}

.tab_news label:has(:checked) + div {
  display: block;
}
#home_news .tab_news .item_container,
#news_archive .newsArchive{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 2%;
  width: 100%;
}
.newsbox,
.newsbox_archive{
  width: 32%;
  border: 1px solid #ccc;
}
#news_archive .newsbox,
.newsbox_archive{
  margin-bottom: 20px;
}
#news_archive .newsArchive img,
.newsbox img {
  width: 100%;
  height: 200px;/* 3:2 */
  object-fit: cover;
  object-position: center;
  display: block;
}
a.newsbox_archive .newsbox_txt,
.newsbox_txt{
  padding: 10px!important;
}
#news_archive .newsArchive time,
.newsbox_txt time{
  color: #666;
  font-size: 1.3rem;
}
.title_newsbox,
.newsbox_txt p{
  text-align: justify;
  line-height: 1.6;
}
.title_newsbox{
  color: var(--font-primary);
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 5px;
}
.newsbox_txt p{
  color: #777;
  font-size: 1.4rem;
}
.btn_newmore{
  position: relative;
  display: block;
  border: 1px solid #ccc;
  width: 80%;
  color: #777;
  text-align: center!important;
  line-height: 36px!important;
  margin: 10px auto 0;
}
.btn_newmore::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  margin: auto;
  border-top: 2px solid #ccc;
  border-right: 2px solid #ccc;
  transform: translateY(-50%) rotate(45deg);
}
.newsbox:hover,
.newsbox:hover .title_newsbox{
  background: var(--font-red_light);
  color: var(--font-red);
}
.newsbox:hover .newxbox_txt p{
  color: var(--font-primary);
}
.newsbox:hover .btn_newmore{
  background: var(--bg-a);
}


/* news_archive */
#news_archive{
  margin-top: 120px;
}

/* #news_archive .newsArchive{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
  gap: 3rem;
  margin: 0;
  padding: 0;
} */
a.newsbox_archive{
  color: var(--font-primary);
  border: 1px solid #ccc;
}
a.newsbox_archive:hover{
  background: var(--font-red_light);
  color: var(--font-red);
}



/* #news_detail */
#news_detail{
  margin-top: 80px;
  padding: 20px 0 60px;
}
.news_detailbox{
  padding: 30px;
}
.news-title{
  border-left: 5px solid var(--bg-b);
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  font-weight: 700;
  line-height: 1.4;
  padding-left: 20px;
  margin: 20px 0;
}
.news-meta{
  display: inline-block;
  border: 1px solid #ccc;
  color: #888;
  font-size: 1.4rem;
  padding: 3px 5px;
  margin-bottom: 1em;
}
.news-navigation{
  margin-top: 30px;
}
.nav-subtitle{font-size: 1.4rem;}
.nav-subtitle{font-size: 1.3rem;}

@media (max-width: 768px) {
  .news-title{padding-left: 10px;}
}

/* パンクズ */
.aioseo-breadcrumb {
  font-size: 1.3rem!important;
  margin-bottom: 1em;
}
.aioseo-breadcrumb a {
  color: #888;
  text-decoration: none;
}
.breadcrumb a:hover {
  text-decoration: underline;
}

/* #news_detail 本文 */
#news_detail h2{
  font-size: 2.4rem;
  font-weight: 500;
  margin-bottom: 1em;
}
#news_detail h3{
  font-size: 2.0rem;
  font-weight: 500;
  border-bottom: 1px solid var(--bg-b);
  margin-bottom: 1em;
}


@media (max-width: 768px) {
  #news_detail{
  padding: 10px 0 40px;
  }
  .newsbox_archive{width: 48%;}
  .news_detailbox{
    padding: 20px 10px;
  }
}
@media screen and (max-width: 480px) {
  #news_archive .newsArchive {
    grid-template-columns: 1fr;
  }
}


/* ページネーション */
.pagination {
  text-align: center; /* 中央寄せ */
  margin: 40px 0;    /* 上下の余白 */
}
.pagination a,
.pagination span {
  display: inline-block;
  margin: 0 5px;
  padding: 8px 12px;
  color: var(--font-primary);
  background-color: #f5f5f5;
  text-decoration: none;
  transition: background-color 0.2s;
}
.pagination a:hover {
  background-color: var(--bg-b);
  color: #fff;
}
.pagination .current {
  background-color: var(--font-red_light);
  font-weight: bold;
}

@media (max-width: 768px) {
  .tabnews_line::before,
  .tabnews_line::after{
    width: 100vw;
  }

  .newsbox{
    width: 100%;
    margin-bottom: 20px;
  }
  .newsbox:last-of-type{
    display: none;
  }
  .tab_news > label {
    width: 49%;
    padding: .7em .5em .5em;
    margin-right: 2%;
  }
  .tab_news > label:first-of-type,
  .tab_news > label:nth-of-type(2){
    margin-bottom: 10px;
  }
  .tab_news > label:nth-of-type(2n) {
    margin-right: 0;
  }
}

/* footer */
/* foter_contact */
#foot_contact{
  background-image: linear-gradient(180deg, rgba(177, 1, 2, 1), rgba(125, 1, 1, 1));
  padding: 60px 0;
}
.title_footcontact{
  color: var(--font-wht);
  text-align: center;
  font-size: 1.8rem;
  font-weight: 400;
  margin-bottom: 70px;
}
.foot_contactbox{
  position: relative;
  width: 31%;
  background: var(--bg-a);
  color: var(--font-primary);
  padding: 20px;
  z-index: 1;
}
.foot_contactbox:hover,
.foot_contactbox:hover .foot_icon{
  background: var(--font-red_light);
}
.foot_contactbox:visited{
  color: var(--font-primary);
}
.foot_icon{
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-a);
  border-radius: 50%;
  width: 84px;
  height: 84px;
  z-index: 0;
}
.foot_icon img{
  display: block;
  width: 38px;
  height: 38px;
  margin: 10px auto 0;
}
.subtitle_foot{
  position: relative;
  border-bottom: 2px solid var(--bg-b);
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 20px;
}
.subtitle_foot::before{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  width: 16px;
  height: calc(tan(60deg) * 16px / 2);
  background: var(--bg-b);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.foot_contactbox p{
  font-size: 1.6rem;
  line-height: 1.4;
}
.btn_grad{
  background-image: linear-gradient(90deg, rgba(177, 1, 2, 1), rgba(125, 1, 1, 1));
  border-radius: 30px;
  color: var(--font-wht);
  text-align: center;
  font-size: 1.6rem;
  line-height: 1.2;
  padding: 10px;
  margin-top: 15px;
}
.foot_tel{
  color: var(--font-red);
  text-align: center;
  font-size: 3.2rem!important;
  font-weight: 600;
}
.foot_teltxt{
  text-align: center;
  font-size: 1.3rem!important;
}

footer{
  background: #eee;
  padding: 50px 0 0;
}
.foot_logo{
  display: block;
  width: 200px;
  margin: 0 auto 20px;
}
footer nav{
  text-align: center;
  margin-bottom: 30px;
}
footer nav a{
  position: relative;
  display: inline-block;
  color: var(--font-primary);
  font-size: 1.5rem;
  margin-right: 1em;
}
footer nav a:last-of-type{
  margin-right: 0;
}
footer nav a:hover{
  color: var(--font-red);
}
.copy{
  background: var(--bg-c);
  color: var(--font-wht);
  text-align: center;
  font-size: 1.4rem;
  padding: 15px 0;
}
@media (max-width: 768px) {
  footer{
    padding: 40px 0 50px;
  }
  .foot_contactbox{
    width: 100%;
    margin-bottom: 50px;
  }
}

/* サイドボタン */
.btn_side_sp{
  display: none;
}
a.btn_sidemaru,
a:visited.btn_sidemaru{
  position: fixed;
  right: 20px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--bg-b);
  text-align: center;
  color: var(--font-wht);
  font-size: 1.3rem;
  font-weight: 500;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  cursor: pointer;
  z-index: 9999;
}
.btn_sidemaru.top {
  top: 100px;
}
.btn_sidemaru.bottom {
  top: 200px;
}
a.btn_sidemaru img{
  display: block;
  width: 40%;
  margin: 10px auto 0;
}

/* スマホ SP headボタン */
@media (max-width: 768px) {
  .btn_side{display: none;}
  .btn_side_sp{
    position: fixed;
    bottom: 0;
    display: block;
    background: var(--bg-c);
    width: 100%;
    height: 82px;
    padding: 10px;
    z-index: 1000;
  }
  .btn_sparea:visited,
  .btn_sparea{
    width: 30%;
    border: 1px solid var(--bg-a);
    text-align: center;
    color: var(--font-wht);
    font-size: 1.2rem;
    padding: 3px;
  }
  .btn_sparea img{
    display: block;
    width: 25%;
    margin: 0 auto 2px;
  }
  .btn_sparea b{
    display: block;
    font-size: 1.4rem;
    margin-top: -2px;
  }
}


/* ==============================
    下層ページ
=============================== */
.other_mv{
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.other_mv h1{
  color: var(--font-wht);
  text-align: center;
  font-size: 5.0rem;
  font-weight: 700;
  line-height: 1.3;
}
.other_mv h1 span{
  display: block;
  font-size: 2.4rem;
  font-weight: 400;
  letter-spacing: 0.15em;
}
.mv_company,
.mv_morgen,
.mv_media,
.mv_google,
.mv_sns,
.mv_recruit,
.mv_whitepaper{
  min-height: 360px;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  /* margin-top: 80px; */
}
.mv_company{
  background-image: url(../images/company/mv_company.jpg);
}
.mv_morgen{
  background-image: url(../images/company/mv_company_morgen.jpg);
}
.mv_media{
  background-image: url(../images/service/media/mv_media.jpg);
}
.mv_google{
  background-image: url(../images/service/google/mv_google.jpg);
}
.mv_sns{
  background-image: url(../images/service/sns/mv_sns.jpg);
}
.mv_recruit{
  background-image: url(../images/recruit/mv_recruit.jpg);
}
.mv_whitepaper{
  background-image: url(../images/whitepaper/mv_whitepaper.jpg);
}

@media (max-width: 768px) {
  .mv_google{background-position: center right;}
}

/* ==============================
    企業情報
=============================== */
#move_com{
  padding: 60px 0;
}
#move_com video {
  width: 100%;
  height: auto;
  display: block;
}

/* 代表メッセージ */
#message{
  padding: 0 0 60px;
}
.message_box{
  border: 2px solid var(--bg-b);
  display: flex;
  flex-direction: column;
  width: 49%;
  text-align: center;
  padding: 20px;
  margin-bottom: 20px;
}
.message_box h4{
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 1.4;
  margin-bottom: 10px;
}
.message_box h4 span{
  color: var(--font-red);
  font-size: 3.0rem;
  font-weight: 700;
}
.message_box h4 b{
  display: block;
  font-size: 1.5rem;
  font-weight: 500;
}
.message_box p{
  display: block;
  text-align: center;
  margin-top: auto;
}
.message_name{
  text-align: right;
  font-family: var(--ff_serif);
  font-size: 1.6rem;
  font-weight: 600;
  margin-top: 30px;
}

@media (max-width: 768px) {
  .message_box{
    width: 100%;
    padding: 10px;
  }
  .message_box p{
    font-size: 1.5rem;
  }
}

/* 会社概要 */
#overview{
  background: var(--bg-b);
  color: var(--font-wht);
  padding: 60px 0;
}
.wht_box{
  background: rgba(255, 255, 255, 0.85);
  padding: 50px 100px;
}
#overview table{
  width: 100%;
}
#overview table tr,
#history table tr{
  border-bottom: 1px solid #999;
}
#overview table th,
#overview table td,
#history table th,
#history table td{
  box-sizing: border-box;
  color: var(--font-primary);
  text-align: left;
  font-size: 1.6rem;
  padding: 30px 10px;
}
#overview table th,
#history table th{
  width: 30%;
  font-weight: 700;
}
#overview table td,
#history table td{
  width: 70%;
}

@media (max-width: 768px) {
  .wht_box{padding: 20px;}
  #overview table th,
  #overview table td,
  #history table th,
  #history table td{
    display: block;
    width: 100%;
  }
  #overview table th,
  #history table th{
    padding: 20px 10px 10px;
  }
  #overview table td,
  #history table td{
    padding: 0 10px 20px;
  }
}

/* 沿革 */
#history{
  padding: 60px 0;
}
.title_history{
  font-size: 1.8rem;
  font-weight: 600;
}

/* モルゲン事業部 */
#morgen_message{
  padding: 60px 0;
}
.morgenbox:first-child{
  width: 20%;
}
.morgenbox:last-child{
  width: 80%;
}
.title_tatered{
  writing-mode: vertical-rl;
  color: var(--font-red);
  font-family: var(--ff_serif);
  font-size: 4.0rem;
  font-weight: 600;
}
@media (max-width: 768px) {
  .morgenbox:first-child,
  .morgenbox:last-child{
    width: 100%;
  }
  .morgenbox:first-child{
    display: flex;
    justify-content:center;
    margin-bottom: 20px;
  }
}

#boshu{
  background: var(--bg-b);
  padding: 40px 0;
}
.boshu_box:first-child{
  width: 32%;
}
.boshu_box:last-child{
  width: 65%;
}
.back_slash_wht{
  position: relative;
  display: inline-block;
  text-align: center;
  color: var(--font-wht);
  font-size: 3.0rem;
  font-weight: 600;
  line-height: 1.5;
  padding: 0 20px;
  margin-bottom: 20px;
}
.back_slash_wht span{
  font-size: 2.4rem;
}
.back_slash_wht::before,
.back_slash_wht::after{
  content: "";
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 80px;
  height: 2px;
  background: var(--bg-a);
}
.back_slash_wht::before{
  left: -30px;
  transform: rotate(60deg);
}
.back_slash_wht::after{
  right: -30px;
  transform: rotate(-60deg);
}
.btn_boshu{
  display: block;
  background: var(--bg-a);
  border-radius: 30px;
  color: var(--font-red);
  text-align: center;
  font-size: 1.8rem;
  font-weight: 600;
  width: 300px;
  padding: 10px;
  margin: 20px auto 0;
  box-shadow: 3px 5px 7px rgba(0, 0, 0, 0.7);
}
#boshu p{
  color: var(--font-wht);
}
.btn_boshu:hover{
  background: var(--bg-c);
  color: var(--font-wht);
}
@media (max-width: 768px) {
  #boshu{padding: 20px 0 30px;}
  .boshu_box:first-child,
  .boshu_box:last-child{
    width: 100%;
  }
  .back_slash_wht{
    font-size:2.4rem
  }
  .back_slash_wht span{
    font-size: 2.0rem;
  }
  .back_slash_wht::before,
  .back_slash_wht::after{
    top: 80%;
    width: 55px;
  }
  .back_slash_wht::before{
    left: -20px;
  }
  .back_slash_wht::after{
    right: -20px;
  }
}

/* 店舗紹介 */
#morgen_shop .item_container{
  margin-bottom: 80px;
}
#morgen_shop .item_container:last-of-type{
  margin-bottom: 0;
}
.title_morgenshop{
  border-left: 10px solid var(--bg-b);
  font-family: var(--ff_serif);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.5;
  padding-left: 15px;
  margin-bottom: 20px;
}
.btn_tabelog,
.btn_hotpepper{
  position: relative;
  display: block;
  background: #f39800;
  color: var(--font-wht);
  padding: 10px 15px;
  margin-top: 20px;
}
.btn_hotpepper{
  background: #d0101b;
}
.btn_tabelog::before,
.btn_hotpepper::before{
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: url(../images/company/icon_external.png) no-repeat;
  background-size: contain;
  vertical-align: middle;
}
.insta_url{
  position: relative;
  display: inline-block;
  color: #e4007f;;
  margin-top: 20px;
}
.insta_url::before{
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background-image: url(../images/company/icon_insta.png);
  background-size: contain;
  vertical-align: middle;
  margin-right: 10px;
}

/* ==============================
    サービス案内 メディア
=============================== */
.service_txt{
  font-size: 1.8rem;
}
.point_red{
  color: var(--font-red);
  font-weight: 600;
}
.onayami{
  background: var(--bg-c);
}
.title_onayami_left{
  color: var(--font-wht);
  font-size: 4.0rem;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 20px;
}
.onayami .itembox02:first-child{
  position: relative;
}
.onayami .itembox02:first-child::after{
  content: "";
  position: absolute;
  right: -35px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--bg-b);
  height: calc(tan(60deg) * 80px / 2);
  width: 30px;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.bg_gry{
  background: #eee;
  border-radius: 10px;
  padding: 20px;
}
.bg_grad{
  background-image: linear-gradient(180deg, rgba(177, 1, 2, 1), rgba(125, 1, 1, 1));
  border-radius: 10px;
  color: var(--font-wht);
  padding: 20px;
}
ul.bg_gry,
ul.icon_hanamaru{
  list-style-type: none;
}
ul.bg_gry li{
  position: relative;
  font-size: 2.0rem;
  padding-left: 30px;
  margin-bottom: 15px;
}
ul.bg_gry li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 26px;
  height: 26px;
  background: url(../images/service/icon_nayami.png) no-repeat;
  background-size: contain;
  vertical-align: middle;
}
.icon_hanamaru li{
  position: relative;
  color: var(--font-wht);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.6;
  padding-left: 80px;
  margin-bottom: 20px;
}
.icon_hanamaru li span{
  font-size: 1.8rem;
}
.icon_hanamaru li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 70px;
  height: 70px;
  background: url(../images/service/icon_hanamaru.svg) no-repeat;
  background-size: contain;
  vertical-align: middle;
}
.title_sub_yel{
  color: #fff100;
  font-size: 3.0rem;
  font-weight: 700;
  line-height: 1.5;
}
.onayami_msg .title_serif{
  text-align: center;
}

#media_support .icon_check{
  font-size: 2.4rem;
  line-height: 1.5;
  margin-bottom: 7px;
}
.list_disc li{
  list-style-type: none;
  font-size: 1.8rem;
}
.list_disc li::before{
  content: "";
  display: inline-block;
  background: var(--bg-c);
  border-radius: 50%;
  width: 14px;
  height: 14px;
  margin-right: 5px;
}

/* グルメサイトページ管理 */
#media_control .title_sub02{
  margin-bottom: 60px;
}
.media_controlbox.mediabox01{
  order: 1;
  width: 30%;
  padding: 0 10px;
}
.media_controlbox.mediabox02{
  order: 2;
  width: 40%;
}
.media_controlbox.mediabox03{
  order: 3;
  width: 30%;
  padding: 0 10px;
}
.media_controlbox h4{
  text-align: center;
  font-size: 2.2rem;
  font-weight: 500;
}
.media_controlbox p{
  font-weight: 500;
}
.icon_control{
  display: block;
  width: 80px;
  height: auto;
  margin: 0 auto 10px;
}
.mediabox_mb{
  margin-bottom: 50px;
}
.iphone_img{
  display: block;
  max-width: 225px;
  width: 80%;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .media_controlbox.mediabox02{
    width: 100%;
  }
  .media_controlbox.mediabox01{
    width: 49%;
    order: 2;
  }
  .media_controlbox.mediabox02{
    order: 1;
  }
  .media_controlbox.mediabox03{
    width: 49%;
    order: 3;
  }
  .mediabox_mb{
    margin-bottom: 40px;
  }
  .onayami .itembox02:first-child{
    margin-bottom: 20px;
  }

}

/* グルメサイトページ管理 */
.system_box01{
  margin-bottom: 100px;
}
.system_img{
  display: block;
  width: 90%;
  margin: 60px auto 30px;
}
.title_leftline{
  border-left: 4px solid var(--bg-b);
  font-size: 3.0rem;
  font-weight: 600;
  line-height: 1.4;
  padding-left: 10px;
}
#media_system .title_leftline{
  margin-bottom: 20px;
}

#media_system .icon_question{
  font-weight: 600;
}
.red_box{
  border-radius: 60px;
  background: var(--bg-b);
  text-align: center;
  color: var(--font-wht);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.4;
  padding: 7px 5px;
  margin-bottom: 20px;
}
#media_system .point_red{
  font-size: 1.8rem;
  font-weight: 800;
}
.redbox_point{
  background: rgba(175,1,2,0.15);
  border-radius: 10px;
  text-align: center;
  font-weight: 700;
  line-height: 1.6;
  padding: 15px;
}
.redbox_point span{
  color: var(--font-red);
  font-size: 4.0rem;
  font-weight: 700;
  line-height: 1.2;
}
.redbox_point span b{
  font-size: 6.0rem;
  font-weight: 700;
  line-height: 1.0;
  vertical-align: bottom;
}
#media_system ul{
  list-style: none;
  margin-top: 10px;
}
#media_system ul li{
  font-size: 2.1rem;
}
@media (max-width: 768px) {
  .system_box01{
    margin-bottom: 60px;
  }
  .system_img{
    width: 100%;
    margin: 30px auto 0;
  }
  #media_system .icon_question{
    font-size: 2.2rem;
  }
  #media_system .itembox02:first-child{
    margin-bottom: 20px;
  }
}

/* 導入の流れ */
.flow_bg{
  background: #eee;
}
#media_flow .item_container{
  margin-top: 60px;
}
#media_flow .flowbox h4{
  text-align: center;
  font-size: 2.0rem;
  font-weight: 700;
  margin-bottom: 5px;
}
.flowbox{
  position: relative;
  background: var(--bg-a);
  width: 22%;
  padding: 40px 15px 10px;
}
.flow_step{
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 80px;
  background-color: var(--bg-b);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--font-wht);
  text-align: center;
  font-weight: 600;
  font-size: 1.4rem;
  line-height: 1.2;
}
.flow_step span{
  font-size: 3.2rem;
}
.icon_flow{
  display: block;
  width: 70%;
  margin: 10px auto 15px;
}
@media (max-width: 768px) {
  .flowbox{
    width: 48%;
    padding: 40px 12px 10px;
  }
  .flowbox:nth-child(1),
  .flowbox:nth-child(2){
    margin-bottom: 50px;
  }
  #media_flow .flowbox h4{
    font-size: 1.7rem;
  }

}

/* よくある質問 */
.faqArea{
  position: relative;
  border-top: 1px solid #ccc;
  max-width: 640px;
  width: 92.1875%;
  margin: 0 auto;
}
.faqArea .faq_tab input {
  display: none;
}
.faqArea .faq_tab{
  border-bottom: 1px solid #ccc;
}
/*質問テキスト*/
.faqArea .faq_tab label{
  position: relative;
  /* border-bottom: 1px solid #ccc; */
  display: block;
  color: #666;
  font-weight: 600;
  padding: 1em 2.5em;
  margin: 0;
  cursor: pointer;
}
.faqArea .faq_tab .faq_tab_content p {
  margin: 1em;
}
.faqArea .faq_tab label:hover {
  color: var(--bg-b);
}
.faqArea .faq_tab input:radio ~ label {
  color: var(--bg-b);
}
.faqArea .faq_tab label::before {
  content: 'Q';
  position: absolute;
  top: 2px;
  left: 70px;
  color: #666;
  font-family: var(--ff-en);
  font-size: 3.0rem;
  margin-left: -2em;
  padding-right: 0.5em;
}

/* --質問の＋アイコン */
.faqArea .faq_tab label::after {
  content: '+';
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.7em;
  font-weight: bold;
  line-height: 2em;
  width: 2em;
  height: 2em;
  transition: transform 0.3s;
  transform-origin: center center;
}
/* 答え */
.faqArea .faq_tab .faq_tab_content {
  position: relative;
  overflow: hidden;
  max-height: 0;
  padding-left: 30px;
  transition: max-height 0.2s;
}
.faqArea .faq_tab .faq_tab_content::before {
  content: 'A';
  position: absolute;
  top: -10px;
  color: var(--font-red);
  font-family: var(--ff-en);
  font-size: 3.0rem;
  font-weight: 700;
  padding: 0;
  margin: 0.4em 0 0 -1em;
}
/* .faqArea .faq_tab .faq_tab_content {
  margin: 0 1em 1em;
} */
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.faqArea .faq_tab input[type="radio"]:checked + label + .faq_tab_content {
  max-height: 40em;
  margin: 0 1em 1em;
}
/* 質問をクリックした時のアイコンの動き */
.faqArea .faq_tab input[type="radio"]:checked + label {
  color: var(--font-red);
}
/* 質問をクリックした時の+の動き */
.faqArea .faq_tab input[type="radio"]:checked + label::after {
  transform: rotateZ(45deg);
  transform-origin: center center;
}

/* ==============================
    サービス案内 Google
=============================== */
.google_partner{
  border: 3px solid #0182c7;
  border-radius: 10px;
  max-width: 640px;
  width: 92.1875%;
  padding: 10px;
  margin: 60px auto;
}
.google_partner .item_container{
  align-items: center;
}
.partnerbox:first-child{
  width: 25%;
  line-height: 0;
}
.partnerbox:last-child{
  width: 73%;
}
#google_riyu .item_container{
  justify-content: center;
  gap: 2%;
}
/* お悩み */
#google_onayami.onayami,
#sns_onayami.onayami{
  position: relative;
  padding: 60px 0 40px;
}
#google_onayami.onayami::after,
#sns_onayami.onayami::after{
  content: "";
  position: absolute;
  top: 99%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-c);
  width: 100px;
  height: calc(tan(60deg) * 50px / 2);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
}
#google_onayami .itembox02 p,
#sns_onayami .itembox02 p{
  font-size: 1.7rem;
}
#google_onayami.onayami .itembox02:first-child::after,
#sns_onayami.onayami .itembox02:first-child::after{
  display: none;
}
.onayami_msg{
  /* color: var(--font-wht); */
  text-align: center;
  font-size: 2.4rem;
  font-weight: 600;
  margin-top: 30px;
}
@media (max-width: 768px) {
  .partnerbox:first-child,
  .partnerbox:last-child{
    width: 100%;
  }
  .partnerbox:first-child img{
    display: block;
    width: 40%;
    margin: 0 auto 10px;
  }
}


/* google_service */
.title_google_service{
  text-align: center;
  color: var(--font-red);
  font-size: 3.2rem;
  font-weight: 700;
}
.subtitle_google_service{
  text-align: center;
  font-size: 2.4rem;
  font-weight: 400;
}
.subtitle_google_service b{
  color: var(--font-red);
  font-weight: 600;
}
#google_service ul{
  position: relative;
  width: 92.1875%;
  margin: 30px auto 80px;
}
#google_service ul::after{
  content: "";
  position: absolute;
  top: 102%;
  left: 50%;
  transform: translateX(-50%);
  background: url(../images/service/icon_yajirushi_b.svg) no-repeat;
  background-size: contain;
  width: 90px;
  height: 70px;
}
#google_service ul li{
  position: relative;
  list-style-type: none;
  width: 100%;
  background-image: linear-gradient(-90deg, rgba(177, 1, 2, 1), rgba(125, 1, 1, 1));
  border-radius: 10px;
  color: var(--font-wht);
  font-size: 2.0rem;
  font-weight: 500;
  line-height: 1.5;
  padding: 10px 10px 10px 45px;
  margin-bottom: 10px;
}
#google_service ul li::before{
  content: "";
  position: absolute;
  top: 5px;
  left: 10px;
  background: url(../images/service/icon_check_wht.svg) no-repeat;
  background-size: contain;
  width: 30px;
  height: 35px;
}
.title_google_msg{
  text-align: center;
  font-family: var(--ff_serif);
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 1.6;
  width: 92.1875%;
  margin: 0 auto;
}
.title_google_msg b{
  color: var(--font-red);
  font-family: var(--ff);
  font-size: 4.0rem;
  font-weight: 600;
}
/* STABBLEの強み */
ul.tsuyomi{
  list-style-type: none;
  width: 100%;
  margin: 30px auto 60px;
}
ul.item_container.tsuyomi{
  align-items: stretch;
}
ul.item_container.tsuyomi li{
  position: relative;
  width: 31%;
  background: var(--bg-b);
  border-radius: 10px;
  text-align: center;
  color: var(--font-wht);
  font-size: 2.0rem;
  font-weight: 600;
  line-height: 1.5;
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
ul.item_container.tsuyomi li span{
  font-size: 3.0rem;
  font-weight: 700;
}
ul.item_container.tsuyomi li.no01::before,
ul.item_container.tsuyomi li.no02::before,
ul.item_container.tsuyomi li.no03::before{
  position: absolute;
  top: -10px;
  left: 0;
  font-family: var(--ff-en);
  font-size: 6.0rem;
  font-weight: 600;
  line-height: 1;
  color: rgba(255, 255, 255, 0.2);
}
ul.item_container.tsuyomi li.no01::before{
  content: "01";
}
ul.item_container.tsuyomi li.no02::before{
  content: "02";
}
ul.item_container.tsuyomi li.no03::before{
  content: "03";
}

#dsp .itembox02 p span{
  color: var(--font-red);
  font-size: 1.8rem;
  font-weight: 600;
}
.title_dsp{
  font-family: var(--ff_serif);
  font-size: 3.0rem;
  font-weight: 600;
  margin-bottom: 20px;
}
#dsp ul.redbox_check{
  list-style-type: none;
  border: 4px solid var(--bg-b);
  background: var(--font-red_light);
  border-radius: 15px;
  padding: 15px;
  margin-top: 30px;
}
#dsp ul.redbox_check li{
  position: relative;
  width: 100%;
  text-align: left;
  color: var(--font-red);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.6;
  padding-left: 25px;
  margin-bottom: 10px;
}
#dsp ul.redbox_check li::before{
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  background: url(../images/icon_check.svg) no-repeat;
  background-size: contain;
  width: 22px;
  height: 26px;
}

@media (max-width: 768px) {
  #google_tsuyomi ul li,
  ul.item_container.tsuyomi li{
    width: 100%;
    margin-bottom: 10px;
  }
  #google_riyu .maru_point,
  #google_riyu .maru_point{
    width: 46%;
  }
  #google_riyu .txt_big{
    font-size: 4.0rem;
  }
  #google_riyu .txt_big b,
  #google_riyu .txt_m{
    font-size: 3.0rem;
  }

}

/* お客様の声 */
.voiceArea{
  background: var(--bg-b);
}
.voiceArea dl{
  width: 100%;
  background: var(--bg-a);
  border-radius: 15px;
  padding: 20px;
  align-items: center;
  margin-bottom: 20px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4);
}
.voiceArea dl dt{
  width: 25%;
}
.voiceArea dl dt img{
  display: block;
  width: 80%;
  margin: 0 auto;
}
.voiceArea dl dd{
  width: 73%;
  font-size: 1.8rem;
  line-height: 1.6;
}
.voiceArea dl dd h4{
  font-size: 2.4rem;
  font-weight: 600;
  margin-bottom: 5px;
}
.voic_point{
  font-size: 2.0rem;
  font-weight: 600;
}
.voic_point b{
  color: var(--font-red);
  font-size: 2.4rem;
  font-weight: 600;
}
.voice_msg{
  text-align: center;
  color: var(--font-wht);
  font-family: var(--ff_serif);
  font-size: 3.0rem;
  font-weight: 700;
  margin: 30px 0;
}
.voice_msg span{
  color: #fff100;
}
@media (max-width: 768px) {
  .voiceArea dl dt,
  .voiceArea dl dd{
    width: 100%;
  }
  .voiceArea dl dt img{
    width: 60%;
  }
}

/* google Flow */
.google_flowbox{
  position: relative;
  background: var(--bg-a);
  padding: 30px;
  margin-bottom: 50px;
}
.google_flowitem:first-child{
  width: 68%;
}
.google_flowitem:last-child{
  width: 30%;
  background: var(--font-red_light);
  color: var(--font-red);
  padding: 20px;
}
.google_flowitem:last-child p{
  text-align: left;
  font-size: 2.0rem;
  font-weight: 600;
  line-height: 1.5;
}
#google_flow .flow_step{
  left: -40px;
  transform: translateX(0);
}
.flow_point{
  position: relative;
  background: var(--bg-b);
  border-radius: 30px;
  color: var(--font-wht);
  text-align: center!important;
  letter-spacing: 0.25em;
  line-height: 1.8!important;
  margin-bottom: 20px;
}
.flow_point::after{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 12px solid var(--bg-b);
  border-right: 10px solid transparent;
  border-left: 10px solid transparent;
}
#google_flow .google_flowitem h4{
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.6;
  margin-bottom: 10px;
}
#google_flow .google_flowitem ul{
  list-style-type: none;
  margin-top: 10px;
}
#google_flow .google_flowitem ul li{
  position: relative;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.5;
  padding-left: 1em;
  margin-bottom: 10px;
}
#google_flow .google_flowitem ul li::before{
  content: "";
  position: absolute;
  top: 7px;
  left: 0;
  display: inline-block;
  background: var(--bg-c);
  border-radius: 50%;
  width: 15px;
  height: 15px;
  margin-right: 5px;
}
.red_text_big{
  color: var(--font-red);
  font-size: 1.8rem;
  font-weight: 600;
}
.title_google_flow{
  color: var(--font-red);
  text-align: center;
  font-size: 3.0rem;
  font-weight: 700;
  margin: 40px auto 10px;
}
.subtitle_google_flow{
  text-align: center;
  font-size: 2.0rem;
  font-weight: 500;
}

@media (max-width: 768px) {
  .google_flowbox:first-of-type{
    margin-top: 60px;
  }
  .google_flowitem:first-child,
  .google_flowitem:last-child{
    width: 100%;
  }
  #google_flow .flow_step{
    left: -10px;
  }
  .google_flowbox{
    padding: 40px 15px 15px;
  }
  .google_flowitem{
    margin-top: 10px;
  }
}

/* 料金について */
#google_cost{
  background: #666;
  padding: 60px 0;
}
#google_cost .wrapper{
  background: var(--bg-a);
  padding: 30px;
}
.google_costbox:first-child{
  width: 30%;
}
.google_costbox:last-child{
  width: 68%;
}
.google_costbox dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin-top: 20px;
}
.google_costbox dl dt{
  width: 15%;
}
.google_costbox dl dd{
  width: 83%;
}
.redbox_red{
  border: 2px solid var(--bg-b);
  color: var(--font-red);
  text-align: center;
  font-size: 3.0rem;
  font-weight: 600;
  line-height: 1.5;
  padding: 10px;
  margin-bottom: 10px;
}
.text_18big{
  font-size: 1.8;
  font-weight: 700;
}
@media (max-width: 768px) {
  .google_costbox:first-child,
  .google_costbox:last-child,
  .google_costbox dl dt,
  .google_costbox dl dd{
    width: 100%;
  }
}

/* ==============================
    サービス案内 SNS
=============================== */
#sns_riyu ul.tsuyomi{
  margin: 30px auto 0;
}
#sns_support{
  padding: 60px 0;
}
#sns_support .item_container{
  margin-top: 30px;
  align-items: center;
}
.sns_supportbox:nth-child(odd){
  width: 210px;
  margin-bottom: 20px;
}
.sns_supportbox:nth-child(even){
  width: calc(100% - 230px);
}
.sns_supportbox:nth-child(even) p{
  font-size: 1.8rem;
  margin-bottom: 30px;
}
#sns_support .maru_point_light{
  width: 200px;
  height: 200px;
}
@media (max-width: 768px) {
  #sns_support.wrap720{
    width: 92.1875%;
    margin-inline: auto;
  }
  .sns_supportbox:nth-child(odd),
  .sns_supportbox:nth-child(even){
    width: 100%;
  }
}

/* ==============================
    採用情報
=============================== */
.title_recruit{
  font-family: var(--ff-en);
  font-size: 8.0rem;
  font-weight: 600;
  line-height: 1.4;
}
#recruit_vision dl{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin: 20px auto 30px;
}
#recruit_vision dl dt{
  width: 40%;
}
#recruit_vision dl dd{
  width: 60%;
  color: var(--font-red);
  font-size: 2.4rem;
}
.recruit_msg{
  margin-top: 30px;
}
.recruit_msg p{
  text-align: center;
  font-size: 1.8rem;
  line-height: 2.0;
  margin-bottom: 1em;
}
.recruit_step.item_container{
  align-items: center;
  margin-top: 60px;
}
@media (max-width: 768px) {
  #recruit_vision dl dt,
  #recruit_vision dl dd{
    width: 100%;
  }
  .recruit_msg p{
    text-align: justify;
  }
}

.recruit_visionbox:first-child{
  width: 160px;
}
.recruit_visionbox:last-child{
  width: calc(100% - 180px);
}
#recruit_vision .recruit_visionbox p{
  text-align: left;
}
.red_maru{
  background: var(--bg-b);
  border-radius: 50%;
  width: 160px;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.red_maru span{
  color: var(--font-wht);
  text-align: center;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.4;
}
#recruit_vision .title_serif{
  font-size: 2.4rem;
}
@media (max-width: 768px) {
  .recruit_step.item_container{
    margin-top: 30px;
  }
  .recruit_visionbox:first-child,
  .recruit_visionbox:last-child{
    width: 100%;
  }
  .red_maru{
    margin: 0 auto;
  }
  #recruit_vision .recruit_visionbox p{
    text-align: justify;
  }
}

/* チームごとの仕事内容 */
#recruit_team{
  background: #eee;
  padding: 60px 0;
}
#recruit_team dl{
  border-bottom: 3px dotted var(--bg-c);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-bottom: 20px;
  margin-top: 40px;
}
#recruit_team dl dt{
  width: 160px;
}
#recruit_team dl dt img{
  display: block;
  width: 70%;
  margin: auto;
}
#recruit_team dl dd{
  width: calc(100% - 180px);
}
#recruit_team .title_maru{
  color: var(--font-red);
  font-size: 2.2rem;
}
#recruit_team .title_maru::before{
  top: -20px;
}
#recruit_team .title_serif{
  text-align: center;
  font-size: 2.4rem;
  margin-top: 40px;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  #recruit_team dl dt,
  #recruit_team dl dd{
    width: 100%;
  }
  #recruit_team dl dt img{
    width: 40%;
    margin-bottom: 20px;
  }
}

/* 募集要項 */
#recruit_guideline table{
  margin: 40px auto 30px;
}
#recruit_guideline table tr{
  border-bottom: 1px solid #ccc;
}
#recruit_guideline table tr:first-child{
  border-top: 1px solid #ccc;
}
#recruit_guideline table th,
#recruit_guideline table td{
  text-align: left;
  padding: 20px 10px;
}
#recruit_guideline table th{
  width: 25%;
  font-weight: 500;
}
#recruit_guideline table td{
  width: 75%;
}
a.btn_entry,
a.btn_entry:visited{
  position: relative;
  display: block;
  width: 320px;
  height: 80px;
  line-height: 80px;
  border-radius: 40px;
  background: var(--bg-b);
  text-align: center;
  box-shadow: 0px 0px 10px 0px #af0102;
  color: var(--font-wht);
  text-align: center;
  font-family: var(--ff-en);
  font-size: 3.4rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  margin: 30px auto;
}
.btn_entry::before{
  content: "";
  display: block;
  position: absolute;
  top: 13%;
  left: 5%;
  border: 1px solid #fff;
  width: 90%;
  height: 70%;
  border-radius: 40px;
}
.btn_entry:hover{
  background: var(--bg-c);
  box-shadow: 0px 0px 10px 0px #222;
}
@media (max-width: 768px) {
  #recruit_guideline table th,
  #recruit_guideline table td{
    display: block;
    width: 100%;
  }
  #recruit_guideline table th{
    background: #eee;
    padding: 10px;
  }
}

/* インタビュー */
#recruit_interview a.itembox02,
#recruit_interview a.itembox02:visited{
  position: relative;
  color: var(--font-primary);
}
#recruit_interview a.itembox02::after{
  content: "＞";
  position: absolute;
  bottom: 5px;
  right: 0;
  width: 40px;
  height: 40px;
  background: var(--bg-c);
  color: white;
  font-size: 20px;
  font-weight: 100;
  line-height: 40px;
  text-align: center;
  pointer-events: none;
  font-weight: bold;
  user-select: none;
  z-index: 5; /
}

#recruit_interview a.itembox02:hover{
  color: var(--font-red);
}
.interview_red{
  position: relative;
  border: 2px solid var(--bg-b);
  line-height: 0;
  margin-bottom: 10px;
}
.interview_num{
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  background: var(--bg-b);
  text-align: center;
  color: rgba(255, 255, 255, 0.2);
  font-family: var(--ff-en);
  font-size: 6.0rem;
  line-height: 80px;
  z-index: 1;
}

@media (max-width: 768px) {
  #recruit_interview a.itembox02{
    margin-bottom: 30px;
  }
}

/* プロセス */
#recruit_process ul{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10%;
  width: 100%;
  padding: 0;
  margin: 0 0 60px;
}
#recruit_process li{
  position: relative;
  width: 12%;
  border: 3px solid var(--bg-b);
  text-align: center;
}
#recruit_process li::after{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -50px;
  background: var(--bg-b);
  width: 20px;
  height: calc(tan(60deg) * 30px / 2);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}
#recruit_process li:last-of-type::after{
  display: none;
}
#recruit_process li > span {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  /* aspect-ratio: 1 / 1; */
  background-color: var(--bg-b);
  color: var(--font-wht);
  font-family: var(--ff-en);
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.0;
  padding: 10px 0;
}
#recruit_process li span b {
  margin-left: 4px;
  font-size: 4.0rem;
  font-weight: 700;
}
#recruit_process li p{
  font-size: 2.4rem;
  writing-mode: vertical-rl;
  margin: 10px auto;
}

@media (max-width: 768px) {
  #recruit_process.wrap720{
    width: 92.1875%;
    margin-inline: auto;
  }
  #recruit_process ul{
    margin: 0;
  }
  #recruit_process li {
    display: flex;
    flex-direction: column;
    flex-direction: row;
    align-items: center;
    width: 100%;
    margin-bottom: 20px;
  }
  #recruit_process li::after{
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    top: 110%;
    left: 30px;
    right: auto;
    width: 30px;
  }
  #recruit_process li > span{
    flex-wrap: wrap;
    width: 25%;
  }
  #recruit_process li p{
    writing-mode: horizontal-tb;
    text-align: left;
  }
}

/* お問い合わせ・ENTRY フォーム */
.table01{
  width: 100%;
  margin: 60px auto 30px;
}
.table01 tr{
  border-bottom: 1px solid #ccc;
}
.table01 tr:first-of-type{
  border-top: 1px solid #ccc;
}
.table01 th,
.table01 td{
  text-align: left;
  font-size: 1.6rem;
  font-weight: 400;
  vertical-align: middle;
  padding: 20px 10px;
}
.table01 th{
  position: relative;
  width: 25%;
  font-weight: 500;
}
.table01 th p{
  font-size: 1.6rem;
  font-weight: 400;
}
.table01 td{
  width: 75%;
}
.table01 td input[type="text"],
.table01 td input[type="email"],
.table01 td input[type="tel"],
.table01 td textarea, select{
  background-color: #fcfcfc;
  border-color: #d2dadf;
  border-style: solid;
  border-width: 1px;
  box-sizing: border-box;
  color: #555;
  font-family: inherit;
  font-size: 1.6rem;
  vertical-align: baseline;
  padding: 8px 10px;
  width: 100%;
  border-radius: 1px;
}
.table01 td input[type=text]:focus,
.table01 td input[type=tel]:focus,
.table01 td textarea:focus{
  outline: none;
}
::placeholder {
  color: #aaa;
  font-size: 1.4rem;
}
#recruit_vision input[type="submit"],
#recruit_vision input[type="button"],
#recruit_vision input[type="reset"],
#data_dl input[type="submit"],
#data_dl input[type="button"],
#data_dl input[type="reset"] {
  box-sizing: border-box;
  display: block;
  width: 200px;
  border: none;
  font-size: 1.6rem;
  text-align: center;
  line-height: 3em;
  padding: 0 20px;
  margin: 30px auto 0;
  cursor: pointer;
  transition: 0.5s;
}

#recruit_vision input[type="submit"],
#data_dl input[type="submit"] {
  background: var(--bg-c);
  color: #fff;
}
#recruit_vision input[type="submit"]:hover,
#data_dl input[type="submit"]:hover {
  background: var(--bg-b);
}
#recruit_vision input[type="reset"],
#recruit_vision input[type="button"],
#data_dl input[type="reset"],
#data_dl input[type="button"] {
  background: #b5b5b5;
}
.hissu::before,
.nini::before{
  position: absolute;
  top: 3px;
  right: 10px;
  width: 3.5em;
  text-align: center;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.2;
  padding: 3px 5px;
}
.hissu::before{
  content: "必 須";
  border: 1px solid var(--bg-b);
  background: var(--font-red_light);
  color: var(--font-red);
}
.nini::before{
  content: "任 意";
  background: #eee;
  border: 1px solid #888;
  color: #888;
}

.privacy_link{
  color: var(--bg-c);
  text-align: center;
  font-size: 1.5rem;
}
.privacy_link a:link,
.privacy_link a:visited{
  color: var(--font-primary);
  text-decoration: underline;
}
.privacy_check {
  text-align: center;
  font-size: 1.5rem;
  color: var(--bg-c);
  margin-top: 10px;
}
.privacy_check input[type="checkbox"] {
  margin-right: 8px;
  vertical-align: middle;
}

/* tanks */
.thanks_text p{
  margin-bottom: 1em;
}
#recruit_thanks .btn_red02,
#data_thanks .btn_red02{
  margin: 30px auto 0;
}


@media (max-width: 768px) {
  .table01 th,
  .table01 td{
    display: block;
    width: 100%;
  }
  .table01 th{
    background: #eee;
    padding: 10px;
  }
  /* thanks */
  .mv_recruit{
    background-position: 60%;
  }
  #recruit_thanks.wrap720,
  #data_thanks.wrap720{
    width: 92.1875%;
    margin-inline: auto;
  }
}


/* ==============================
    資料請求
=============================== */
@media (max-width: 768px) {
  .mv_whitepaper{
  background-position: 25%;
}
  .mv_whitepaper.other_mv h1{
    font-size: 4.0rem;
  }
}

/* CTA */
#data_cta{
  background: url(../images/whitepaper/cta_bg.jpg) no-repeat center bottom / cover;
  padding: 30px 0;
}
.cta_img{
  display: block;
  max-width: 640px;
  width: 90%;
  height: auto;
  margin: 0 auto;
}

/* 3つのポイント */
#data_3point h2{
  text-align: center;
}
#data_3point .back_slash_blk_c{
  font-size: 3.0rem;
}
#data_3point .item_container{
  margin-top: 100px;
}
#data_3point .maru_point{
  background: var(--bg-b);
  padding-top: 10px;
}
#data_3point .maru_point::after{
  content: "";
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
  background: url(../images/icon_check02.svg) no-repeat;
  background-size: contain;
  width: 65px;
  height: 85px;
}
.title_data_point{
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.5;
}
#data_3point .maru_point p{
  font-size: 1.4rem;
  padding: 10px 20px;
}
@media (max-width: 768px) {
  #data_3point .maru_point{
    margin-top: 40px;
  }
  #data_3point .maru_point:first-of-type{
    margin-top: 0;
  }
  #data_3point .maru_point p {
    font-size: 1.6rem;
  }
}

/* こんな人におすすめ */
#data_osusume{
  background: #eee;
}
.data_osusumebox:first-child{
  width: 30%;
}
.data_osusumebox:last-child{
  width: 70%;
  padding-top: 20px;
}
.title_tate{
  writing-mode: vertical-rl;
  font-size: 6.0rem;
  font-weight: 600;
  line-height: 1.4;
}
.data_osusumebox li{
  position: relative;
  list-style: none;
  font-size: 2.4rem;
  line-height: 1.5;
  padding-left: 80px;
  margin-bottom: 30px;
}
.data_osusumebox li::before{
  content: "";
  background: url(../images/whitepaper/icon_cat.svg) no-repeat;
  background-size: contain;
  position: absolute;
  top: -5px;
  left: 0;
  width: 60px;
  height: 90px;
}
.underline_redred{
  /* display: inline-block; */
  background: rgba(175,1,2,0.1);
  color: var(--font-red);
  font-size: 3.0rem;
  font-weight: 600;
  padding: 0 5px;
  margin: 0 3px;
}

@media (max-width: 768px) {
  #data_osusume .wrap720{
    width: 92.1875%;
    margin-inline: auto;
  }
  .data_osusumebox:first-child,
  .data_osusumebox:last-child{
    width: 100%;
  }
  .title_tate {
    display: block;
    font-size: 4.0rem;
    margin: 0 auto;
  }
  .data_osusumebox li{
    font-size: 2.2rem;
    padding-left: 70px;
  }
  .underline_redred{
    font-size: 2.4rem;
  }
  .data_osusumebox li::before{
    top: 0;
    width: 50px;
    height: 70px;
  }
}

/* プライバシーポリシー */
#privacy.wrap720{
  max-width: 720px;
  width: 92.1875%;
  padding:60px 0;
  margin-inline: auto;
}
#privacy .title_linered{
  font-size: 2.4rem;
  margin-top: 60px;
}

.policy_box{
  background: #eee;
  padding: 10px;
}

/* 404 */
.error404Area{
  padding: 60px 0;
}
.error404{
  text-align: center;
  color: #666;
  font-size: 15.0rem;
  line-height: 1.2;
}
.error404 span{
  display: block;
  font-size: 3.0rem;
  line-height: 1.6;
}
@media (max-width: 768px) {
  .error404 span{font-size: 2.4rem;}
}