@charset "utf-8";

/* ==========================================================================
  overall
========================================================================== */
html {
  font-size: 22px;
}
body {
  color: #333;
  font-family: "M PLUS 2", sans-serif;
  /* font-family: "BIZ UDGothic", sans-serif; */
  font-weight: 600;
  font-optical-sizing: auto;
  font-style: normal;
  line-height: 1.5;
}
#wrapper {
  margin: 0 auto;
}
ul {
  list-style: none;
}
a {
  color: #333;
  text-decoration: none;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}
h2{
  font-weight: 700;
  font-size: 40px;
}
h3{
  font-weight: 700;
  font-size: 30px;
}

.width{
  width: 90%;
  margin: 0 auto;
}
.width02{
  width: 70%;
  margin: 0 auto;
}
.width03{
  width: 80%;
  margin: 0 auto;
}

.break {
  display: inline-block;
  white-space: normal;
}

.sp, .modelCase_txt .sp{
  display: none;
}

/* ==========================================================================
  header
========================================================================== */
header {
  width: 90%;
  margin: 0 auto;
  padding: 1% 3%;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0px 3px 6px #000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  top: 3%;
  left: 50%;
  transform: translateX(-50%)translateY(-3%);
  z-index: 10;
}
header a{
  transition: all .3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
header a:hover{
  color: #aaa;
}
.logo{
  width: 80%;
}

/* ==========================================================================
  hero
========================================================================== */
.hero{
  background-image: url(../imgs/top_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: 15vh;
}
.hero .width{
  position: relative;  
  padding-bottom: 7%;
}
.hero_txt01{
  color: #fff;
  margin-bottom: 5%;
}
.hero_txt02 ul {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-bottom: 10%;
}
.hero ul.checklist{
  padding-bottom: 10%;
}
ul.checklist li {
  display: flex;
  align-items: center;
  background-color: #ED1B1B;
  padding: 1% 2%;
  border-radius: 10px;
  color: #fff;
  margin-bottom: 2%;
  width: fit-content;
}
ul.checklist li img {
  width: 2.5ch;
  flex-shrink: 0;
}
ul.checklist li p {
  padding-left: 1%;
  white-space: nowrap;
  word-wrap: break-word;
}
.hero_circle{
  position: absolute;
  bottom: 0;
  right: -5%;
  padding-bottom: 3%;
}
.hero_circle img{
  width: 80%;
}
/* ==========================================================================
  contents
========================================================================== */
/*================= concern - 悩み =================*/
.concern_title{
  text-align: center;
  margin-top: 5%;
}
/* 半円で区切る */
.wrap {
  overflow: hidden;
  background-color: #DDF8FF;
}
.content01 {
  background: #fff;
  border-bottom-left-radius: 1000px 200px;
  border-bottom-right-radius: 1000px 200px;
  height: 150px;
  margin-left: -100px;
  margin-right: -100px;
  padding-left: 100px;
  padding-right: 100px;
}
/* 吹き出し */
.triangle {
  width: 0;
  height: 0;
  border-left: 50px solid transparent;
  border-right: 50px solid transparent;
  border-top: 50px solid #fff; /* 三角形の色を背景に合わせる */
  margin: 0 auto;
}

/* リスト */
.concern_list{
  background-color: #DDF8FF;
  padding: 5% 0;
  position: relative;
  margin-bottom: 10%;
}
/* 三角 */
.concern_list::after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 0;
  width: 100%;
  height: 50px;
  background-color: #DDF8FF;
  clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
}
.concern_list .width{
  display: flex;
  gap: 6%;
  align-items: center;
  margin-right: 0;
}
.concern_list .width div{
  width: 27%
}
ul.checklist.blue{
  width: 67%;
}
ul.checklist.blue li{
  background-color: #1088FF;
} 
ul.checklist.blue li .yellow{
  color: #FFF500;
  text-decoration: underline 1px;
  font-size: 26px;
}

/* 解決します！ */
.solution{
  text-align: center;
  background-color: #fff;
  margin-bottom: 10%;
  width: 80%;
  margin: 10% auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.red{
  color: #FF0000;
  margin-bottom: 5%;
}
.solution_img{
  width: 60%;
}

/*================= solutionList - 解決(リスト) =================*/
.solutionList{
  background-image: url(../imgs/solitionList_bg.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 10% 0;
}
.fourSolutionList li{
  background-color: #FFDEDE;
  border-radius: 10px;
  padding: 1% 7%;
  margin-bottom: 5%;
  position: relative;

}
.solution_listNum{
  width: 5ch;
  position: absolute;
  top: 50%;
  left: -3.5%;
  transform: translateY(-50%);
}
.solution_listTitle{
  color: #FF0000;
  padding: 2%;
  border-bottom: #FF0000 2px solid;
  width: 100%;
}
.small{
  font-size: 24px;
}
.solution_listDesc{
  padding: 2%;
}

/*================= stableSales - 売り上げ確保 =================*/
.stableSales{
  background-color: #ED1A1B;
  padding: 5% 0;
  color: #fff;
}
.stableSales_inner{
  display: flex;
  align-items: center;
  gap: 6%;
}
.stableSales_img{
  width: 27%;
}
.stableSales_txt{
  width: 67%;
}
.stableSales_txt div{
  margin-bottom: 10%;
}
.stableSales_txt .underline{
  border-bottom: 10px solid #FFF500;
  display: inline-block;
}
.stableSales_txt .btn.consultation{
  margin-right: 0;
}

/*================= modelCase - モデルケース =================*/
.modelCase{
  background-color: #FFDEDE;
  padding: 10% 0;
}
.title_smaller_inner.redBg{
  background-color: #FF0000;
  margin-bottom: 1.5%;
}

.caution{
  font-size: 18px;
  text-align: center;
  margin-bottom: 7%;
}

.modelCase_border{
  background-color: #fff;
  border: #FF0000 2px solid;
  border-radius: 10px;
  position: relative;
  padding: 5% 3%;
  margin-bottom: 15%;
}
.modelCase_title{
  position: absolute;
  top: -5%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
}
.modelCase_title .title_smaller_inner{
  background: none;
  display: flex;
  justify-content: center;
}
.modelCaseA .modelCase_title .title_smaller_inner img{
  width: 350px;
  height: auto;
}
.modelCaseB .modelCase_title .title_smaller_inner img{
  width: 450px;
  height: auto;
}
.voice.pc .modelCase_title .title_smaller_inner img{
  width: 270px;
  height: auto;
}
.modelCase_inner{
  display: flex;
  align-items: center;
  gap: 6%;
}
.modelCaseB .modelCase_inner,
.voice .modelCase_inner{
  padding: 5% 0;
}
.modelCase_img{
  width: 27%;
}
.modelCase_txt{
  width: 67%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.modelCase_bubble{
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 3% 5%;
  min-width: 120px;
  max-width: 100%;
  color: #FF0000;
  background: #FFF500;
  text-align: center;
}
.modelCase_bubble::before{
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #FFF500;
}
.modelCase_bubble p {
  margin: 0;
  padding: 0;
}
.modelCase_desc{
  text-align: center;
}

/* voice */
.voiceTxt .modelCase_txt{
  margin-top: 5%;
}
.voiceTxt .modelCase_txt img{
  margin-bottom: 5%;
}

.voiceTxt .modelCase_txt{
  width: 55%;
}
.voiceTxt .modelCase_img{
  width: 45%;
}

/*================= flow - 流れ =================*/
.flow{
  margin: 10% 0;
  text-align: center;
}
.flow_img{
  margin-bottom: 5%;
  display: flex;
  justify-content: center;
}

/*================= QandA - よくある質問 =================*/
.QandA{
  background-image: url(../imgs/qanda_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  padding: 10% 0;
}
.title_smaller{
  text-align: center;
}
.title_smaller_inner{
  background-color: #1088FF;
  border-radius: 10px;
  padding: 1% 2%;
  color: #fff;
  display: inline-block;
  margin-bottom: 5%;
  font-size: 30px;
  min-width: 300px;
}
/* accordion */
.accordion_area .accordion_one .ac_header {
  background-color: #ffffff;
  border-radius: 10px;
  position: relative;
  z-index: +1;
  cursor: pointer;
  transition:all .3s;
  display: flex;
  align-items: center;
}
.p-faq__q-txt, .p-faq__a-txt{
  display: flex;
  align-items: center;
  gap: 2%;
}
.p-faq__headinner{
  width: 90%;
}
.accordion_one{
  margin-bottom: 3%;
}
.accordion_area .accordion_one .ac_header {
  background-color: #DDF8FF;
  padding: 1.5% 2%;
  transition: all .3s;
}
.accordion_area .accordion_one .ac_header.open {
  border-radius: 10px 10px 0 0;
}
.accordion_area .accordion_one .ac_header:hover{
  background-color: #67b3ff;
}
.accordion_area .accordion_one .ac_header .i_box {
  position: absolute;
  top: 50%;
  right: 2rem;
  width: 20px;
  height: 20px;
  margin-top: -10px;
}
.accordion_area .accordion_one .ac_header .i_box:before, 
.accordion_area .accordion_one .ac_header .i_box:after {
  position: absolute;
  content: "";
  margin: auto;
  box-sizing: border-box;
  vertical-align: middle;
}

.accordion_area .accordion_one .ac_header.open .i_box:after {
  height: 0;
}
.accordion_area .accordion_one .ac_inner {
  display: none;
  box-sizing: border-box;
  background: #fff;
  border: transparent solid 1.5px;
  border-radius: 0 0 10px 10px;
  padding: 1.5% 2%;
}
/* + and - */
.accordion_area .accordion_one .ac_header .i_box {
  position: absolute;
  top: 50%;
  right: 1rem;
  width: 20px;
  height: 20px;
  margin-top: -10px;
}
.accordion_area .accordion_one .ac_header .i_box:before, 
.accordion_area .accordion_one .ac_header .i_box:after {
  position: absolute;
  content: "";
  margin: auto;
  box-sizing: border-box;
  vertical-align: middle;
}
.accordion_area .accordion_one .ac_header .i_box:before {
  border-top: 2px solid #521717;
  width: 20px;
  height: 0;
  top: 0;
  bottom: 0;
  right: 0;
}
.accordion_area .accordion_one .ac_header .i_box:after {
  border-left: 2px solid #521717;
  width: 0;
  height: 20px;
  top: 0;
  bottom: 0;
  right: 9px;
  transition: .3s;
}
.accordion_area .accordion_one .ac_header.open .i_box:after {
  height: 0;
}

/*================= exclusive - 5社限定募集 =================*/
.exclusive{
  padding: 5% 0;
  position: relative;
  margin: 5% auto;
}
.title_smaller_inner.exclusive_title{
  background-color: #FFF500;
  color: #000;
  position: absolute;
  top: 7%;
  left: 50%;
  transform: translateX(-50%)translateY(-7%);
}

.exclusive_inner{
  background-color: #ED1A1B;
  color: #fff;
  padding: 5%;
  text-align: center;
}
p.reminder{
  margin: 3% 0;
}
.exclusive_list{
  display: flex;
  align-items: center;
  gap: 6%;
  background-color: #fff;
  padding: 5%;
  margin-bottom: 5%;
}
.exclusive_list ul.checklist li{
  padding: 2%;
}
.exclusive_list div{
  width: 27%;
}
.exclusive_list .checklist{
  width: 67%;
}
.btn.consultation{
  box-shadow: 5px 5px 0 #570000;
  background-color: #FFF500;
  color: #000;
}

/*================= contact - お問い合わせ =================*/
.contact{
  background-color: #DDF8FF;
  padding: 10% 0;
  color: #004E9B;
  scroll-margin-top: 80px;
}
.contact .title_smaller_inner{
  margin-bottom: 2%;
}
.contact_title{
  margin-bottom: 5%;
}
.btn.send{
  color: #1088FF;
}

/* form */
.Form-Item {
  padding: 2% 0;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 6%;
  font-size: 18px;
}
.Form-Item-Label {
  width: 27%;
}
input{
  width: 67%;
}
.Form-Item-Input {
  background-color: #fff;
  border: 1px solid #707070;
  border-radius: 5px;
  padding: 1%;
  width: 100%;
}
.radioBtn{
  background-color: transparent;
  border: none;
  text-align: left;
}
.column{
  flex-direction: column;
  margin-top: 5%;
}
.isMsg, .Form-Item-Textarea{
  width: 100%;
}
.isMsg{
  text-align: center;
  margin-bottom: 2%;
}
.Form-Item-Textarea {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 1%;
  min-height: 200px;
}
/* form - checkbox */
.nowrap{
  text-wrap: nowrap;
}
.visually-hidden {
  position: absolute;
  white-space: nowrap;
  width: 1px;
  height: 1px;
  overflow: hidden;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%); 
  margin: -1px;
}
label {
  cursor: pointer;
  padding-left: 30px;
  position: relative;
}
label::before,
label::after {
  content: "";
  display: block; 
  position: absolute;
}
label::before {
  background-color: #fff;
  border-radius: 0%;
  border: 1px solid #ddd;
  width: 20px;
  height: 20px;
  transform: translateY(-50%);
  top: 50%;
  left: 5px;
}
label::after {
  border-bottom: 2px solid #1088FF;
  border-left: 2px solid #1088FF;
  opacity: 0;
  height: 5px;
  width: 10px;
  transform: rotate(-45deg);
  top: 40%;
  left: 10px;
}
input:checked + label::after {
  opacity: 1
}

/*================= LINE =================*/
.line{
  background-color: #21C913;
  text-align: center;
  padding: 5% 0;
  color: #fff;
}
.line img, .line p{
  margin-bottom: 2%;
}
.btn{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0 auto;
  max-width: 320px;
  height: auto;
  padding: 1.2%;
  color: #21C913;
  text-align: center;
  background-color: #fff;
  box-shadow: 5px 5px 0 #002245;
  border-radius: 32px;
  position: relative;
  top: 0;
  transition: all .3s;
}
.btn:hover{
  top: 5px;
  box-shadow: 0px 0px 0 #002245;
}

/*================= company - 会社名 =================*/
.company{
  background-image: url(../imgs/company_bg.png);
  padding: 10% 0;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  background-size: cover;
}


/* ==========================================================================
  footer
========================================================================== */
footer p.copy {
  text-align: center;
  color: #525252;
  padding: .5% 0;
  font-size: 14px;
  font-weight: normal;
}

/* ==========================================================================
  thanks.html
========================================================================== */
#contents .thanks{
  background-color: #DDF8FF;
  height: 100vh;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.thx_container{
  width: 80%;
  margin: 0 auto;
}
.toHome{
  color: #1088FF;
}
.thanks div{
  margin-bottom: 5%;
}
/* ==========================================================================
=============================================================================
  media query
=============================================================================
========================================================================== */
@media screen and (max-width: 1000px) {
  .concern_list .width{
    margin: 0 auto;
  }
  .break {
    display: inline-block;
    white-space: normal;
  }
  .hero ul.checklist{
    padding-bottom: 20%;
  }

  /* checklist */
  ul.checklist.blue li p, .exclusive_list ul.checklist li p {
    white-space: normal;
    padding-left: 5%;
    text-align: left;
  }
  ul.checklist.blue {
    flex-direction: column;  /* 縦並びにする */
    align-items: center;  /* 要素を中央寄せ */
    text-align: left;  /* 文字は左寄せ */
  }
  ul.checklist.blue li, .exclusive_list ul.checklist li{
    width: 80%;
    margin: 5% auto;
    padding: 1% 4%;
  }

  /* solution */
  .solution_listNum {
    left: -5.5%;
  }

  /* exclusive offer */
  .title_smaller_inner.exclusive_title{
    top: 3%;
  }
}

@media screen and (max-width: 900px) {
  .hero_circle{
    position: static;
    text-align: center;
  }
  .hero_circle img{
    width: 40%;
  }
  .hero ul.checklist{
    padding-bottom: 5%;
  }
  .hero_txt01{
    margin-bottom: 10%;
  }
  .hero .width {
    padding-top: 50%;
  }
}

@media screen and (max-width: 768px) {
  html, .small{
    font-size: 20px;
  }
  h2{
    font-size: 30px;
  }
  h3, .title_smaller_inner, ul.checklist.blue li .yellow,
  .modelCase_title h2.title_smaller_inner{
    font-size: 24px;
  }
  .modelCase_desc.sp, .modelCaseB .modelCase_desc, .flow_txt{
    font-size: 22px;
  }
  .width02{
    width: 80%;
  }
  .sp, .modelCase_txt .sp{
    display: block;
  }
  .pc{
    display: none;
  }
  .btn{
    max-width: 200px;
    padding: 3% 0;
  }

  /* ////////// hero ////////// */
  header{
    align-items: flex-end;
  }
  .hero{
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  /* ////////// contents ////////// */
  /* flex解除 */
  .concern_list .width,
  .stableSales_inner,
  .modelCase_inner,
  .exclusive_list,
  .Form-Item{
    flex-direction: column;
  }
  ul.checklist.blue,
  .stableSales_txt,
  .modelCase_txt,
  .voiceTxt .modelCase_txt, .voiceTxt .modelCase_img,
  .exclusive_list div, .exclusive_list .checklist,
  .Form-Item-Label{
    width: 100%;
  }
  /* imgSize */
  .concern_list .width div,
  .stableSales_img,
  .modelCase_img,
  .solution_img{
    width: 60%;
    margin: 5% auto;
  }

  /* padding / margin */
  .solution{
    margin: 30% auto;
  }
  .solutionList, .stableSales, .modelCase, .QandA, .contact, .company{
    padding: 20% 0;
  }
  .line{
    padding: 10% 0;
  }

  /* checklist */
  .ul.checklist.blue{
    margin: 0 auto;
  }

  /* solution */
  .solution_listNum{
    top: -7%;
    left: 50%;
    transform:translateX(-50%);
  }
  .fourSolutionList li{
    margin-bottom: 15%;
  }
  .solution_listTitle{
    padding-top: 7%;
    text-align: center;
    padding-bottom: 10%;
  }
  .solution_listDesc{
    padding-top: 10%;
  }
  .fourSolutionList li{
    padding: 10% 7%;
  }
  
  /* stableSales */
  .stableSales_txt{
    text-align: center;
    margin: 10% 0;
  }
  .stableSales_txt .btn.consultation{
    margin: 0 auto;
  }

  /* modelCase */
  .caution{
    margin-bottom: 20%;
    font-size: 14px;
  }
  .modelCase_border{
    margin-bottom: 30%;
    border: #FF0000 3px solid;
  }
  .modelCaseA .modelCase_title .title_smaller_inner img,
  .voice.sp .modelCase_title img{
    width: 230px;
  }
  .modelCaseB .modelCase_title .title_smaller_inner img{
    width: 250px;
  }
  .modelCaseA .modelCase_inner, .modelCaseB .modelCase_txt{
    padding-top: 8%;
  }
  .voiceTxt .modelCase_txt{
    padding-top: 5%;
  }
  .modelCase_desc.sp{
    margin: 10% 0;
  }
  .voice .modelCase_title{
    top: -2%;
  }
  .voice.sp .title_smaller_inner{
    background: none;
    text-align: center;
  }
  .voices{
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 10%;
  }
  .voices_txt{
    width: 400px;
  }
  .voices_img{
    width: 200px;
    margin: 0 auto;
  }

  /* flow */
  .flow{
    margin: 25% 0;
  }

  /* QandA */
  .accordion_one{
    margin-bottom: 6%;
  }
  .QandA .title_smaller_inner{
    margin-bottom: 10%;
  }
  .accordion_area .accordion_one .ac_header .i_box:before{
    width: 15px;
  }
  .accordion_area .accordion_one .ac_header .i_box:after{
    height: 15px;
    right: 7px;
  }

  /* exclusive offer */
  p.reminder {
    margin: 5% 0;
  }
  .exclusive{
    padding: 20% 0;
    margin: 0 auto;
    background-color: #ED1A1B;
  }
  .title_smaller_inner.exclusive_title{
    position: static;
    transform: none;
    margin-bottom: 0;
  }
  .exclusive .title_smaller{
    text-align: center;
  }
  .exclusive_inner{
    padding: 0;
  }
  

  /* contact */
  .radioBtn{
    text-align: center;
  }
  .contact_title, .contact .title_smaller_inner{
    margin-bottom: 10%;
  }
  .Form-Item-Label{
    margin-bottom: 2%;
  }
  .Form-Item{
    margin-bottom: 3%;
  }

  .line_img,
  .company_img{
    width: 30%;
    margin: 0 auto;
  }
  .line_img{
    margin-bottom: 5%;
  }
  .line a.btn{
    margin-top: 5%;
  }
}

@media screen and (max-width: 550px) {
  html, .small{
    font-size: 18px;
  }
  h2{
    font-size: 26px;
  }
  h3, .title_smaller_inner, ul.checklist.blue li .yellow,
  .modelCase_title h2.title_smaller_inner{
    font-size: 22px;
  }
  .modelCase_desc.sp, .modelCaseB .modelCase_desc, .flow_txt{
    font-size: 20px;
  }

  /* ////////// contents ////////// */
  .hero_circle img{
    width: 60%;
  }
  .title_smaller_inner{
    min-width: 250px;
  }
  .btn{
    min-width: 150px;
    font-size: 20px;
  }
  /* concern */
  .concern_title{
    margin-top: 25%;
  }

  /* modelCase */
  .modelCase_bubble{
    margin-top: 15%;
  }

  /* modelCase */
  .caution{
    margin-bottom: 20%;
    font-size: 14px;
  }
  .modelCaseA .modelCase_title .title_smaller_inner img,
  .voice.sp .modelCase_title img{
    width: 200px;
  }
  .modelCaseB .modelCase_title .title_smaller_inner img{
    width: 230px;
  }
  .modelCaseA .modelCase_inner, .modelCaseB .modelCase_txt{
    padding-top: 5%;
  }
  .voices_txt{
    width: 350px;
  }
  .voices_img{
    width: 180px;
  }
  .voiceTxt .modelCase_txt{
    padding-top: 8%;
  }

  /* exclusive offer */
  p.reminder {
    margin: 5% 0;
  }
  .title_smaller_inner.exclusive_title{
    top: 1.5%;
  }

  .company_img{
    width: 25%;
  }
  .line_img{
    width: 20%;
  }
}

@media screen and (max-width: 450px) {
  html, .small, .Form-Item{
    font-size: 16px;
  }
  h2{
    font-size: 24px;
  }
  h3, .title_smaller_inner, ul.checklist.blue li .yellow,
  .modelCase_title h2.title_smaller_inner{
    font-size: 19px;
  }
  .modelCase_desc.sp, .modelCaseB .modelCase_desc, .flow_txt{
    font-size: 18px;
  }
  .sp{
    display: block;
  }
  .pc{
    display: none;
  }
  .hero .width{
    padding-top: 0;
  }
  /* modelCase */
  .modelCaseA .modelCase_title .title_smaller_inner img,
  .voice.sp .modelCase_title img{
    width: 180px;
  }
  .modelCaseB .modelCase_title .title_smaller_inner img{
    width: 220px;
  }
  .modelCaseA .modelCase_inner, .modelCaseB .modelCase_txt{
    padding-top: 5%;
  }
  .voices_img{
    width: 120px;
  }
}

@media screen and (max-width: 400px) {
  html, .small, .Form-Item{
    font-size: 14px;
  }
  .sp{
    display: block;
  }
  .pc{
    display: none;
  }
}