.pc-hide {
  display: block;
}

@media (max-width: 1023px) {
  .pc-hide {
    display: none;
  }
}

.sp-hide {
  display: none;
}

@media (max-width: 1023px) {
  .sp-hide {
    display: block;
  }
}

.caution {
  color: #707070; font-size: 1.2rem;
}

.contents__inner--small {
  margin: 0 auto;
}

@media (max-width: 1023px) {
  .pageH1Area--call {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(51, 51, 51, .6)), to(rgba(51, 51, 51, .6))), url(/sites/default/files/media/jp/service/line-official-account/linecall/img/LINECALL_mv_sp.jpg) 50% 50% no-repeat; background: linear-gradient(rgba(51, 51, 51, .6), rgba(51, 51, 51, .6)), url(/sites/default/files/media/jp/service/line-official-account/linecall/img/LINECALL_mv_sp.jpg) 50% 50% no-repeat; background-size: cover;
  }
}

@media (max-width: 1023px) {
  .pageH1Area__tit {
    color: #ffffff;
  }
}

.H2Area {
  align-items: center; -webkit-box-align: center; -webkit-box-pack: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-pack: center; justify-content: center; margin: 30px auto 60px; width: 940px;
}

@media screen and (max-width: 1023px) {
  .H2Area {
    align-items: center; -webkit-box-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; font-size: 2.4rem; position: relative; width: auto;
  }
}

.H2Area:before {
  background-color: #707070; content: ''; height: 1px; width: 100%;
}

@media screen and (max-width: 1023px) {
  .H2Area:before {
    background-color: #707070; display: block; left: 0; position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%;
  }
}

.H2Area:after {
  background-color: #707070; content: ''; height: 1px; width: 100%;
}

@media screen and (max-width: 1023px) {
  .H2Area:after {
    background-color: #707070; display: block; position: relative; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);
  }
}

.H2Area__title {
  -webkit-box-flex: 0; color: #404040; -ms-flex: 0 0 auto; flex: 0 0 auto; font-size: 2.8rem; font-weight: bold; padding: 0 50px; text-align: center;
}

@media screen and (max-width: 1023px) {
  .H2Area__title {
    font-size: 2.4rem; padding: 0 25px;
  }
}

.H3Area {
  margin-top: 40px;
}

.service {
  margin: 60px 0 0;
}

.service__title {
  color: #07b53b; font-size: 2.4rem; margin-top: calc(76px - (1em*1.3)); padding-left: 24px; position: relative; top: inherit;
}

@media (max-width: 1023px) {
  .service__title {
    font-size: 2rem;
  }
}

.service__title:before {
  background-color: #07b53b; content: ''; display: block; height: 1em; left: 0; position: absolute; top: .2em; width: 4px;
}

.service__block {
  -webkit-box-pack: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: center; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; margin-top: 40px;
}

.service__detail {
  -webkit-box-direction: normal; -webkit-box-orient: vertical; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; width: calc(100% / 3 - 60px);
}

@media (max-width: 1023px) {
  .service__detail {
    width: 100%;
  }
}

.service__detail:not(:first-child) {
  margin-left: 60px;
}

@media (max-width: 1023px) {
  .service__detail:not(:first-child) {
    margin-left: 0; margin-top: 80px;
  }
}

.service__detail--title {
  font-size: 2rem; text-align: center;
}

.service__detail--img {
  margin: 24px auto 0; max-width: 250px;
}

@media (max-width: 1023px) {
  .service__detail--img {
    -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1;
  }
}

.service__detail--txt {
  margin-top: 24px;
}

.service__function-img {
  margin-top: 40px; text-align: center;
}

.service__list {
  margin-top: 24px;
}

.service__list li {
  counter-increment: number; margin-top: 4px; padding-left: 1em; text-indent: -1em;
}

.service__list li:before {
  content: counter(number) '.'; margin-right: 4px;
}

.utilization {
  margin-bottom: 40px;
}

@media (max-width: 1023px) {
  .utilization {
    -webkit-box-direction: normal; -webkit-box-orient: vertical; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column;
  }
}

.utilization:nth-of-type(n+3) {
  border-top: 1px dashed #cccccc; padding-top: 40px;
}

.utilization__contents {
  -webkit-box-pack: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: center; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;
}

@media (max-width: 1023px) {
  .utilization__contents {
    -webkit-box-ordinal-group: 2; -ms-flex-order: 1; margin-top: 40px; order: 1;
  }
}

.utilization__list {
  align-items: center; -webkit-box-align: center; -webkit-box-direction: normal; -webkit-box-orient: vertical; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column; font-size: 1.8rem; width: calc(100% / 2 - 100px);
}

@media (max-width: 1023px) {
  .utilization__list {
    width: 100%;
  }
}

.utilization__list--txt {
  color: #707070; font-weight: 700; margin-bottom: 24px;
}

@media (max-width: 1023px) {
  .utilization__list--txt {
    margin-bottom: 16px;
  }
}

.utilization__list--txt-green {
  color: #07b53b;
}

.utilization__list--img {
  margin-top: auto; max-width: 300px; width: 100%;
}

@media (max-width: 1023px) {
  .utilization__list--img {
    max-width: 150px;
  }
}

.utilization__txt {
  margin-top: 40px; text-align: center;
}

