.fit {
	font-family: "object-fit: cover;";
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	width: 100%
}

.fit--contain {
	font-family: "object-fit: contain;";
	-o-object-fit: contain;
	object-fit: contain
}
@media (min-width:769px),
print {
  .show_sp {
		display: none!important
	}
	.container {
		min-width: 1200px;
		overflow: hidden
	}
	.row {
		margin: 0 auto;
		max-width: 1000px;
		width: 100%
	}
	a[href^=tel] {
		pointer-events: none;
		text-decoration: none
	}
  .app-page .cen {
    text-align: center
  }
  .app-page .ttl-main {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 48px;
    margin-bottom: 36px;
    padding-left: 15px;
    text-align: center
  }
  .app-page .ttl-main .en {
    color: #16b0a6;
    display: block;
    font-family: Noto Sans JP, sans-serif;
    font-size: 1.6rem;
    line-height: 24px;
    margin-bottom: 10px
  }
  .app-page .ttl-mark {
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 42px;
    margin-bottom: 66px;
    padding-left: 18px;
    text-align: center
  }
  .app-page .ttl-mark span {
    border-bottom: 8px solid #f7931e;
    color: #16b0a6;
    display: inline-block
  }
  .app-page .app-btn {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: #16b0a6;
    border: 1px solid #16b0a6;
    border-radius: 6px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.6rem;
    font-weight: 600;
    justify-content: center;
    line-height: 21px;
    margin: 20px auto 0;
    outline: 0;
    overflow: hidden;
    padding: 16px 20px;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    text-align: center;
    -webkit-transform: translate(0);
    transform: translate(0);
    -webkit-transition: color .3s ease-in-out;
    -o-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
    width: 300px;
    will-change: color
  }
  .app-page .app-btn:before {
    background-color: #fff;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: width .3s ease-in-out;
    -o-transition: width .3s ease-in-out;
    transition: width .3s ease-in-out;
    width: 0;
    will-change: width;
    z-index: -1
  }
  .app-page .app-btn:after {
    background: url('../img/app-new/arr_right.png') no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    height: 12px;
    margin: auto 0;
    position: absolute;
    right: 14px;
    top: 0;
    -webkit-transition: background-image .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: background-image .3s ease-in-out, -webkit-transform .3s ease-in-out;
    -o-transition: transform .3s ease-in-out, background-image .3s ease-in-out;
    transition: transform .3s ease-in-out, background-image .3s ease-in-out;
    transition: transform .3s ease-in-out, background-image .3s ease-in-out, -webkit-transform .3s ease-in-out;
    width: 7px;
    will-change: transform, background-image
  }
  .app-page .app-btn:hover {
    color: #16b0a6
  }
  .app-page .app-btn:hover:before {
    width: 100%
  }
  .app-page .app-btn:hover:after {
    background-image: url('../img/app-new/arr_right_hv.png');
    -webkit-transform: translateX(5px);
    transform: translateX(5px)
  }
  .app-page .app-btn-white {
    background-color: transparent;
    border: 1px solid #fff;
    width: 100%
  }
  .more-store .app-btn:hover{
    border: 1px solid #16b0a6;
  }
  .app-page .app-act {
    background: -o-linear-gradient(359.39deg, rgba(22, 176, 166, .012) .81%, rgba(22, 176, 166, 0) 99.76%), -o-linear-gradient(top, rgba(22, 176, 166, .17) 0, rgba(22, 176, 166, .019) 60.04%, rgba(22, 176, 166, 0) 100%);
    background: linear-gradient(90.61deg, rgba(22, 176, 166, .012) .81%, rgba(22, 176, 166, 0) 99.76%), linear-gradient(180deg, rgba(22, 176, 166, .17), rgba(22, 176, 166, .019) 60.04%, rgba(22, 176, 166, 0));
  }
  .app-page .app-act .row {
    max-width: 1280px
  }
  .app-page .app-service {
    background-color: #faf7f3;
    padding: 72px 0
  }
  .app-page .app-price {
    background-color: #fff;
    margin-bottom: 174px;
    padding: 72px 0;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .app-price:after {
    background-color: #e8f4f6;
    bottom: 0;
    content: "";
    height: 50%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1
  }
  .app-page .app-code {
    background-color: #16b0a6;
    padding: 32px 0 72px
  }
  .app-page .app-code .row {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }
  .app-page .app-contact {
    background: url('../img/app-new/contact_bgr.png') no-repeat;
    background-size: cover;
    padding: 72px 0;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .app-contact:after {
    background: rgba(0, 0, 0, .6);
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1
  }
  .app-page .act-ttl {
    color: #16b0a6;
    font-family: Noto Sans JP, sans-serif;
    font-size: 6rem;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 100px;
    margin-bottom: 44px
  }
  .app-page .act-ttl span {
    display: inline-block;
    font-size: 2.2rem;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 0 10px 25px;
    padding: 0 29px;
    position: relative;
    vertical-align: middle
  }
  .app-page .act-ttl span:after,
  .app-page .act-ttl span:before {
    background-color: #16b0a6;
    bottom: 0;
    content: "";
    height: 2px;
    margin: auto 0;
    position: absolute;
    top: 4px;
    width: 21px
  }
  .app-page .act-ttl span:before {
    left: 0
  }
  .app-page .act-ttl span:after {
    right: 0
  }
  .app-page .act-intro {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 50px;
  }
  .app-page .act-info {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding: 60px 76px 0 0;
    width: 100%
  }
  .app-page .act-info>p {
    font-size: 2.6rem;
    font-weight: 400;
    line-height: 58px;
    margin-bottom: 62px
  }
  .act-btn{
    display: flex;
    justify-content: flex-end;
  }
  .act-btn .app-btn{
    width: 498px;
    margin: 34px 0 0;
  }
  .app-page .act-more {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }
  .app-page .act-more .more-logo {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 120px;
    flex: 0 1 120px
  }
  .app-page .act-more .more-logo img {
    width: 100%
  }
  .app-page .act-more .more-store {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding-left: 21px;
    width: 100%
  }
  .app-page .act-more .more-store h4 {
    font-size: 2.5rem;
    letter-spacing: 1px;
    line-height: 26px;
    margin-bottom: 25px;
    text-align: center
  }
  .app-page .act-more .more-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    justify-content: space-between;
    margin: 0 -6px
  }
  .app-page .act-more .more-lst li {
    margin: 0 6px;
    width: calc(50% - 12px)
  }
  .app-page .act-more .more-lst a {
    display: block
  }
  .app-page .act-more .more-lst img {
    width: 100%
  }
  .app-page .act-gallerires {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -ms-flex-negative: 0;
    -ms-flex: 0 1 752px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex: 0 1 752px;
    justify-content: space-between;
    padding-bottom: 68px;
		padding-top: 130px;
  }
  .app-page .act-gallerires .item {
    /* padding: 14px 29px 25px 32px; */
    position: relative;
    width: 50%;
    z-index: 3
  }
  /* .app-page .act-gallerires .item:before {
    background: url('../img/app-new/main_screen.svg') no-repeat top;
    background-size: cover;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
  } */
  .app-page .act-gallerires .item img {
    border: 0;
    height: auto;
    max-width: 100%;
    vertical-align: top;
    width: 100%
  }
  .app-page .act-gallerires .item:first-child {
    top: 127px
  }
  .app-page .act-materials{
    padding: 171px 0 72px;
  }
  .app-page .act-materials .materials-ttl {
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 48px;
    margin-bottom: 36px;
    text-align: center
  }
  .app-page .act-materials .materials-ttl span {
    color: #16b0a6;
    display: block
  }
  .app-page .act-materials .materials-ctn p {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 24px;
    text-align: center
  }
  .app-page .act-materials .materials-ctn p+p {
    margin-top: 24px
  }
  .app-page .act-materials .materials-ctn figure {
    margin-top: 66px;
    padding-left: 16px;
    text-align: center
  }
  .app-page .function-main {
    padding: 0 0 72px 0
  }
  .app-page .function-arts {
    counter-reset: art
  }
  .app-page .function-art {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }
  .app-page .function-art:nth-child(2n) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse
  }
  .app-page .function-art:nth-child(2n) .art-info {
    padding-left: 62px;
    padding-right: 0
  }
  .app-page .function-art:not(:last-child) {
    margin-bottom: 91px
  }
  .app-page .function-art-cl01 .art-ttl:before {
    color: #16b0a6
  }
  .app-page .function-art-cl01 .art-ctn .symbol {
    background-color: #16b0a6
  }
  .app-page .function-art-cl02 .art-ttl:before {
    color: #f67b62
  }
  .app-page .function-art-cl02 .art-ctn .symbol {
    background-color: #f67b62
  }
  .app-page .function-art-cl03 .art-ttl:before {
    color: #fec800
  }
  .app-page .function-art-cl03 .art-ctn .symbol {
    background-color: #fec800
  }
  .app-page .function-art-cl04 .art-ttl:before {
    color: #889dd9
  }
  .app-page .function-art-cl04 .art-ctn .symbol {
    background-color: #889dd9
  }
  .app-page .function-art-cl05 .art-ttl:before {
    color: #3490d1
  }
  .app-page .function-art-cl05 .art-ctn .symbol {
    background-color: #3490d1
  }
  .app-page .function-art-cl06 .art-ttl:before {
    color: #8cc63f
  }
  .app-page .function-art-cl06 .art-ctn .symbol {
    background-color: #8cc63f
  }
  .app-page .function-art-cl07 .art-ttl:before {
    color: #AA8D46
  }
  .app-page .function-art-cl07 .art-ctn .symbol {
    background-color: #AA8D46
  }
  .app-page .function-screen .art-info {
    padding-right: 0
  }
  .app-page .function-screen .art-gallery {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0
  }
  .app-page .function-screen .art-gallery li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    max-height: 578px;
    overflow: hidden;
    padding: 24px 42px;
    position: relative;
    width: 320px
  }
  .app-page .function-screen .art-gallery li:before {
    background: url('../img/app-new/screen_bgr.png') no-repeat top;
    background-size: contain;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
  }
  .app-page .function-screen .art-gallery li:first-child {
    left: 62px;
    z-index: 2
  }
  .app-page .function-screen .art-gallery li:last-child {
    margin-top: 40px;
    z-index: 1
  }
  .app-page .function-screen:nth-child(2n) .art-info {
    padding-left: 0
  }
  .app-page .function-screen:nth-child(2n) .art-gallery {
    padding-left: 11px
  }
  .app-page .function-screen:nth-child(2n) .art-gallery li:first-child {
    left: 0
  }
  .app-page .function-screen:nth-child(2n) .art-gallery li:last-child {
    padding: 20px 40px 24px;
    right: 58px
  }
  .app-page .function-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: -30px -15px 0;
    padding: 0 14px 0 31px
  }
  .app-page .function-lst li {
    margin: 30px 15px 0;
    width: calc(33.33% - 30px)
  }
  .app-page .function-lst a {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #16b0a6;
    border-radius: 6px;
    font-weight: 600;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1.6rem;
    height: 60px;
    justify-content: center;
    line-height: 24px;
    overflow: hidden;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    text-align: center;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: color .3s ease-in-out;
    -o-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
    width: 100%;
    will-change: color
  }
  .app-page .function-lst a:before {
    background-color: #fff;
    border: 1px solid  #16b0a6;
    border-radius: 6px;
    content: "";
    height: 0;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: height .3s ease-in-out;
    -o-transition: height .3s ease-in-out;
    transition: height .3s ease-in-out;
    width: 100%;
    will-change: height;
    z-index: -1
  }
  .app-page .function-lst a:after {
    background: url('../img/app-new/arr_right.png') no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    height: 14px;
    margin: auto 0;
    position: absolute;
    right: 26px;
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transition: background-image .3s ease-in-out;
    transition: background-image .3s ease-in-out;
    -o-transition: background-image .3s ease-in-out;
    transition: background-image .3s ease-in-out;
    width: 8px
  }
  .app-page .function-lst a:hover {
    color: #16b0a6
  }
  .app-page .function-lst a:hover:before {
    height: 100%
  }
  .app-page .function-lst a:hover:after {
    background-image: url('../img/app-new/arr_right_hv.png')
  }
  .app-page .art-ttl {
    font-size: 2.8rem;
    line-height: 42px;
    font-weight: 700;
    margin-bottom: 21px;
    padding-top: 130px;
    position: relative
  }
  .app-page .art-ttl .small_ttl {
    font-size: 1.4rem;
  }

  .app-page .art-ttl:before {
    content: counter(art, decimal-leading-zero);
    counter-increment: art;
    font-family: Noto Sans JP, sans-serif;
    font-size: 10rem;
    font-weight: 900;
    left: 0;
    letter-spacing: 3px;
    line-height: 114px;
    position: absolute;
    top: 0
  }


  .app-page .art-ttl .manualItem__url--btn {
    font-size: 1.4rem;
    top: 65px;
    left: 143px;
    right: inherit;
  }
  .app-page .art-ttl .manualItem__url--btn::before {
    border-left: 0;
    border-right: 5px solid #169894;
    left: calc(100% + 10px);
    right: inherit
  }
  .app-page .art-ttl .manualItem__url--btn::after {
    left: calc(100% + 15px);
    right: inherit
  }
  .app-page .art-info {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding: 0 66px 0 8px;
    width: 100%
  }
  .app-page .art-ctn>p {
    font-size: 1.6rem;
    line-height: 24px;
    margin-bottom: 27px
  }
  .app-page .art-ctn dl+dl {
    margin-top: 26px
  }
  .app-page .art-ctn dl.no-symbol dd,
  .app-page .art-ctn dl.no-symbol dt {
    padding-left: 0
  }
  .app-page .art-ctn dt {
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 21px;
    margin-bottom: 18px;
    padding-left: 48px;
    position: relative
  }
  .app-page .art-ctn dt .symbol {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 30px;
    justify-content: center;
    left: 5px;
    position: absolute;
    top: -4px;
    width: 30px
  }
  .app-page .art-ctn dt .symbol:before {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }
  .app-page .art-ctn dt .symbol-file:before {
    background-image: url('../img/app-new/ic_file.png');
    height: 18px;
    width: 16px
  }
  .app-page .art-ctn dt .symbol-pencil:before {
    background-image: url('../img/app-new/ic_pencil.png');
    height: 16px;
    width: 16px
  }
  .app-page .art-ctn dt .symbol-list:before {
    background-image: url('../img/app-new/ic_list.png');
    height: 18px;
    width: 14px
  }
  .app-page .art-ctn dt .symbol-map:before {
    background-image: url('../img/app-new/ic_map.png');
    height: 18px;
    width: 14px
  }
  .app-page .art-ctn dt .symbol-chart:before {
    background-image: url('../img/app-new/ic_chart.png');
    height: 20px;
    width: 20px
  }
  .app-page .art-ctn dt .symbol-menu:before {
    background-image: url('../img/app-new/ic_menu.png');
    height: 16px;
    width: 16px
  }
  .app-page .art-ctn dt .symbol-wifi:before {
    background-image: url('../img/app-new/ic_wifi.png');
    height: 12px;
    width: 18px
  }
  .app-page .art-ctn dt .symbol-connect:before {
    background-image: url('../img/app-new/ic_connect.png');
    height: 19px;
    width: 19px
  }
  .app-page .art-ctn dt .symbol-screen:before {
    background-image: url('../img/app-new/ic_screen.png');
    height: 17px;
    width: 20px
  }
  .app-page .art-ctn dt .symbol-camera:before {
    background-image: url('../img/app-new/ic_camera.png');
    height: 24px;
    width: 24px;
  }
  .app-page .art-ctn dt .symbol-graph:before {
    background-image: url('../img/app-new/ic_graph.png');
    height: 24px;
    width: 24px;
  }
  .app-page .art-ctn dd {
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 24px;
    padding-left: 8px
  }
  .app-page .art-gallery {
    -webkit-box-flex: 0;
    background-color: #e3f6f5;
    border-radius: 16px;
    -ms-flex: 0 1 526px;
    flex: 0 1 526px;
    padding: 69px 0 54px
  }
   /* .art-gallery-graph  {
    display: flex;
    flex: 0 1 526px;
    padding: 69px 0 54px;
  }
  .art-gallery-graph li:first-child  {
    left: 0;
    z-index: 2;
    width: 250px;
  }
  .art-gallery-graph li:last-child  {
    right: 0;
    z-index: 2;
    width: 350px;
  }
   .art-gallery-graph li  {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    max-height: 578px;
    overflow: hidden;
  } */
  .app-page .service-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: -30px -15px 64px
  }
  .app-page .service-lst li {
    background-color: #fff;
    border-radius: 6px;
    margin: 30px 15px 0;
    padding: 28px;
    width: calc(25% - 30px)
  }
  .app-page .service-lst h4 {
    font-size: 2rem;
    line-height: 30px;
    font-weight: 700;
    margin-bottom: 16px;
    padding-top: 78px;
    position: relative;
    text-align: center
  }
  .app-page .service-lst h4 .symbol {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 62px;
    justify-content: center;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 62px
  }
  .app-page .service-lst h4 .symbol:before {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }
  .app-page .service-lst h4 .symbol-doc {
    background-color: #16b0a6
  }
  .app-page .service-lst h4 .symbol-doc:before {
    background-image: url('../img/app-new/ic_word.png');
    height: 32px;
    width: 27px
  }
  .app-page .service-lst h4 .symbol-linechart {
    background-color: #fec800;
    opacity: .62
  }
  .app-page .service-lst h4 .symbol-linechart:before {
    background-image: url('../img/app-new/ic_linechart.png');
    height: 35px;
    width: 35px
  }
  .app-page .service-lst h4 .symbol-iot {
    background-color: #00d0d2
  }
  .app-page .service-lst h4 .symbol-iot:before {
    background-image: url('../img/app-new/ic_iot.png');
    height: 37px;
    width: 37px
  }
  .app-page .service-lst h4 .symbol-data {
    background-color: #00acf5
  }
  .app-page .service-lst h4 .symbol-data:before {
    background-image: url('../img/app-new/ic_data.png');
    height: 41px;
    width: 41px
  }
  .app-page .service-lst p {
    font-size: 1.6rem;
    line-height: 24px
  }
  .app-page .service-box {
    background-color: #fff;
    border: 30px solid #f89b51;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    max-width: 710px;
    padding: 24px 50px 16px;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .service-box:before {
    background: url('../img/app-new/bgr_square.png') repeat;
    background-size: 22px 23px;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
  }
  .app-page .service-box .box-ctn {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding-right: 65px;
    width: 100%
  }
  .app-page .service-box .box-ctn h4 {
    font-size: 2.4rem;
    line-height: 36px;
    margin-bottom: 14px
  }
  .app-page .service-box .box-ctn p {
    font-size: 1.6rem;
    line-height: 24px
  }
  .app-page .service-box .box-photo {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 227px;
    flex: 0 1 227px;
    margin: -6px -2px 6px
  }
  .app-page .service-box .box-tag {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #366e6e;
    border-radius: 20px;
    color: #fff;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 1.4rem;
    justify-content: center;
    line-height: 24px;
    margin-bottom: 15px;
    min-width: 134px;
    padding: 5px 10px;
    text-align: center
  }
  .app-page .price-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: -32px -16px 60px
  }
  .app-page .price-lst .item {
    background-color: #fff;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    -webkit-box-shadow: 0 10px 40px rgba(0, 0, 0, .16);
    box-shadow: 0 10px 40px rgba(0, 0, 0, .16);
    margin: 32px 16px 0;
    width: calc(33.33% - 32px)
  }
  .app-page .price-lst .item-ttl {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: #fff;
    font-size: 1.8rem;
    line-height: 27px;
    font-weight: 700;
    padding: 12px 5px 9px;
    text-align: center
  }
  .app-page .price-lst .item-ctn {
    padding: 36px 32px 48px
  }
  .app-page .price-lst .item-ctn p {
    font-size: 1.8rem;
    line-height: 27px
  }
  .app-page .price-lst .item-ctn p:first-child {
    margin-bottom: 45px
  }
  .app-page .price-lst .item-ctn p.note {
    font-size: 1.6rem;
    line-height: 24px
  }
  .app-page .price-lst .item-ctn p.price {
    font-weight: 700;
    text-align: center
  }
  .app-page .price-lst .item-ctn p .num {
    font-size: 3.8rem;
    line-height: 42px
  }
  .app-page .price-lst .item-ctn p .nm {
    font-weight: 400
  }
  .app-page .price-lst .item:first-child .item-ttl {
    background: -o-linear-gradient(180.04deg, #29b952 .05%, rgba(29, 189, 75, .69) 99.98%);
    background: linear-gradient(269.96deg, #29b952 .05%, rgba(29, 189, 75, .69) 99.98%)
  }
  .app-page .price-lst .item:nth-child(2) .item-ttl {
    background: -webkit-gradient(linear, right top, left top, from(#ffa63f), to(#faca34));
    background: -o-linear-gradient(right, #ffa63f 0, #faca34 100%);
    background: linear-gradient(270deg, #ffa63f, #faca34)
  }
  .app-page .price-lst .item:nth-child(2) .price {
    margin-bottom: 10px
  }
  .app-page .price-lst .item:nth-child(3) .item-ttl {
    background: -webkit-gradient(linear, right top, left top, from(#7330cf), color-stop(98.08%, #a25bdd));
    background: -o-linear-gradient(right, #7330cf 0, #a25bdd 98.08%);
    background: linear-gradient(270deg, #7330cf, #a25bdd 98.08%)
  }
  .app-page .code-ttl {
    color: #fff;
    font-family: Noto Sans JP, sans-serif;
    font-size: 6rem;
    font-weight: 700;
    letter-spacing: 2px;
    line-height: 84px;
    margin-bottom: 21px
  }
  .app-page .code-ttl span {
    display: inline-block;
    font-size: 2.2rem;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 0 8px 25px;
    padding: 0 28px;
    position: relative;
    vertical-align: middle
  }
  .app-page .code-ttl span:after,
  .app-page .code-ttl span:before {
    background-color: #fff;
    bottom: 0;
    content: "";
    height: 1px;
    margin: auto 0;
    position: absolute;
    top: 0;
    width: 20px
  }
  .app-page .code-ttl span:before {
    left: 0
  }
  .app-page .code-ttl span:after {
    right: 0
  }
  .app-page .code-ctn {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding-right: 62px;
    width: 100%
  }
  .app-page .code-photo {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 445px;
    flex: 0 1 445px
  }
  .app-page .code-lst {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: -16px -8px 30px
  }
  .app-page .code-lst li {
    margin: 16px 8px 0;
    text-align: center;
    width: calc(50% - 16px)
  }
  .app-page .code-lst a {
    display: block;
    margin-top: 20px
  }
  .app-page .contact-ttl {
    color: #fff;
    font-size: 6rem;
    font-weight: 700;
    line-height: 90px;
    margin-bottom: 44px;
    text-align: center
  }
  .app-page .contact-ttl .jp {
    display: block;
    font-size: 2.2rem;
    line-height: 33px
  }
}

@media only screen and (max-width:768px) {
  .show_pc {
		display: none!important
	}
	.container {
		min-width: 320px;
		overflow: hidden
	}
	.row {
		padding-left: 5.208333333333334vw;
		padding-right: 5.208333333333334vw
	}
  .app-page .cen {
    text-align: center
  }
  .app-page .ttl-main {
    font-size: 5.46875vw;
    font-weight: 700;
    line-height: 7.8125vw;
    margin-bottom: 4.6875vw;
    text-align: center
  }
  .app-page .ttl-main .en {
    color: #16b0a6;
    display: block;
    font-family: Noto Sans JP, sans-serif;
    font-size: 3.3854166666666665vw;
    line-height: 1;
    margin-bottom: 2.34375vw
  }
  .app-page .ttl-mark {
    font-size: 4.947916666666666vw;
    font-weight: 700;
    line-height: 7.8125vw;
    margin-bottom: 9.375vw;
    padding-left: 2.34375vw;
    text-align: center
  }
  .app-page .ttl-mark span {
    border-bottom: 1.0416666666666665vw solid #f7931e;
    color: #16b0a6;
    display: inline-block
  }
  .app-page .app-btn {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: #16b0a6;
    border: 1px solid #16b0a6;
    border-radius: 1.3020833333333335vw;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 3.125vw;
    font-weight: 600;
    justify-content: center;
    line-height: 4.6875vw;
    margin: 3.125vw auto 0;
    outline: 0;
    overflow: hidden;
    padding: 2.604166666666667vw;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    text-align: center;
    -webkit-transform: translate(0);
    transform: translate(0);
    width: 62.5vw
  }
  .app-page .app-btn:after {
    background: url('../img/app-new/arr_right.png') no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    height: 2.734375vw;
    margin: auto 0;
    position: absolute;
    right: 2.604166666666667vw;
    top: 0;
    width: 1.5625vw
  }
  .app-page .app-btn-white {
    background-color: transparent;
    border: 1px solid #fff;
    font-size: 3.3854166666666665vw;
    font-weight: 700;
    width: 100%
  }
  .app-page .app-btn-large {
    font-size: 3.3854166666666665vw;
    font-weight: 600
  }
  .app-page .app-act {
    background: -o-linear-gradient(359.39deg, rgba(22, 176, 166, .012) .81%, rgba(22, 176, 166, 0) 99.76%), -o-linear-gradient(top, rgba(22, 176, 166, .17) 0, rgba(22, 176, 166, .019) 60.04%, rgba(22, 176, 166, 0) 100%);
    background: linear-gradient(90.61deg, rgba(22, 176, 166, .012) .81%, rgba(22, 176, 166, 0) 99.76%), linear-gradient(180deg, rgba(22, 176, 166, .17), rgba(22, 176, 166, .019) 60.04%, rgba(22, 176, 166, 0));
    padding: 17.447916666666664vw 0 11.416666666666668vw
  }
  .app-page .app-service {
    background-color: #faf7f3;
    padding: 10.416666666666668vw 0
  }
  .app-page .app-price {
    background-color: #fff;
    margin-bottom: 19.53125vw;
    padding: 10.416666666666668vw 0;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .app-price:after {
    background-color: #e8f4f6;
    bottom: 0;
    content: "";
    height: 50%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1
  }
  .app-page .app-code {
    background-color: #16b0a6;
    padding: 4.166666666666666vw 0 9.375vw
  }
  .app-page .app-contact {
    background: url('../img/app-new/contact_bgr.png') no-repeat;
    background-size: cover;
    padding: 13.020833333333334vw 0;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .app-contact:after {
    background: rgba(0, 0, 0, .6);
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1
  }
  .app-page .act-ttl {
    color: #16b0a6;
    font-family: Noto Sans JP, sans-serif;
    font-size: 9.114583333333332vw;
    font-weight: 700;
    line-height: 13.020833333333334vw;
    margin-bottom: 4.166666666666666vw
  }
  .app-page .act-ttl span {
    display: inline-block;
    font-size: 4.166666666666666vw;
    line-height: 1;
    margin: 0 0 1.3020833333333335vw 3.2552083333333335vw;
    padding: 0 3.90625vw;
    position: relative;
    vertical-align: middle
  }
  .app-page .act-ttl span:after,
  .app-page .act-ttl span:before {
    background-color: #16b0a6;
    bottom: 0;
    content: "";
    height: .26041666666666663vw;
    margin: auto 0;
    position: absolute;
    top: .5208333333333333vw;
    width: 2.734375vw
  }
  .app-page .act-ttl span:before {
    left: 0
  }
  .app-page .act-ttl span:after {
    right: 0
  }
  .app-page .act-intro {
    margin-bottom: 20.833333333333336vw
  }
  .app-page .act-info {
    margin-bottom: 7.8125vw
  }
  .app-page .act-info>p {
    font-size: 4.947916666666666vw;
    font-weight: 400;
    line-height: 8.072916666666668vw;
    margin-bottom: 8.072916666666668vw
  }
  .app-page .act-more {
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }
  .app-page .act-more .more-logo {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 15.625vw;
    flex: 0 1 15.625vw
  }
  .app-page .act-more .more-logo img {
    width: 100%
  }
  .app-page .act-more .more-store {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding-left: 9.114583333333332vw;
    width: 100%
  }
  .app-page .act-more .more-store h4 {
    font-size: 4.557291666666666vw;
    letter-spacing: .13020833333333331vw;
    line-height: 5.989583333333334vw;
    margin-bottom: 2.864583333333333vw;
    text-align: center
  }
  .app-page .act-more .more-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    justify-content: space-between;
    margin: 0 -1.3020833333333335vw
  }
  .app-page .act-more .more-lst li {
    margin: 0 1.3020833333333335vw;
    width: calc(50% - 2.60417vw)
  }
  .app-page .act-more .more-lst img {
    width: 100%
  }
  .app-page .act-gallerires {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -ms-flex-negative: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-shrink: 0;
    justify-content: space-between;
  }
  .app-page .act-gallerires .item {
    /* padding: 2.213541666666667vw 4.557291666666666vw 3.7760416666666665vw 4.166666666666666vw; */
    position: relative;
    width: 50%;
    z-index: 3
  }
  /* .app-page .act-gallerires .item:before {
    background: url('../img/app-new/main_screen.svg') no-repeat top;
    background-size: cover;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
  } */
  .app-page .act-gallerires .item img {
    border: 0;
    height: auto;
    max-width: 100%;
    vertical-align: top;
    width: 100%
  }
  .app-page .act-materials .materials-ttl {
    font-size: 5.46875vw;
    font-weight: 700;
    line-height: 7.291666666666667vw;
    margin-bottom: 4.6875vw;
    text-align: center
  }
  .app-page .act-materials .materials-ttl span {
    color: #16b0a6;
    display: block;
    margin-bottom: 1.3020833333333335vw
  }
  .app-page .act-materials .materials-ctn p {
    font-size: 3.3854166666666665vw;
    font-weight: 400;
    line-height: 5.208333333333334vw;
    text-align: center
  }
  .app-page .act-materials .materials-ctn p+p {
    margin-top: 3.125vw
  }
  .app-page .act-materials .materials-ctn figure {
    margin-top: 8.59375vw;
    text-align: center
  }

  .app-page .function-main {
    padding: 0 0 9.375vw 0
  }
  .app-page .function-arts {
    counter-reset: art
  }
  .app-page .function-art:not(:last-child) {
    margin-bottom: 11.71875vw
  }
  .app-page .function-art-cl01 .art-ttl:before {
    color: #16b0a6
  }
  .app-page .function-art-cl01 .art-ctn .symbol {
    background-color: #16b0a6
  }
  .app-page .function-art-cl02 .art-ttl:before {
    color: #f67b62
  }
  .app-page .function-art-cl02 .art-ctn .symbol {
    background-color: #f67b62
  }
  .app-page .function-art-cl03 .art-ttl:before {
    color: #fec800
  }
  .app-page .function-art-cl03 .art-ctn .symbol {
    background-color: #fec800
  }
  .app-page .function-art-cl04 .art-ttl:before {
    color: #889dd9
  }
  .app-page .function-art-cl04 .art-ctn .symbol {
    background-color: #889dd9
  }
  .app-page .function-art-cl05 .art-ttl:before {
    color: #3490d1
  }
  .app-page .function-art-cl05 .art-ctn .symbol {
    background-color: #3490d1
  }
  .app-page .function-art-cl06 .art-ttl:before {
    color: #8cc63f
  }
  .app-page .function-art-cl06 .art-ctn .symbol {
    background-color: #8cc63f
  }
  .app-page .function-art-cl07 .art-ttl:before {
    color: #AA8D46
  }
  .app-page .function-art-cl07 .art-ctn .symbol {
    background-color: #AA8D46
  }
  .app-page .function-screen .art-gallery {
    background-color: transparent;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0
  }
  .app-page .function-screen .art-gallery li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    max-height: 75.26041666666666vw;
    overflow: hidden;
    padding: 4.166666666666666vw 4.166666666666666vw 4.557291666666666vw;
    position: relative;
    width: 40.36458333333333vw
  }
  .app-page .function-screen .art-gallery li:before {
    background: url('../img/app-new/screen_bgr.png') no-repeat top;
    background-size: contain;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
  }
  .app-page .function-screen .art-gallery li:first-child {
    left: 6.901041666666667vw;
    z-index: 2
  }
  .app-page .function-screen .art-gallery li:last-child {
    margin-top: 5.208333333333334vw;
    z-index: 1
  }
  .app-page .function-screen:nth-child(2n) .art-gallery li:last-child {
    padding: 2.604166666666667vw 4.166666666666666vw 0
  }

  .app-page .function-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: -2.083333333333333vw -1.0416666666666665vw 0
  }
  .app-page .function-lst li {
    margin: 2.083333333333333vw 1.0416666666666665vw 0;
    width: calc(50% - 2.08333vw)
  }
  .app-page .function-lst a {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #16b0a6;
    border-radius: .78125vw;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 3.3854166666666665vw;
    height: 11.416666666666668vw;
    justify-content: center;
    line-height: 4.4854166666666665vw;
    overflow: hidden;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    text-align: center;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%
  }
  .app-page .function-lst a:after {
    background: url('../img/app-new/arr_right.png') no-repeat;
    background-size: contain;
    bottom: 0;
    content: "";
    height: 2.734375vw;
    margin: auto 0;
    position: absolute;
    right: 2.604166666666667vw;
    top: 0;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    width: 1.5625vw
  }
  .app-page .art-ttl {
    font-size: 4.947916666666666vw;
    line-height: 5.46875vw;
    margin-bottom: 3.90625vw;
    padding-top: 17.708333333333336vw;
    position: relative;
    text-align: center
  }
  .app-page .art-ttl:before {
    content: counter(art, decimal-leading-zero);
    counter-increment: art;
    font-family: Noto Sans JP, sans-serif;
    font-size: 14.322916666666666vw;
    font-weight: 900;
    left: 0;
    letter-spacing: .390625vw;
    line-height: 14.84375vw;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0
  }
  .app-page .art-ttl span {
    display: block;
    font-size: 3.3854166666666665vw;
    font-weight: 400;
    line-height: 4.427083333333334vw;
    transform: inherit;
    left: 56vw;
    top: 8.4578vw;
  }
  .app-page .art-ttl .manualItem__url--btn::before {
    border-left: 0;
    border-right: 5px solid #169894;
    left: calc(100% + 10px);
    right: inherit
  }
  .app-page .art-ttl .manualItem__url--btn::after {
    left: calc(100% + 15px);
    right: inherit
  }
  .app-page .art-info {
    padding-bottom: 7.8125vw
  }
  .app-page .art-ctn>p {
    font-size: 3.3854166666666665vw;
    line-height: 4.427083333333334vw;
    margin-bottom: 6.510416666666667vw;
    text-align: center
  }
  .app-page .art-ctn dl+dl {
    margin-top: 4.6875vw
  }
  .app-page .art-ctn dl.no-symbol dd,
  .app-page .art-ctn dl.no-symbol dt {
    padding-left: 0
  }
  .app-page .art-ctn dt {
    font-size: 3.6458333333333335vw;
    font-weight: 700;
    line-height: 7.8125vw;
    margin-bottom: 2.34375vw;
    padding-left: 9.854166666666668vw;
    position: relative
  }
  .app-page .art-ctn dt .symbol {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 7.8125vw;
    justify-content: center;
    left: 0;
    position: absolute;
    top: -.5208333333333333vw;
    width: 7.8125vw
  }
  .app-page .art-ctn dt .symbol:before {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }
  .app-page .art-ctn dt .symbol-file:before {
    background-image: url('../img/app-new/ic_file.png');
    height: 4.947916666666666vw;
    width: 4.427083333333334vw
  }
  .app-page .art-ctn dt .symbol-pencil:before {
    background-image: url('../img/app-new/ic_pencil.png');
    height: 4.166666666666666vw;
    width: 4.166666666666666vw
  }
  .app-page .art-ctn dt .symbol-list:before {
    background-image: url('../img/app-new/ic_list.png');
    height: 4.6875vw;
    width: 3.6458333333333335vw
  }
  .app-page .art-ctn dt .symbol-map:before {
    background-image: url('../img/app-new/ic_map.png');
    height: 4.817708333333334vw;
    width: 3.6458333333333335vw
  }
  .app-page .art-ctn dt .symbol-chart:before {
    background-image: url('../img/app-new/ic_chart.png');
    height: 4.6875vw;
    width: 4.6875vw
  }
  .app-page .art-ctn dt .symbol-menu:before {
    background-image: url('../img/app-new/ic_menu.png');
    height: 3.90625vw;
    width: 3.90625vw
  }
  .app-page .art-ctn dt .symbol-wifi:before {
    background-image: url('../img/app-new/ic_wifi.png');
    height: 3.125vw;
    width: 4.427083333333334vw
  }
  .app-page .art-ctn dt .symbol-connect:before {
    background-image: url('../img/app-new/ic_connect.png');
    height: 4.166666666666666vw;
    width: 4.427083333333334vw
  }
  .app-page .art-ctn dt .symbol-screen:before {
    background-image: url('../img/app-new/ic_screen.png');
    height: 4.166666666666666vw;
    width: 4.947916666666666vw
  }
  .app-page .art-ctn dt .symbol-graph:before {
    background-image: url('../img/app-new/ic_graph.png');
    height: 5.208333333333334vw;
    width: 5.208333333333334vw
  }
  .app-page .art-ctn dd {
    font-size: 3.3854166666666665vw;
    font-weight: 400;
    line-height: 5.208333333333334vw;
    padding-left: 1.0416666666666665vw
  }
  .app-page .art-gallery {
    background-color: #e3f6f5;
    border-radius: 2.083333333333333vw;
    padding: 5.989583333333334vw 0 7.03125vw
  }
  .app-page .art-gallery img {
    width: 100%
  }
  .app-page .service-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: -2.604166666666667vw -1.3020833333333335vw 8.333333333333332vw
  }
  .app-page .service-lst li {
    background-color: #fff;
    border-radius: 1.3020833333333335vw;
    margin: 2.604166666666667vw 1.3020833333333335vw 0;
    padding: 3.6458333333333335vw;
    width: calc(50% - 2.60417vw)
  }
  .app-page .service-lst h4 {
    font-size: 3.90625vw;
    line-height: 5.208333333333334vw;
    margin-bottom: 2.083333333333333vw;
    padding-top: 15.625vw;
    position: relative;
    text-align: center
  }
  .app-page .service-lst h4 .symbol {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 11.71875vw;
    justify-content: center;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 11.71875vw
  }
  .app-page .service-lst h4 .symbol:before {
    background-repeat: no-repeat;
    background-size: contain;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
  }
  .app-page .service-lst h4 .symbol-doc {
    background-color: #16b0a6
  }
  .app-page .service-lst h4 .symbol-doc:before {
    background-image: url('../img/app-new/ic_word.png');
    height: 6.770833333333333vw;
    width: 5.46875vw
  }
  .app-page .service-lst h4 .symbol-linechart {
    background-color: #fec800;
    opacity: .62
  }
  .app-page .service-lst h4 .symbol-linechart:before {
    background-image: url('../img/app-new/ic_linechart.png');
    height: 6.510416666666667vw;
    width: 6.510416666666667vw
  }
  .app-page .service-lst h4 .symbol-iot {
    background-color: #00d0d2
  }
  .app-page .service-lst h4 .symbol-iot:before {
    background-image: url('../img/app-new/ic_iot.png');
    height: 7.8125vw;
    width: 7.8125vw
  }
  .app-page .service-lst h4 .symbol-data {
    background-color: #00acf5
  }
  .app-page .service-lst h4 .symbol-data:before {
    background-image: url('../img/app-new/ic_data.png');
    height: 7.8125vw;
    width: 7.8125vw
  }
  .app-page .service-lst p {
    font-size: 3.3854166666666665vw;
    line-height: 5.208333333333334vw
  }
  .app-page .service-box {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    border: 2.604166666666667vw solid #f89b51;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 3.3854166666666665vw;
    -webkit-perspective: 1px;
    perspective: 1px;
    position: relative;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
  }
  .app-page .service-box:before {
    background: url('../img/app-new/bgr_square.png') repeat;
    background-size: 2.864583333333333vw 2.994791666666667vw;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
  }
  .app-page .service-box .box-ctn {
    -webkit-box-flex: 1;
    -ms-flex: 1 0;
    flex: 1 0;
    padding-right: 3.90625vw;
    width: 100%
  }
  .app-page .service-box .box-ctn h4 {
    font-size: 4.166666666666666vw;
    line-height: 5.989583333333334vw;
    margin-bottom: 1.8229166666666667vw
  }
  .app-page .service-box .box-ctn p {
    font-size: 3.3854166666666665vw;
    line-height: 5.208333333333334vw
  }
  .app-page .service-box .box-photo {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 29.557291666666668vw;
    flex: 0 1 29.557291666666668vw
  }
  .app-page .service-box .box-photo img {
    height: auto
  }
  .app-page .service-box .box-tag {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #366e6e;
    border-radius: 2.604166666666667vw;
    color: #fff;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 2.604166666666667vw;
    justify-content: center;
    line-height: 3.90625vw;
    margin-bottom: 1.953125vw;
    min-width: 17.447916666666664vw;
    padding: .6510416666666667vw 2.083333333333333vw;
    text-align: center
  }
  .app-page .price-lst {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
  }
  .app-page .price-lst .item {
    background-color: #fff;
    border-bottom-left-radius: 1.3020833333333335vw;
    border-bottom-right-radius: 1.3020833333333335vw;
    -webkit-box-shadow: 0 1.3020833333333335vw 5.208333333333334vw rgba(0, 0, 0, .16);
    box-shadow: 0 1.3020833333333335vw 5.208333333333334vw rgba(0, 0, 0, .16);
    width: 100%
  }
  .app-page .price-lst .item-ttl {
    border-top-left-radius: 1.3020833333333335vw;
    border-top-right-radius: 1.3020833333333335vw;
    color: #fff;
    font-size: 3.6458333333333335vw;
    line-height: 5.208333333333334vw;
    font-weight: 700;
    padding: 2.083333333333333vw .6510416666666667vw;
    text-align: center
  }
  .app-page .price-lst .item-ctn {
    padding: 4.6875vw 4.166666666666666vw 6.25vw;
    text-align: center
  }
  .app-page .price-lst .item-ctn p {
    font-size: 3.6458333333333335vw;
    line-height: 5.208333333333334vw
  }
  .app-page .price-lst .item-ctn p:first-child {
    margin-bottom: 5.859375vw
  }
  .app-page .price-lst .item-ctn p.note {
    font-size: 3.3854166666666665vw
  }
  .app-page .price-lst .item-ctn p.price {
    font-weight: 700;
    text-align: center
  }
  .app-page .price-lst .item-ctn p .num {
    font-size: 6.25vw;
    line-height: 1
  }
  .app-page .price-lst .item-ctn p .nm {
    font-weight: 400
  }
  .app-page .price-lst .item:first-child .item-ttl {
    background: -o-linear-gradient(180.04deg, #29b952 .05%, rgba(29, 189, 75, .69) 99.98%);
    background: linear-gradient(269.96deg, #29b952 .05%, rgba(29, 189, 75, .69) 99.98%)
  }
  .app-page .price-lst .item:nth-child(2) .item-ttl {
    background: -webkit-gradient(linear, right top, left top, from(#ffa63f), to(#faca34));
    background: -o-linear-gradient(right, #ffa63f 0, #faca34 100%);
    background: linear-gradient(270deg, #ffa63f, #faca34)
  }
  .app-page .price-lst .item:nth-child(2) .price {
    margin-bottom: 1.3020833333333335vw
  }
  .app-page .price-lst .item:nth-child(3) .item-ttl {
    background: -webkit-gradient(linear, right top, left top, from(#7330cf), color-stop(98.08%, #a25bdd));
    background: -o-linear-gradient(right, #7330cf 0, #a25bdd 98.08%);
    background: linear-gradient(270deg, #7330cf, #a25bdd 98.08%)
  }
  .app-page .price-lst .item+.item {
    margin-top: 2.604166666666667vw
  }
  .app-page .code-ttl {
    color: #fff;
    font-family: Noto Sans JP, sans-serif;
    font-size: 9.114583333333332vw;
    font-weight: 700;
    letter-spacing: .26041666666666663vw;
    line-height: 11.71875vw;
    margin-bottom: 7.8125vw
  }
  .app-page .code-ttl span {
    display: inline-block;
    font-size: 4.166666666666666vw;
    letter-spacing: 0;
    line-height: 1;
    margin: 0 0 1.0416666666666665vw 3.2552083333333335vw;
    padding: 0 3.90625vw;
    position: relative;
    vertical-align: middle
  }
  .app-page .code-ttl span:after,
  .app-page .code-ttl span:before {
    background-color: #fff;
    bottom: 0;
    content: "";
    height: .26041666666666663vw;
    margin: auto 0;
    position: absolute;
    top: 0;
    width: 3.2552083333333335vw
  }
  .app-page .code-ttl span:before {
    left: 0
  }
  .app-page .code-ttl span:after {
    right: 0
  }
  .app-page .code-ctn {
    margin-bottom: 7.8125vw
  }
  .app-page .code-photo {
    text-align: center
  }
  .app-page .code-photo img {
    width: 57.942708333333336vw
  }
  .app-page .code-lst {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: -3.125vw -1.5625vw 6.510416666666667vw
  }
  .app-page .code-lst li {
    margin: 3.125vw 1.5625vw 0;
    text-align: center;
    width: calc(50% - 3.125vw)
  }
  .app-page .code-lst a {
    display: block;
    margin-top: 2.604166666666667vw
  }
  .app-page .code-lst a img {
    width: 100%
  }
  .app-page .contact-ttl {
    color: #fff;
    font-size: 9.114583333333332vw;
    font-weight: 700;
    line-height: 13.020833333333334vw;
    margin-bottom: 7.8125vw;
    text-align: center
  }
  .app-page .contact-ttl .jp {
    display: block;
    font-size: 4.166666666666666vw;
    line-height: 5.208333333333334vw
  }
}