@charset "UTF-8";

/* home 
-------------------------------------------------------------*/
.main_visual {
  background: url(../../img/home/sp_main_img.jpg) no-repeat top left;
  background-size: cover;
  height: auto;
  padding: 40px 0;
}

.main_visual .box_txt {
  width: auto;
  padding: 0 6%;
  text-align: center;
}

.main_visual .box_txt h2 {
  font-size: 30px;
  font-weight: bold;
  line-height: 30px;
}

.main_visual .box_txt .txt_01 {
  font-size: 16px;
  line-height: 24px;
  margin: 15px 0;
}

.main_visual .box_txt .txt_02 {
  font-size: 12px;
  line-height: 18px;
  padding: 3% 6%;
}

.main_visual .img {
  display: none;
}

/* box_popular */
.b_ttl {
  font-size: 20px;
  line-height: 34px;
  margin-bottom: 25px;
}

.b_ttl img {
  top: -30px;
}

.b_ttl02 {
  font-size: 28px;
  line-height: 30px;
  margin-bottom: 30px;
}

.b_ttl02 span {
  margin-top: 5px;
}

.b_ttl02 img {
  top: -30px;
}

.txt_y:before {
  bottom: 2px;
}

.block {
  padding: 30px 0;
}

.list_01 {
  position: relative;
  z-index: 10;
}

.list_01 .ttl_bl {
  font-size: 12px;
  line-height: 18px;
  margin-top: 5px;
}

.list_01 li {
  font-size: 13px;
  line-height: 21px;
  margin: 0 0 10px;
  width: 100%;
  padding: 15px 3%;
}

.list_01 li p img {
  width: 30%;
  margin: 0 auto;
}

.list_01 li p span {
  font-size: 18px;
}

/* box_comp*/
#box_comp {
  padding-top: 30px;
  height: auto;
}

#box_comp .b_ttl img {
  top: -30px;
}

#box_comp .title {
  font-size: 13px;
  line-height: 28px;
  margin: 0 auto 30px;
  width: 300px;
}

#box_comp .title span {
  font-size: 20px;
}

.bg_w {
  width: 100%;
  padding: 5% 0;
}

.list_02 {
  display: none;
}

#box_comp .client_slider {
  display: block;
}

#box_popular {
  padding: 40px 6%;
}

#box_popular .list_01 {
  justify-content: space-between;
}

#box_popular .list_01 li {
  width: 49.5%;
  margin-bottom: 1%;
}

/* block_01 */
#block_01 {
  padding: 30px 0;
}

#block_01 .b_ttl02 img {
  top: -40px;
}

.list_cases > li {
  width: 100%;
  min-height: auto;
  margin-bottom: 20px;
  padding-bottom: 10px;
}

.list_cases > li .img {
  height: 60vw;
}

.list_cases li .title {
  font-size: 18px;
  margin-bottom: 10px;
}

.list_cases li .box_txt {
  padding: 30px 3% 15px;
}

.list_cases li .case_box_txt {
  width: 94%;
  margin: 0 auto;
  position: static;
  padding-top: 10px;
}

.list_cases li .txt_bl {
  font-size: 15px;
}

.list_cases li .txt_num {
  font-size: 20px;
}
.list_cases li .case_num span {
font-size: 15px;
}

.list_cases li .case_num {
    padding: 0 10px;
}

/* block_02 */
#block_02 .b_ttl02 img {
  top: -30px;
}

.box_func {
  background: none;
  padding: 0 3%;
}

.box_func .ma_01,
.box_func .ma_02 {
  margin: 0;
}

.list_arrows {
  display: none;
  margin: 0;
}

.list_func > li {
  width: 100%;
  margin-bottom: 15px;
}

.box_hide {
  position: relative;
  width: 100%;
  margin: 20px 0 10px;
  padding: 3%;
  top: 0;
  left: 0;
}

.box_hide:after {
  bottom: 0;
  top: -33px;
  left: 85px;
  transform: rotate(170deg);
}

.box_hide02:after {
  left: 85px;
  right: auto;
  border-width: 35px 0 0 20px;
}

.list_04 li,
.box_hide02 .list_04 li,
#box_hide07 .list_04 li:nth-child(3n),
#box_hide07 .list_04 li:last-child {
  width: 49%;
}

#box_hide01,
#box_hide02,
#box_hide03,
#box_hide04,
#box_hide05,
#box_hide06,
#box_hide07 {
  left: 0;
  top: 0;
}

#box_hide03:after {
  bottom: 0;
  top: -33px;
  left: 85px;
  right: auto;
  transform: rotate(170deg);
  border-width: 35px 0 0 20px;
}

/* block_03 */
#block_03 {
  height: auto;
}

.list_system {
  width: 94%;
}

.list_system li {
  background: #fff;
  width: 100%;
  margin-bottom: 15px;
}

.list_system li p {
  text-align: center;
}

.list_system li .pic,
.list_system li .imgArea_box {
  height: 30vh;
}

.list_system li .imgArea {
  padding-top: 50px;
}

.list_system .box_txt {
  padding: 15px 3%;
  min-height: auto;
}

.list_system li a {
  position: relative;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto 15px;
}

/**/
#block_04 {
  background-position: top center;
  padding: 30px 0;
  position: relative;
  z-index: 10;
}

#block_04 .b_ttl02 img {
  top: -50px;
}

.box_step {
  padding: 15px 3%;
  font-size: 13px;
  line-height: 22px;
}

.box_steps > p {
  margin: 15px auto;
  width: 20%;
}

.box_steps .ttl_step {
  font-size: 18px;
  line-height: 22px;
  width: 55%;
}

.box_steps .ttl_step span {
  font-size: 13px;
}

.box_steps .ttl_step span.num {
  font-size: 20px;
  margin: 0 10px 0 5px;
}

.box_steps .txt_r {
  width: 125px;
  font-size: 11px;
}

.box_steps .txt_r span {
  line-height: 24px;
  width: 60px;
}

/**/
#block_05 .b_ttl02 img {
  top: -30px;
  width: 50%;
}

/* block_06 */
#block_06{
  padding: 30px 0;
}

#block_06 .inner{
  display: block;
}

#block_06 .box_txt{
  padding: 30px 3%;
}

#block_06 .box_txt h4{
  text-align: center;
  font-size: 18px;
  margin-bottom: 15px;
}

#block_06 .box_txt p{
  font-size: 22px;
}

#block_06 .box_txt,
#block_06 .img{
  width: 100%;
}

.box_faq {
  margin-bottom: 15px;
  padding: 15px 3%;
}

.box_faq dt {
  background: url(../../img/home/sp_iconq.gif) no-repeat 0 2px;
  background-size: 18px;
  line-height: 21px;
  padding: 0 0 10px 28px;
  margin-bottom: 10px;
}

.box_faq dd {
  background: url(../../img/home/sp_icona.gif) no-repeat 0 2px;
  background-size: 16px;
  padding: 0 0 10px 28px;
}

@media screen and (orientation: landscape) {
  .b_ttl img {
    width: 50%;
  }

  .b_ttl02 img {
    width: 70%;
  }

  .main_visual .box_txt h2 {
    font-size: 40px;
    font-weight: bold;
    line-height: 30px;
  }

  .main_visual .box_txt .txt_01 {
    font-size: 20px;
    line-height: 28px;
    margin: 15px 0;
  }

  .main_visual .box_txt .txt_02 {
    font-size: 15px;
    line-height: 20px;
    padding: 3% 6%;
  }

  #block_01 .b_ttl02 img {
    top: -50px;
  }
}