@media (max-width: 1023px) {
  .utilization__txt {
    margin-top: 0; text-align: left;
  }
}

.arrow {
  margin-left: 100px; position: relative;
}

@media (max-width: 1023px) {
  .arrow {
    margin-left: 0; margin-top: 100px;
  }
}

.arrow:before {
  background: url(/sites/default/files/media/jp/service/line-official-account/linecall/img/arrow.png) 0 0 no-repeat; background-size: 100% auto; content: ''; height: 58px; left: -92px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 85px;
}

@media (max-width: 1023px) {
  .arrow:before {
    height: 39px; left: 50%; top: -66px; -webkit-transform: translateX(-50%) rotateZ(90deg); transform: translateX(-50%) rotateZ(90deg); width: 56px;
  }
}

.block__img {
  margin-top: 40px; text-align: center;
}

.block__img img {
  max-width: 690px; width: 100%;
}

.case-study {
  -webkit-box-pack: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: center; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center;
}

.case-study__block {
  align-items: center; -webkit-box-align: center; -webkit-box-direction: normal; -webkit-box-orient: vertical; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column; width: 45%;
}

@media (max-width: 1023px) {
  .case-study__block {
    width: 100%;
  }
}

@media (max-width: 1023px) {
  .case-study__block:last-of-type {
    margin-top: 40px;
  }
}

.case-study__img {
  max-width: 450px; width: 100%;
}

.case-study__title {
  color: #07b53b; font-size: 2rem; margin-top: 16px;
}

@media (max-width: 1023px) {
  .case-study__title {
    font-size: 1.8rem;
  }
}

.case-study__txt {
  margin-top: 8px; text-align: center;
}

.case-study__imgLink {
  cursor: pointer; -webkit-transition: opacity .3s ease-out; transition: opacity .3s ease-out;
}

.case-study__imgLink:hover {
  opacity: .6;
}

.btn {
  margin-top: 40px;
}

.greenBtn {
  text-align: center;
}

.greenBtn__arrow01:after {
  background: url(/static/jp/common/img/ico_rightArrow02.png) 0 0 no-repeat; background-size: cover; content: ''; display: inline-block; height: 10px; position: absolute; right: 17px; top: calc(50% - 5px); vertical-align: middle; width: 6px;
}

.greenBtn a {
  background: #07b53b; border: 2px solid #07b53b; border-radius: 50px; color: #ffffff; display: inline-block; font-size: 1.4rem; font-weight: bold; line-height: 1.5; min-width: 220px; padding: 9px 35px 8px 35px; position: relative; -webkit-transition: color .4s , background-color .4s; transition: color .4s , background-color .4s;
}

.greenBtn a:hover {
  background-color: #ffffff; color: #07b53b; text-decoration: none;
}

.greenBtn a:hover .greenBtn__arrow01:after {
  background-image: url('/static/jp/common/img/ico_rightArrow01.png');
}
.conversionArea {
  background: #f2f4f8; margin: 100px auto 60px; max-width: 980px; padding: 60px;
}

@media (max-width: 1023px) {
  .conversionArea {
    padding: 60px 45px;
  }
}

.conversionArea__title {
  color: #03003e; font-family: 'UD新ゴ B'; font-size: 3.1rem; margin-bottom: 26px; text-align: center;
}

@media (max-width: 1023px) {
  .conversionArea__title {
    font-size: 2.4rem; margin-bottom: 15px;
  }
}

.conversionArea__btnArea {-webkit-box-pack: center; 
  display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: center; justify-content: center;
}

@media (max-width: 1023px) {
  .conversionArea__btnArea {align-items: center; 
    -webkit-box-align: center; -webkit-box-direction: normal; -webkit-box-orient: vertical; -ms-flex-align: center; -ms-flex-direction: column; flex-direction: column;
  }
}

.conversionArea__txt {
  font-family: 'UD新ゴ B'; font-size: 1.4rem; margin-top: 51px;
}

.conversionArea__btn {align-items: center; border-radius: 50px; 
  -webkit-box-align: center; -webkit-box-pack: center; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-align: center; -ms-flex-pack: center; font-size: 1.8rem; justify-content: center; letter-spacing: .2rem; line-height: 1.2; min-height: 66px; min-width: 360px; padding: 3px 18px; position: relative; -webkit-transition: color .4s , background-color .4s; transition: color .4s , background-color .4s;
}

@media (max-width: 1023px) {
  .conversionArea__btn {
    font-size: 1.4rem; letter-spacing: .4rem; max-width: 335px; min-height: 54px; min-width: inherit; padding: 0 30px; width: 100%;
  }
}

.conversionArea__btn:hover {
  text-decoration: none;
}

.conversionArea__btn:nth-of-type(2) {
  margin-left: 56px;
}

@media (max-width: 1023px) {
  .conversionArea__btn:nth-of-type(2) {
    margin-left: 0; margin-top: 10px;
  }
}

.conversionArea__orangeBtn {
  background: #f77911; border: 2px solid #f77911; color: #ffffff;
}

.conversionArea__orangeBtn:hover {
  background: #ffffff; color: #f77911;
}

.conversionArea__whiteBtn {
  background: #ffffff; border: 2px solid #ffffff; color: #00003e;
}

.conversionArea__whiteBtn:hover {
  background: #00003e; border: 2px solid #00003e; color: #ffffff;
}