@charset "UTF-8";
h2, h3, h4 {
  font-weight: 700; }

h2 {
  font-size: 3.0rem; }
  @media screen and (max-width: 768px) {
    h2 {
      font-size: 2.4rem; } }
  @media screen and (max-width: 480px) {
    h2 {
      font-size: 2.0rem; } }

h3 {
  font-size: 2.0rem; }
  @media screen and (max-width: 480px) {
    h3 {
      font-size: 1.8rem; } }
  h3.mg-top {
    margin-top: 80px; }
    @media screen and (max-width: 768px) {
      h3.mg-top {
        margin-top: 60px; } }
    @media screen and (max-width: 480px) {
      h3.mg-top {
        margin-top: 50px; } }

h4 {
  font-size: 2.0rem; }
  @media screen and (max-width: 480px) {
    h4 {
      font-size: 1.8rem; } }

.fix-btn {
  position: fixed;
  top: 20%;
  right: 0;
  width: 60px; }
  @media screen and (max-width: 768px) {
    .fix-btn {
      width: 50px; } }
  @media screen and (max-width: 480px) {
    .fix-btn {
      width: 40px; } }

.inner {
  width: 1080px;
  margin: 0 auto; }
  @media screen and (max-width: 1100px) {
    .inner {
      width: 90%; } }
  @media screen and (max-width: 768px) {
    .inner {
      width: 86%; } }

.column-2 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

.box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }

.en-font {
  font-family: "Poppins", sans-serif;
  font-style: normal; }

.line-breaks {
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-align: left; }

.col-bl {
  color: #027A96; }

/*メインビジュアル*/
#main-area-pc {
  width: 100%;
  margin: 0;
  padding: 0; }
  @media screen and (max-width: 768px) {
    #main-area-pc {
      display: none; } }
  #main-area-pc .main-area-pc-box {
    opacity: 0;
    /*初期は非表示 */
    /*display: none;*/ }
    #main-area-pc .main-area-pc-box .slick-slide {
      margin: 0 !important;
      /* スライド間の余白を強制的に削除 */
      padding: 0 !important; }
      #main-area-pc .main-area-pc-box .slick-slide img {
        width: 100%;
        height: auto;
        /* 高さは自動調整 */ }
    #main-area-pc .main-area-pc-box .slick-track {
      transform: none !important; }
    #main-area-pc .main-area-pc-box .slick-list {
      overflow: hidden;
      /* 左からのスライド防止 */ }
    #main-area-pc .main-area-pc-box figure {
      position: relative;
      width: 94%;
      max-width: 1200px;
      margin: 0 auto;
      display: block;
      z-index: 2; }
    #main-area-pc .main-area-pc-box .box1 {
      position: relative;
      width: 100%;
      /*height: 300px;*/
      /*overflow: hidden;*/
      text-align: center;
      position: relative; }
      #main-area-pc .main-area-pc-box .box1::before, #main-area-pc .main-area-pc-box .box1::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
      #main-area-pc .main-area-pc-box .box1::before {
        background-color: #FDF2CF;
        clip-path: polygon(100% 0, 100% 100%, 0 100%);
        z-index: 1; }
      #main-area-pc .main-area-pc-box .box1::after {
        background-color: #BEDCE8;
        clip-path: polygon(0 0, 100% 0, 0 100%);
        z-index: 1; }
    #main-area-pc .main-area-pc-box .box2 {
      background: url("../images/mv.webp");
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center;
      position: relative; }
      #main-area-pc .main-area-pc-box .box2::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-image: linear-gradient(90deg, rgba(202, 228, 239, 0.8) 37%, rgba(2, 122, 150, 0.8) 37%, rgba(2, 122, 150, 0.8) 63%, rgba(255, 239, 190, 0.8) 63%); }

#main-area-sp {
  display: none; }
  @media screen and (max-width: 768px) {
    #main-area-sp {
      display: block; } }
  #main-area-sp img {
    display: block; }
  #main-area-sp .main-area-sp-box {
    opacity: 0;
    /* 初期は非表示 */ }
    #main-area-sp .main-area-sp-box .slick-slide {
      margin: 0 !important;
      /* スライド間の余白を強制的に削除 */
      padding: 0 !important; }
    #main-area-sp .main-area-sp-box .slick-track {
      transform: none !important; }
    #main-area-sp .main-area-sp-box .slick-list {
      overflow: hidden;
      /* 左からのスライド防止 */ }
    #main-area-sp .main-area-sp-box figure {
      position: relative;
      width: 94%;
      margin: 0 auto;
      display: block;
      z-index: 2; }
    #main-area-sp .main-area-sp-box .box1 {
      color: #FFF;
      position: relative;
      width: 100%;
      /*height: 300px;*/
      overflow: hidden;
      text-align: center;
      position: relative; }
      #main-area-sp .main-area-sp-box .box1::before, #main-area-sp .main-area-sp-box .box1::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
      #main-area-sp .main-area-sp-box .box1::before {
        background-color: #FDF2CF;
        clip-path: polygon(100% 0, 100% 100%, 0 100%);
        z-index: 1; }
      #main-area-sp .main-area-sp-box .box1::after {
        background-color: #BEDCE8;
        clip-path: polygon(0 0, 100% 0, 0 100%);
        z-index: 1; }
      #main-area-sp .main-area-sp-box .box1 .img-text {
        width: 70%;
        max-width: 650px;
        margin: 1em auto 2em; }
      #main-area-sp .main-area-sp-box .box1 .img-main {
        width: 90%;
        max-width: 700px; }
    #main-area-sp .main-area-sp-box .box2 {
      color: #FFF;
      position: relative; }
      #main-area-sp .main-area-sp-box .box2::before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-image: linear-gradient(90deg, rgba(202, 228, 239, 0.8) 50%, rgba(255, 239, 190, 0.8) 50%); }
      #main-area-sp .main-area-sp-box .box2 .bg-col {
        position: relative;
        text-align: center;
        background-color: #4ea1b1;
        padding: 1.5em 0;
        margin-bottom: 1.5em; }
        #main-area-sp .main-area-sp-box .box2 .bg-col .img-text {
          width: 70%;
          max-width: 650px;
          margin: 1em auto 0; }
      #main-area-sp .main-area-sp-box .box2 .img-main {
        width: 80%;
        max-width: 700px;
        margin-bottom: -20px; }

/*トップページ*/
#index-feature, #index-lineup, #index-solution, #index-maintenance-software, #index-column {
  text-align: justify;
  margin: 150px 0; }
  @media screen and (max-width: 1100px) {
    #index-feature, #index-lineup, #index-solution, #index-maintenance-software, #index-column {
      margin: 120px 0; } }
  @media screen and (max-width: 768px) {
    #index-feature, #index-lineup, #index-solution, #index-maintenance-software, #index-column {
      margin: 80px 0; } }
  @media screen and (max-width: 480px) {
    #index-feature, #index-lineup, #index-solution, #index-maintenance-software, #index-column {
      margin: 60px 0; } }
  #index-feature .btn, #index-lineup .btn, #index-solution .btn, #index-maintenance-software .btn, #index-column .btn {
    text-align: center; }
    #index-feature .btn a, #index-lineup .btn a, #index-solution .btn a, #index-maintenance-software .btn a, #index-column .btn a {
      display: flex;
      justify-content: center;
      align-items: center;
      /* 垂直中心 */
      padding: 8px 0;
      width: 300px;
      margin: 3em auto 0;
      border: solid 1px;
      text-align: center;
      position: relative; }
      #index-feature .btn a:after, #index-lineup .btn a:after, #index-solution .btn a:after, #index-maintenance-software .btn a:after, #index-column .btn a:after {
        border-top: 1px solid;
        content: "";
        width: 30px;
        /* 線の長さ */
        position: absolute;
        right: -15px; }

#index-feature h2 {
  font-size: 3.0rem;
  line-height: 1.5em;
  color: #027A96;
  margin-bottom: 1em; }
  @media screen and (max-width: 768px) {
    #index-feature h2 {
      font-size: 2.6rem; } }
  @media screen and (max-width: 480px) {
    #index-feature h2 {
      font-size: 2.2rem; } }
  #index-feature h2 span {
    color: #2CD1BE; }
#index-feature .index-feature-info {
  width: calc(100% - 400px); }
  @media screen and (max-width: 768px) {
    #index-feature .index-feature-info {
      width: 100%; } }
  #index-feature .index-feature-info .btn a {
    color: #027A96;
    border-color: #027A96; }
    #index-feature .index-feature-info .btn a:after {
      border-top-color: #027A96; }
#index-feature .index-feature-move {
  width: 350px; }
  @media screen and (max-width: 768px) {
    #index-feature .index-feature-move {
      width: 100%;
      margin-top: 40px; } }
  #index-feature .index-feature-move .youtube {
    width: 100%;
    margin: 0 auto; }
    #index-feature .index-feature-move .youtube div {
      position: relative;
      padding-bottom: 56.25%;
      /*アスペクト比 16:9の場合の縦幅*/
      height: 0;
      overflow: hidden; }
      #index-feature .index-feature-move .youtube div iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
  #index-feature .index-feature-move .bottom_sp {
    margin-bottom: 40px; }
    @media screen and (max-width: 768px) {
      #index-feature .index-feature-move .bottom_sp {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      #index-feature .index-feature-move .bottom_sp {
        margin-bottom: 20px; } }

#index-lineup {
  background: linear-gradient(90deg, #F4F9FC 0%, #F4F9FC 80%, #FFF 80%, #FFF 100%);
  padding: 0 0 120px;
  margin-top: 180px; }
  @media screen and (max-width: 1100px) {
    #index-lineup {
      padding: 0 0 90px;
      margin-top: 160px; } }
  @media screen and (max-width: 768px) {
    #index-lineup {
      padding: 0 0 70px;
      margin-top: 120px; } }
  @media screen and (max-width: 480px) {
    #index-lineup {
      padding: 0 0 50px;
      margin-top: 110px; } }
  #index-lineup h2 {
    display: inline-block;
    text-align: center;
    margin-top: -4em;
    font-size: 1.6rem;
    color: #454545;
    font-weight: normal; }
    @media screen and (max-width: 768px) {
      #index-lineup h2 {
        margin-top: -3em;
        font-size: 1.4rem; } }
    #index-lineup h2 .font-color {
      color: #027A96; }
    #index-lineup h2 .sub-h2 {
      font-size: 9.0rem;
      line-height: 1.2em; }
      @media screen and (max-width: 768px) {
        #index-lineup h2 .sub-h2 {
          font-size: 7.0rem;
          line-height: 1.4em; } }
      @media screen and (max-width: 480px) {
        #index-lineup h2 .sub-h2 {
          font-size: 5.5rem;
          line-height: 1.4em; } }
  #index-lineup h3 {
    font-size: 3.0rem;
    line-height: 1.5em;
    margin-bottom: 1em;
    color: #454545; }
    @media screen and (max-width: 768px) {
      #index-lineup h3 {
        font-size: 2.4rem; } }
    @media screen and (max-width: 480px) {
      #index-lineup h3 {
        font-size: 2.0rem; } }
    #index-lineup h3.sub-h3 {
      font-size: 2.4rem;
      line-height: 1.5em;
      border-bottom: 1px solid #027A96;
      margin-bottom: 1em;
      padding-bottom: 1em;
      color: #027A96; }
      @media screen and (max-width: 768px) {
        #index-lineup h3.sub-h3 {
          margin-top: 1em;
          font-size: 2.0rem; } }
      @media screen and (max-width: 480px) {
        #index-lineup h3.sub-h3 {
          margin-top: 1em;
          font-size: 1.8rem; } }
  #index-lineup .mg-top {
    margin-top: 60px; }
    @media screen and (max-width: 768px) {
      #index-lineup .mg-top {
        margin-top: 40px; } }
    @media screen and (max-width: 480px) {
      #index-lineup .mg-top {
        margin-top: 30px; } }
  #index-lineup .index-lineup-top .index-lineup-info {
    width: 100%;
    display: flex;
    flex-wrap: wrap; }
    #index-lineup .index-lineup-top .index-lineup-info p {
      width: 80%;
      text-align: justify; }
      @media screen and (max-width: 480px) {
        #index-lineup .index-lineup-top .index-lineup-info p {
          width: 90%; } }
  #index-lineup .index-lineup-info {
    width: calc(100% - 390px); }
    @media screen and (max-width: 768px) {
      #index-lineup .index-lineup-info {
        width: 100%; } }
  #index-lineup .index-lineup-img {
    width: 340px; }
    @media screen and (max-width: 768px) {
      #index-lineup .index-lineup-img {
        width: 100%; } }
  #index-lineup .lineup-item {
    margin: 60px auto 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    @media screen and (max-width: 768px) {
      #index-lineup .lineup-item {
        margin: 40px auto 10px; } }
    @media screen and (max-width: 480px) {
      #index-lineup .lineup-item {
        margin: 30px auto 0; } }
    #index-lineup .lineup-item .item-box {
      width: 23%;
      border: 1px solid #027A96;
      box-sizing: border-box;
      background-color: #FFF; }
      @media screen and (max-width: 768px) {
        #index-lineup .lineup-item .item-box {
          width: 48%;
          margin-bottom: 4%; } }
      @media screen and (max-width: 480px) {
        #index-lineup .lineup-item .item-box {
          width: 100%;
          margin-bottom: 4%; } }
      #index-lineup .lineup-item .item-box figure {
        background-color: #FFF;
        padding: 20px; }
      #index-lineup .lineup-item .item-box p {
        padding: 8px 20px;
        background-color: #027A96;
        color: #FFF;
        text-align: center;
        line-height: 1.4em; }
        #index-lineup .lineup-item .item-box p span {
          font-weight: 700;
          font-size: 2.0rem; }
  #index-lineup .btn-line {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 100px; }
    @media screen and (max-width: 768px) {
      #index-lineup .btn-line {
        margin-bottom: 60px; } }
    @media screen and (max-width: 480px) {
      #index-lineup .btn-line {
        margin-bottom: 50px; } }
    #index-lineup .btn-line .btn {
      text-align: center;
      margin: 15px 20px 0; }
  #index-lineup .btn {
    text-align: left;
    margin: 40px 0 0; }
    #index-lineup .btn a {
      color: #027A96;
      border-color: #027A96;
      background-color: #FFF;
      margin: 0;
      text-align: center; }
      #index-lineup .btn a:after {
        border-top-color: #027A96; }

#index-solution {
  background: linear-gradient(90deg, #FFF 0%, #FFF 20%, #F4F9FC 20%, #F4F9FC 100%);
  padding: 0 0 120px;
  margin-top: 180px; }
  @media screen and (max-width: 1100px) {
    #index-solution {
      padding: 0 0 90px;
      margin-top: 160px; } }
  @media screen and (max-width: 768px) {
    #index-solution {
      padding: 0 0 70px;
      margin-top: 120px; } }
  @media screen and (max-width: 480px) {
    #index-solution {
      padding: 0 0 50px;
      margin-top: 110px; } }
  #index-solution h2 {
    display: inline-block;
    text-align: center;
    margin-top: -4em;
    font-size: 1.6rem;
    color: #454545;
    font-weight: normal;
    margin-bottom: 50px; }
    @media screen and (max-width: 768px) {
      #index-solution h2 {
        margin-top: -3em;
        font-size: 1.4rem;
        margin-bottom: 40px; } }
    #index-solution h2 .font-color {
      color: #027A96; }
    #index-solution h2 .sub-h2 {
      font-size: 9.0rem;
      line-height: 1.2em; }
      @media screen and (max-width: 768px) {
        #index-solution h2 .sub-h2 {
          font-size: 7.0rem;
          line-height: 1.4em; } }
      @media screen and (max-width: 480px) {
        #index-solution h2 .sub-h2 {
          font-size: 5.5rem;
          line-height: 1.4em; } }
  #index-solution .index-solution-top {
    text-align: right; }
    #index-solution .index-solution-top .index-solution-info {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end; }
      #index-solution .index-solution-top .index-solution-info p {
        width: 80%;
        text-align: justify; }
        @media screen and (max-width: 480px) {
          #index-solution .index-solution-top .index-solution-info p {
            width: 100%; } }
  #index-solution .index-solution-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 100px; }
    @media screen and (max-width: 1100px) {
      #index-solution .index-solution-box {
        margin-top: 80px; } }
    @media screen and (max-width: 768px) {
      #index-solution .index-solution-box {
        margin-top: 60px; } }
    @media screen and (max-width: 480px) {
      #index-solution .index-solution-box {
        margin-top: 50px; } }
    #index-solution .index-solution-box .solution-box {
      width: 31%;
      margin-bottom: 6%;
      background-color: #D3E7EF; }
      @media screen and (max-width: 768px) {
        #index-solution .index-solution-box .solution-box {
          width: 48%; } }
      @media screen and (max-width: 480px) {
        #index-solution .index-solution-box .solution-box {
          width: 100%; } }
      #index-solution .index-solution-box .solution-box div {
        padding: 30px;
        cursor: pointer; }
        #index-solution .index-solution-box .solution-box div .title {
          font-weight: 700;
          font-size: 1.8rem;
          line-height: 1.5em;
          border-bottom: 1px dotted #454545;
          margin-bottom: 15px;
          padding-bottom: 15px;
          overflow: hidden;
          /* 溢れた部分を隠す */
          text-overflow: ellipsis;
          /* 溢れた部分を「...」にする */
          white-space: nowrap; }
        #index-solution .index-solution-box .solution-box div .text {
          display: block;
          width: 100%;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          /* 垂直方向に配置 */
          overflow: hidden;
          /* 溢れた部分を隠す */
          text-overflow: ellipsis;
          /* 溢れた部分に「...」を表示 */
          -webkit-line-clamp: 2; }
      #index-solution .index-solution-box .solution-box figure {
        cursor: pointer;
        overflow: hidden; }
        #index-solution .index-solution-box .solution-box figure img {
          width: 100%;
          height: 210px;
          object-fit: cover;
          transition: transform 0.4s; }
          @media screen and (max-width: 1100px) {
            #index-solution .index-solution-box .solution-box figure img {
              height: 25vw; } }
      #index-solution .index-solution-box .solution-box a:hover {
        opacity: 1.0; }
      #index-solution .index-solution-box .solution-box a:hover figure img {
        transform: scale(1.1);
        /* 拡大 */ }
  #index-solution .btn a {
    color: #027A96;
    border-color: #027A96;
    background-color: #FFF; }
    #index-solution .btn a:after {
      border-top-color: #027A96; }

#index-maintenance-software .index-maintenance, #index-maintenance-software .index-software {
  width: 47%; }
  @media screen and (max-width: 768px) {
    #index-maintenance-software .index-maintenance, #index-maintenance-software .index-software {
      width: 100%; } }
  #index-maintenance-software .index-maintenance h2, #index-maintenance-software .index-software h2 {
    text-align: center;
    color: #027A96;
    font-size: 2.4rem;
    background-image: url("../images/index-title-bg.svg");
    background-size: 90%;
    background-repeat: no-repeat;
    background-position: center bottom;
    padding: 20px 0 40px;
    margin-bottom: 50px; }
    @media screen and (max-width: 768px) {
      #index-maintenance-software .index-maintenance h2, #index-maintenance-software .index-software h2 {
        font-size: 2.2rem;
        margin-bottom: 40px; } }
    @media screen and (max-width: 480px) {
      #index-maintenance-software .index-maintenance h2, #index-maintenance-software .index-software h2 {
        font-size: 2.0rem;
        margin-bottom: 30px; } }
  #index-maintenance-software .index-maintenance figure, #index-maintenance-software .index-software figure {
    margin-bottom: 40px; }
    @media screen and (max-width: 768px) {
      #index-maintenance-software .index-maintenance figure, #index-maintenance-software .index-software figure {
        margin-bottom: 30px; } }
    @media screen and (max-width: 480px) {
      #index-maintenance-software .index-maintenance figure, #index-maintenance-software .index-software figure {
        margin-bottom: 20px; } }
@media screen and (max-width: 768px) {
  #index-maintenance-software .index-maintenance {
    padding-bottom: 60px; } }
@media screen and (max-width: 480px) {
  #index-maintenance-software .index-maintenance {
    padding-bottom: 50px; } }
#index-maintenance-software .index-maintenance .btn a {
  color: #027A96;
  border-color: #027A96;
  background-color: #FFF; }
  #index-maintenance-software .index-maintenance .btn a:after {
    border-top-color: #027A96; }
  #index-maintenance-software .index-maintenance .btn a::after {
    border-top-color: #027A96;
    width: 20px;
    right: -15px;
    position: absolute; }
@media screen and (max-width: 768px) {
  #index-maintenance-software .index-software {
    padding-top: 60px; } }
@media screen and (max-width: 480px) {
  #index-maintenance-software .index-software {
    padding-top: 50px; } }
#index-maintenance-software .index-software .btn a {
  color: #027A96;
  border-color: #027A96;
  background-color: #FFF; }
  #index-maintenance-software .index-software .btn a:after {
    border-top-color: #027A96; }
  #index-maintenance-software .index-software .btn a::after {
    border-top-color: #027A96;
    width: 20px;
    right: -15px;
    position: absolute; }

#index-column {
  background: linear-gradient(90deg, #F4F9FC 0%, #F4F9FC 80%, #FFF 80%, #FFF 100%);
  padding: 0 0 120px;
  margin-top: 180px; }
  @media screen and (max-width: 1100px) {
    #index-column {
      padding: 0 0 90px;
      margin-top: 160px; } }
  @media screen and (max-width: 768px) {
    #index-column {
      padding: 0 0 70px;
      margin-top: 120px; } }
  @media screen and (max-width: 480px) {
    #index-column {
      padding: 0 0 50px;
      margin-top: 110px; } }
  #index-column h2 {
    display: inline-block;
    text-align: center;
    margin-top: -4em;
    font-size: 1.6rem;
    color: #454545;
    font-weight: normal;
    margin-bottom: 0; }
    @media screen and (max-width: 768px) {
      #index-column h2 {
        margin-top: -3em;
        font-size: 1.4rem;
        margin-bottom: 0; } }
    #index-column h2 .font-color {
      color: #027A96; }
    #index-column h2 .sub-h2 {
      font-size: 9.0rem;
      line-height: 1.2em; }
      @media screen and (max-width: 768px) {
        #index-column h2 .sub-h2 {
          font-size: 7.0rem;
          line-height: 1.4em; } }
      @media screen and (max-width: 480px) {
        #index-column h2 .sub-h2 {
          font-size: 5.5rem;
          line-height: 1.4em; } }
  #index-column .index-column-top {
    text-align: left; }
    #index-column .index-column-top .index-solution-info {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end; }
      #index-column .index-column-top .index-solution-info p {
        width: 80%;
        text-align: justify; }
        @media screen and (max-width: 480px) {
          #index-column .index-column-top .index-solution-info p {
            width: 100%; } }
  #index-column .index-column-info {
    display: flex;
    flex-wrap: wrap;
    width: 100%; }
  #index-column .index-columu-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 80px auto 100px; }
    @media screen and (max-width: 768px) {
      #index-column .index-columu-box {
        margin: 40px auto 60px; } }
    @media screen and (max-width: 480px) {
      #index-column .index-columu-box {
        margin: 30px auto 50px; } }
    #index-column .index-columu-box .columu-box {
      width: 23%;
      background-color: #D3E7EF; }
      @media screen and (max-width: 768px) {
        #index-column .index-columu-box .columu-box {
          width: 48%;
          margin-bottom: 6%; } }
      @media screen and (max-width: 480px) {
        #index-column .index-columu-box .columu-box {
          width: 100%; } }
      #index-column .index-columu-box .columu-box div {
        padding: 15px 30px;
        /*color: #FFF;*/
        cursor: pointer; }
        #index-column .index-columu-box .columu-box div p {
          font-size: 1.4rem;
          white-space: nowrap;
          /* 折り返し無しにする */
          overflow: hidden;
          /* はみ出た部分を非表示 */
          text-overflow: ellipsis;
          /* 語尾を3点リーダーに */ }
        #index-column .index-columu-box .columu-box div .title {
          font-size: 1.8rem;
          font-weight: 700;
          padding-bottom: 10px;
          margin-bottom: 10px;
          border-bottom: 1px dotted #454545; }
          @media screen and (max-width: 768px) {
            #index-column .index-columu-box .columu-box div .title {
              font-size: 1.6rem; } }
      #index-column .index-columu-box .columu-box figure {
        cursor: pointer;
        overflow: hidden; }
        #index-column .index-columu-box .columu-box figure img {
          width: 100%;
          height: 180px;
          object-fit: cover;
          transition: transform 0.4s; }
          @media screen and (max-width: 1100px) {
            #index-column .index-columu-box .columu-box figure img {
              height: 25vw; } }
      #index-column .index-columu-box .columu-box a:hover {
        opacity: 1.0; }
      #index-column .index-columu-box .columu-box a:hover figure img {
        transform: scale(1.1);
        /* 拡大 */ }
  #index-column .btn a {
    width: 320px;
    color: #027A96;
    border-color: #027A96;
    background-color: #FFF; }
    #index-column .btn a:after {
      border-top-color: #027A96; }

/*トップ　インフォ*/
#company {
  margin: 100px auto 0; }
  @media screen and (max-width: 768px) {
    #company {
      margin: 70px auto 0; } }
  @media screen and (max-width: 480px) {
    #company {
      margin: 50px auto 0; } }
  #company h3 {
    font-size: 2.0rem;
    font-weight: 700;
    margin-bottom: 30px;
    text-align: center;
    width: 100%;
    box-sizing: border-box; }
    @media screen and (max-width: 480px) {
      #company h3 {
        font-size: 1.8rem;
        margin-bottom: 20px; } }
    #company h3.line1 {
      position: relative;
      display: inline-block;
      padding: 0 30%; }
      @media screen and (max-width: 768px) {
        #company h3.line1 {
          padding: 0 22%; } }
      @media screen and (max-width: 480px) {
        #company h3.line1 {
          padding: 0 10%; } }
      #company h3.line1:before, #company h3.line1:after {
        content: '';
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 30%;
        height: 1px;
        background-color: #027A96; }
        @media screen and (max-width: 768px) {
          #company h3.line1:before, #company h3.line1:after {
            width: 22%; } }
        @media screen and (max-width: 480px) {
          #company h3.line1:before, #company h3.line1:after {
            width: 10%; } }
      #company h3.line1:before {
        left: 0;
        background-color: #027A96; }
      #company h3.line1:after {
        right: 0; }
    #company h3.line2 {
      position: relative;
      display: inline-block;
      padding: 0 25%; }
      @media screen and (max-width: 768px) {
        #company h3.line2 {
          padding: 0 18%; } }
      @media screen and (max-width: 480px) {
        #company h3.line2 {
          padding: 0 10%; } }
      #company h3.line2:before, #company h3.line2:after {
        content: '';
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 25%;
        height: 1px;
        background-color: #027A96; }
        @media screen and (max-width: 768px) {
          #company h3.line2:before, #company h3.line2:after {
            width: 18%; } }
        @media screen and (max-width: 480px) {
          #company h3.line2:before, #company h3.line2:after {
            width: 10%; } }
      #company h3.line2:before {
        left: 0;
        background-color: #027A96; }
      #company h3.line2:after {
        right: 0; }
  #company .greeting {
    max-width: 900px;
    width: 90%;
    margin: 0 auto 100px;
    background-color: #FAFAFA;
    padding: 30px 40px 0;
    border-radius: 10px;
    box-sizing: border-box; }
    @media screen and (max-width: 768px) {
      #company .greeting {
        padding: 20px 30px 0;
        margin: 0 auto 70px; } }
    @media screen and (max-width: 480px) {
      #company .greeting {
        margin: 0 auto 50px; } }
    #company .greeting .titleText {
      font-size: 1.8rem;
      font-weight: 700; }
      @media screen and (max-width: 480px) {
        #company .greeting .titleText {
          font-size: 1.6rem; } }
    #company .greeting .text-r {
      text-align: right;
      font-weight: 700; }
    #company .greeting p {
      padding-bottom: 30px; }
  #company .access {
    width: 90%;
    max-width: 900px;
    margin: 100px auto; }
    @media screen and (max-width: 768px) {
      #company .access {
        margin: 70px auto; } }
    @media screen and (max-width: 480px) {
      #company .access {
        margin: 50px auto; } }
    #company .access .googlemap {
      margin: 0 auto; }
      #company .access .googlemap iframe {
        width: 100%;
        height: 460px;
        display: block; }
        @media screen and (max-width: 768px) {
          #company .access .googlemap iframe {
            height: 400px; } }
        @media screen and (max-width: 480px) {
          #company .access .googlemap iframe {
            height: 300px; } }
  #company .comp-info {
    background-color: #FAFAFA;
    padding: 100px 0; }
    @media screen and (max-width: 768px) {
      #company .comp-info {
        padding: 70px 0; } }
    @media screen and (max-width: 480px) {
      #company .comp-info {
        padding: 50px 0; } }
    #company .comp-info dl {
      width: 90%;
      max-width: 900px;
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap; }
      #company .comp-info dl dt, #company .comp-info dl dd {
        box-sizing: border-box;
        padding: 18px 20px;
        border-top: 1px solid #dae1e7; }
        @media screen and (max-width: 768px) {
          #company .comp-info dl dt, #company .comp-info dl dd {
            padding: 15px 16px; } }
        @media screen and (max-width: 480px) {
          #company .comp-info dl dt, #company .comp-info dl dd {
            padding: 12px 10px; } }
      #company .comp-info dl dt {
        width: 10em;
        padding-right: 0; }
        @media screen and (max-width: 768px) {
          #company .comp-info dl dt {
            width: 9em; } }
        @media screen and (max-width: 480px) {
          #company .comp-info dl dt {
            width: 8em; } }
        #company .comp-info dl dt:first-child {
          border-top: none; }
      #company .comp-info dl dd {
        width: calc(100% - 10em);
        padding-left: 0; }
        @media screen and (max-width: 768px) {
          #company .comp-info dl dd {
            width: calc(100% - 9em); } }
        @media screen and (max-width: 480px) {
          #company .comp-info dl dd {
            width: calc(100% - 8em); } }
        #company .comp-info dl dd:nth-child(2) {
          border-top: none; }

#feature, #lilneup, #lilneup-item, #maintenance, #software, #solution {
  margin: 100px auto; }
  @media screen and (max-width: 768px) {
    #feature, #lilneup, #lilneup-item, #maintenance, #software, #solution {
      margin: 70px auto; } }
  @media screen and (max-width: 480px) {
    #feature, #lilneup, #lilneup-item, #maintenance, #software, #solution {
      margin: 50px auto; } }
  #feature .top-text, #lilneup .top-text, #lilneup-item .top-text, #maintenance .top-text, #software .top-text, #solution .top-text {
    font-weight: 700;
    font-size: 2.0rem;
    text-align: center;
    margin-bottom: 2em; }
    @media screen and (max-width: 768px) {
      #feature .top-text, #lilneup .top-text, #lilneup-item .top-text, #maintenance .top-text, #software .top-text, #solution .top-text {
        font-size: 1.8rem; } }
    @media screen and (max-width: 480px) {
      #feature .top-text, #lilneup .top-text, #lilneup-item .top-text, #maintenance .top-text, #software .top-text, #solution .top-text {
        font-size: 1.6rem; } }
  #feature .top-sub-text, #lilneup .top-sub-text, #lilneup-item .top-sub-text, #maintenance .top-sub-text, #software .top-sub-text, #solution .top-sub-text {
    text-align: center;
    max-width: 760px;
    width: 86%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      #feature .top-sub-text, #lilneup .top-sub-text, #lilneup-item .top-sub-text, #maintenance .top-sub-text, #software .top-sub-text, #solution .top-sub-text {
        text-align: justify;
        width: 100%; } }

#feature h3 {
  text-align: center;
  font-size: 2.4rem;
  background-image: url("../images/title-line.svg");
  background-size: 360px;
  background-repeat: no-repeat;
  background-position: center bottom;
  padding: 20px 0 40px;
  margin-bottom: 50px; }
  @media screen and (max-width: 768px) {
    #feature h3 {
      font-size: 2.2rem;
      margin-bottom: 40px; } }
  @media screen and (max-width: 480px) {
    #feature h3 {
      font-size: 2.0rem;
      margin-bottom: 30px; } }
  #feature h3.ctm {
    font-size: 1.8rem;
    line-height: 2.0em;
    background-image: none;
    padding: 0;
    font-weight: normal; }
    @media screen and (max-width: 768px) {
      #feature h3.ctm {
        font-size: 1.6rem;
        line-height: 1.8em; } }
    #feature h3.ctm .en-text {
      font-size: 5.0rem;
      font-weight: 700; }
      @media screen and (max-width: 768px) {
        #feature h3.ctm .en-text {
          font-size: 4.0rem; } }
      @media screen and (max-width: 480px) {
        #feature h3.ctm .en-text {
          font-size: 3.4rem; } }
      #feature h3.ctm .en-text span {
        color: #027A96;
        font-size: 7.0rem; }
        @media screen and (max-width: 768px) {
          #feature h3.ctm .en-text span {
            font-size: 5.6rem; } }
        @media screen and (max-width: 480px) {
          #feature h3.ctm .en-text span {
            font-size: 4.6rem; } }
#feature .scene-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 96%;
  max-width: 800px;
  margin: 0 auto; }
  @media screen and (max-width: 768px) {
    #feature .scene-img {
      justify-content: center; } }
  #feature .scene-img figure {
    width: 17%;
    text-align: center; }
    @media screen and (max-width: 768px) {
      #feature .scene-img figure {
        width: 31%;
        margin-right: 2%;
        margin-bottom: 2%; }
        #feature .scene-img figure:nth-child(3) {
          margin-right: 0; }
        #feature .scene-img figure:last-child {
          margin-right: 0; } }
    #feature .scene-img figure figcaption {
      margin-top: 6px; }
#feature #ic-qr {
  background: linear-gradient(90deg, #F4F9FC 0%, #F4F9FC 50%, #FDFAEF 50%, #FDFAEF 100%);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 100px 0;
  margin: 100px 0; }
  @media screen and (max-width: 768px) {
    #feature #ic-qr {
      padding: 70px 0;
      margin: 70px 0;
      background: linear-gradient(180deg, #F4F9FC 0%, #F4F9FC 50%, #FDFAEF 50%, #FDFAEF 100%); } }
  @media screen and (max-width: 480px) {
    #feature #ic-qr {
      padding: 50px 0;
      margin: 50px 0; } }
  #feature #ic-qr .inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    @media screen and (max-width: 768px) {
      #feature #ic-qr .inner {
        width: 100%; } }
  #feature #ic-qr .ic-qr-ic, #feature #ic-qr .ic-qr-qr {
    width: 50%;
    box-sizing: border-box;
    text-align: center; }
    @media screen and (max-width: 768px) {
      #feature #ic-qr .ic-qr-ic, #feature #ic-qr .ic-qr-qr {
        width: 100%;
        box-sizing: border-box; } }
    #feature #ic-qr .ic-qr-ic .sub-title, #feature #ic-qr .ic-qr-qr .sub-title {
      border-bottom: 1px solid #454545;
      font-size: 1.8rem;
      line-height: 1.6em;
      font-weight: 700;
      margin-bottom: 10px;
      padding-bottom: 5px; }
    #feature #ic-qr .ic-qr-ic .ic-pr-icon, #feature #ic-qr .ic-qr-qr .ic-pr-icon {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-end;
      justify-content: space-between;
      margin-bottom: 80px; }
      @media screen and (max-width: 768px) {
        #feature #ic-qr .ic-qr-ic .ic-pr-icon, #feature #ic-qr .ic-qr-qr .ic-pr-icon {
          margin-bottom: 50px; } }
      @media screen and (max-width: 480px) {
        #feature #ic-qr .ic-qr-ic .ic-pr-icon, #feature #ic-qr .ic-qr-qr .ic-pr-icon {
          margin-bottom: 40px; } }
      #feature #ic-qr .ic-qr-ic .ic-pr-icon img, #feature #ic-qr .ic-qr-qr .ic-pr-icon img {
        width: 120px; }
        @media screen and (max-width: 768px) {
          #feature #ic-qr .ic-qr-ic .ic-pr-icon img, #feature #ic-qr .ic-qr-qr .ic-pr-icon img {
            width: 110px; } }
        @media screen and (max-width: 768px) {
          #feature #ic-qr .ic-qr-ic .ic-pr-icon img, #feature #ic-qr .ic-qr-qr .ic-pr-icon img {
            width: 90px; } }
      #feature #ic-qr .ic-qr-ic .ic-pr-icon div, #feature #ic-qr .ic-qr-qr .ic-pr-icon div {
        width: calc(100% - 140px); }
        @media screen and (max-width: 768px) {
          #feature #ic-qr .ic-qr-ic .ic-pr-icon div, #feature #ic-qr .ic-qr-qr .ic-pr-icon div {
            width: calc(100% - 130px); } }
        @media screen and (max-width: 768px) {
          #feature #ic-qr .ic-qr-ic .ic-pr-icon div, #feature #ic-qr .ic-qr-qr .ic-pr-icon div {
            width: calc(100% - 110px); } }
  #feature #ic-qr .ic-qr-ic {
    padding: 0 5% 0 0;
    text-align: left; }
    @media screen and (max-width: 768px) {
      #feature #ic-qr .ic-qr-ic {
        padding: 0 5% 70px; } }
    @media screen and (max-width: 480px) {
      #feature #ic-qr .ic-qr-ic {
        padding: 0 5% 50px; } }
  #feature #ic-qr .ic-qr-qr {
    padding: 0 0 0 5%;
    text-align: right; }
    @media screen and (max-width: 768px) {
      #feature #ic-qr .ic-qr-qr {
        padding: 70px 5% 0; } }
    @media screen and (max-width: 480px) {
      #feature #ic-qr .ic-qr-qr {
        padding: 50px 5% 0; } }
    #feature #ic-qr .ic-qr-qr .ic-pr-icon {
      flex-direction: row-reverse; }
#feature #customization {
  max-width: 860px;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #feature #customization .custom-box {
    width: 46%;
    margin-bottom: 5%; }
    @media screen and (max-width: 768px) {
      #feature #customization .custom-box {
        width: 100%;
        margin-bottom: 6%; }
        #feature #customization .custom-box:last-child {
          margin-bottom: 0; } }
    @media screen and (max-width: 480px) {
      #feature #customization .custom-box {
        margin-bottom: 8%; } }
    #feature #customization .custom-box div {
      width: 100%; }
      #feature #customization .custom-box div h4 {
        font-size: 1.8rem;
        margin-bottom: 10px; }
        #feature #customization .custom-box div h4 span {
          color: #FFF;
          background-color: #027A96;
          padding: 4px 1em 5px;
          border-radius: 5px; }
#feature #ic-locker-box, #feature #qr-locker-box {
  background: linear-gradient(90deg, #F5F8FC 0%, #F5F8FC 85%, #FFF 85%, #FFF 100%);
  margin: 100px 0;
  padding: 100px 0; }
  @media screen and (max-width: 768px) {
    #feature #ic-locker-box, #feature #qr-locker-box {
      padding: 70px 0;
      margin: 70px 0; } }
  @media screen and (max-width: 480px) {
    #feature #ic-locker-box, #feature #qr-locker-box {
      padding: 50px 0;
      margin: 50px 0; } }
  #feature #ic-locker-box h3, #feature #qr-locker-box h3 {
    text-align: center;
    font-size: 2.4rem;
    background-image: none;
    padding-bottom: 0;
    margin-bottom: 50px; }
    @media screen and (max-width: 768px) {
      #feature #ic-locker-box h3, #feature #qr-locker-box h3 {
        font-size: 2.2rem;
        margin-bottom: 40px; } }
    @media screen and (max-width: 480px) {
      #feature #ic-locker-box h3, #feature #qr-locker-box h3 {
        font-size: 2.0rem;
        margin-bottom: 30px; } }
  #feature #ic-locker-box .top-box, #feature #qr-locker-box .top-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    box-sizing: border-box;
    padding: 0 3% 30px;
    border-bottom: 2px solid #454545; }
    #feature #ic-locker-box .top-box figure, #feature #qr-locker-box .top-box figure {
      width: 100px; }
    #feature #ic-locker-box .top-box p, #feature #qr-locker-box .top-box p {
      width: calc(100% - 115px); }
  #feature #ic-locker-box .text-center, #feature #qr-locker-box .text-center {
    text-align: center;
    width: 100%;
    max-width: 760px;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      #feature #ic-locker-box .text-center, #feature #qr-locker-box .text-center {
        text-align: justify; } }
    #feature #ic-locker-box .text-center span, #feature #qr-locker-box .text-center span {
      font-weight: 700;
      color: #027A96; }
  #feature #ic-locker-box .locker-info, #feature #qr-locker-box .locker-info {
    margin-top: 80px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    @media screen and (max-width: 768px) {
      #feature #ic-locker-box .locker-info, #feature #qr-locker-box .locker-info {
        margin-top: 50px; } }
    @media screen and (max-width: 480px) {
      #feature #ic-locker-box .locker-info, #feature #qr-locker-box .locker-info {
        margin-top: 40px; } }
    #feature #ic-locker-box .locker-info div, #feature #qr-locker-box .locker-info div {
      width: 47%;
      margin-bottom: 5%; }
      @media screen and (max-width: 768px) {
        #feature #ic-locker-box .locker-info div, #feature #qr-locker-box .locker-info div {
          margin-bottom: 8%; } }
      @media screen and (max-width: 480px) {
        #feature #ic-locker-box .locker-info div, #feature #qr-locker-box .locker-info div {
          width: 100%;
          margin-bottom: 10%; } }
      #feature #ic-locker-box .locker-info div figure, #feature #qr-locker-box .locker-info div figure {
        margin-bottom: 0; }
        #feature #ic-locker-box .locker-info div figure figcaption, #feature #qr-locker-box .locker-info div figure figcaption {
          font-size: 1.8rem;
          padding: 0.5em 15px 0;
          font-weight: 700;
          color: #027A96; }
      #feature #ic-locker-box .locker-info div p, #feature #qr-locker-box .locker-info div p {
        padding: 0 15px; }
#feature #ic-locker-box {
  background: linear-gradient(90deg, #F4F9FC 0%, #F4F9FC 85%, #FFF 85%, #FFF 100%); }
  #feature #ic-locker-box .tc-flow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    margin: 5em 0 0;
    text-align: justify;
    /*border: 1px solid #CCC;*/
    padding: 2em;
    background-color: #E9F4F9;
    border-radius: 6px; }
    #feature #ic-locker-box .tc-flow .title {
      text-align: center;
      font-size: 2.4rem;
      font-weight: 700;
      width: 100%;
      margin-bottom: 1em; }
    #feature #ic-locker-box .tc-flow .box-l, #feature #ic-locker-box .tc-flow .box-r {
      width: 48%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      @media screen and (max-width: 768px) {
        #feature #ic-locker-box .tc-flow .box-l, #feature #ic-locker-box .tc-flow .box-r {
          width: 100%; } }
      #feature #ic-locker-box .tc-flow .box-l .sub-title, #feature #ic-locker-box .tc-flow .box-r .sub-title {
        font-weight: 700;
        width: 100%;
        position: relative;
        padding: 0 65px;
        box-sizing: border-box;
        margin-bottom: 0.5em; }
        @media screen and (max-width: 768px) {
          #feature #ic-locker-box .tc-flow .box-l .sub-title, #feature #ic-locker-box .tc-flow .box-r .sub-title {
            margin-top: 2em; } }
        #feature #ic-locker-box .tc-flow .box-l .sub-title:before, #feature #ic-locker-box .tc-flow .box-r .sub-title:before {
          position: absolute;
          top: calc(50% - 0px);
          left: 0;
          width: 100%;
          height: 1px;
          content: '';
          background: #027A96; }
        #feature #ic-locker-box .tc-flow .box-l .sub-title span, #feature #ic-locker-box .tc-flow .box-r .sub-title span {
          position: relative;
          padding: 0 1em;
          background: #E9F4F9;
          color: #027A96;
          border-radius: 5px; }
      #feature #ic-locker-box .tc-flow .box-l .fl-box, #feature #ic-locker-box .tc-flow .box-r .fl-box {
        width: 45%; }
        @media screen and (max-width: 768px) {
          #feature #ic-locker-box .tc-flow .box-l .fl-box, #feature #ic-locker-box .tc-flow .box-r .fl-box {
            font-size: 0.8em;
            line-height: 1.6em; } }
        #feature #ic-locker-box .tc-flow .box-l .fl-box img, #feature #ic-locker-box .tc-flow .box-r .fl-box img {
          border-radius: 5px;
          margin-bottom: 10px; }
      #feature #ic-locker-box .tc-flow .box-l .mrk, #feature #ic-locker-box .tc-flow .box-r .mrk {
        width: 4%;
        padding-top: calc(20% - 0px); }
#feature #qr-locker-box {
  background: linear-gradient(90deg, #FFF 0%, #FFF 15%, #FDFAEF 15%, #FDFAEF 100%); }
  #feature #qr-locker-box .tc-flow {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    margin: 5em auto 0;
    text-align: justify;
    /*border: 1px solid #CCC;*/
    padding: 2em;
    background-color: #FFF7E0;
    border-radius: 6px; }
    @media screen and (max-width: 768px) {
      #feature #qr-locker-box .tc-flow {
        width: 100%; } }
    #feature #qr-locker-box .tc-flow .title {
      text-align: center;
      font-size: 2.4rem;
      font-weight: 700;
      width: 100%;
      margin-bottom: 1em; }
    #feature #qr-locker-box .tc-flow .box-l, #feature #qr-locker-box .tc-flow .box-r {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      @media screen and (max-width: 768px) {
        #feature #qr-locker-box .tc-flow .box-l, #feature #qr-locker-box .tc-flow .box-r {
          width: 100%; } }
      #feature #qr-locker-box .tc-flow .box-l .sub-title, #feature #qr-locker-box .tc-flow .box-r .sub-title {
        font-weight: 700;
        width: 100%;
        position: relative;
        padding: 0 65px;
        box-sizing: border-box;
        margin-bottom: 0.5em; }
        @media screen and (max-width: 768px) {
          #feature #qr-locker-box .tc-flow .box-l .sub-title, #feature #qr-locker-box .tc-flow .box-r .sub-title {
            margin-top: 2em; } }
        #feature #qr-locker-box .tc-flow .box-l .sub-title:before, #feature #qr-locker-box .tc-flow .box-r .sub-title:before {
          position: absolute;
          top: calc(50% - 0px);
          left: 0;
          width: 100%;
          height: 1px;
          content: '';
          background: #027A96;
          color: #027A96; }
        #feature #qr-locker-box .tc-flow .box-l .sub-title span, #feature #qr-locker-box .tc-flow .box-r .sub-title span {
          position: relative;
          padding: 0 1em;
          background: #FFF7E0;
          color: #027A96; }
      #feature #qr-locker-box .tc-flow .box-l .fl-box, #feature #qr-locker-box .tc-flow .box-r .fl-box {
        width: 45%; }
        @media screen and (max-width: 768px) {
          #feature #qr-locker-box .tc-flow .box-l .fl-box, #feature #qr-locker-box .tc-flow .box-r .fl-box {
            font-size: 0.8em;
            line-height: 1.6em; } }
        #feature #qr-locker-box .tc-flow .box-l .fl-box img, #feature #qr-locker-box .tc-flow .box-r .fl-box img {
          border-radius: 5px;
          margin-bottom: 10px; }
      #feature #qr-locker-box .tc-flow .box-l .mrk, #feature #qr-locker-box .tc-flow .box-r .mrk {
        width: 2%;
        padding-top: calc(20% - 0px); }
    #feature #qr-locker-box .tc-flow .box-l {
      margin: 0 auto 2em; }
      #feature #qr-locker-box .tc-flow .box-l .fl-box {
        width: 30%; }
        @media screen and (max-width: 768px) {
          #feature #qr-locker-box .tc-flow .box-l .fl-box {
            font-size: 0.8em;
            line-height: 1.6em; } }
        #feature #qr-locker-box .tc-flow .box-l .fl-box img {
          border-radius: 5px; }
      #feature #qr-locker-box .tc-flow .box-l .mrk {
        width: 2%;
        padding-top: calc(14% - 0px); }

#lilneup .lineup-in {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center; }
  #lilneup .lineup-in .img-area {
    width: 400px; }
    @media screen and (max-width: 1100px) {
      #lilneup .lineup-in .img-area {
        width: 300px; } }
    @media screen and (max-width: 768px) {
      #lilneup .lineup-in .img-area {
        width: 70%;
        margin: 0 auto 10px; } }
    @media screen and (max-width: 480px) {
      #lilneup .lineup-in .img-area {
        width: 100%; } }
  #lilneup .lineup-in .lineup-info {
    width: calc(100% - 400px); }
    @media screen and (max-width: 1100px) {
      #lilneup .lineup-in .lineup-info {
        width: calc(100% - 300px); } }
    @media screen and (max-width: 768px) {
      #lilneup .lineup-in .lineup-info {
        width: 100%;
        margin-left: 0 auto; } }
    #lilneup .lineup-in .lineup-info .icon {
      margin: 1em 0; }
      #lilneup .lineup-in .lineup-info .icon img {
        width: auto;
        height: 60px; }
#lilneup .sub-title-text {
  width: 100%;
  line-height: 1.0em; }
#lilneup h3 {
  width: 100%;
  font-size: 2.4rem;
  line-height: 1.4em;
  color: #027A96;
  margin-bottom: 0.8em; }
  @media screen and (max-width: 768px) {
    #lilneup h3 {
      font-size: 2.0rem; } }
  @media screen and (max-width: 480px) {
    #lilneup h3 {
      font-size: 1.8rem; } }
#lilneup .lineup-box-bl, #lilneup .lineup-box-gr {
  margin: 60px 0;
  padding: 60px 0; }
  @media screen and (max-width: 768px) {
    #lilneup .lineup-box-bl, #lilneup .lineup-box-gr {
      padding: 50px 0;
      margin: 50px 0; } }
  @media screen and (max-width: 480px) {
    #lilneup .lineup-box-bl, #lilneup .lineup-box-gr {
      padding: 40px 0;
      margin: 40px 0; } }
#lilneup .lineup-box-bl {
  background: linear-gradient(90deg, #F5F8FC 0%, #F5F8FC 90%, #FFF 90%, #FFF 100%); }
#lilneup .lineup-box-gr {
  background: linear-gradient(90deg, #FFF 0%, #FFF 10%, #F5F8FC 10%, #F5F8FC 100%); }
#lilneup .btn {
  text-align: center; }
  #lilneup .btn a {
    display: flex;
    justify-content: center;
    align-items: center;
    /* 垂直中心 */
    padding: 8px 0;
    width: 320px;
    margin: 1.5em auto 0;
    color: #027A96;
    border: solid 1px #027A96;
    background-color: #FFF;
    text-align: center;
    position: relative; }
    @media screen and (max-width: 480px) {
      #lilneup .btn a {
        width: 260px; } }
    #lilneup .btn a:after {
      border-top: 1px solid #027A96;
      content: "";
      width: 30px;
      /* 線の長さ */
      position: absolute;
      right: -15px; }
#lilneup .icon-info {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center; }
  #lilneup .icon-info h3 {
    margin: 50px 0 40px;
    color: #454545;
    font-size: 1.8rem;
    align-items: center;
    /* 横線を上下中央 */
    display: flex;
    /* 文字と横線を横並び */
    justify-content: center; }
    @media screen and (max-width: 768px) {
      #lilneup .icon-info h3 {
        font-size: 1.6rem;
        margin: 30px 0 20px; } }
    #lilneup .icon-info h3::before, #lilneup .icon-info h3::after {
      background-color: #027A96;
      /* 横線の色 */
      content: "";
      height: 1px;
      /* 横線の高さ */
      width: 60px; }
    #lilneup .icon-info h3::before {
      margin-right: 15px; }
    #lilneup .icon-info h3::after {
      margin-left: 15px; }
  #lilneup .icon-info .icon-box {
    width: 37%;
    font-size: 1.2rem;
    line-height: 1.6em; }
    @media screen and (max-width: 768px) {
      #lilneup .icon-info .icon-box {
        width: 100%; } }
    #lilneup .icon-info .icon-box .icon-box-info {
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      #lilneup .icon-info .icon-box .icon-box-info figure {
        width: 30%;
        margin: 0 0 1em; }
        #lilneup .icon-info .icon-box .icon-box-info figure img {
          width: 60px;
          margin: 0 auto; }
  #lilneup .icon-info .specification-box {
    width: 50%; }
    @media screen and (max-width: 768px) {
      #lilneup .icon-info .specification-box {
        width: 100%; } }
    #lilneup .icon-info .specification-box .specification-box-info dl {
      display: flex;
      flex-wrap: wrap;
      font-size: 1.4rem;
      text-align: left; }
      #lilneup .icon-info .specification-box .specification-box-info dl dt {
        font-weight: 700;
        width: 9em;
        padding: 5px 0;
        border-top: 1px dotted #CCC; }
        #lilneup .icon-info .specification-box .specification-box-info dl dt:first-child {
          border-top: none; }
      #lilneup .icon-info .specification-box .specification-box-info dl dd {
        width: calc(100% - 9em);
        padding: 5px 0;
        border-top: 1px dotted #CCC; }
        #lilneup .icon-info .specification-box .specification-box-info dl dd:nth-child(2) {
          border-top: none; }
    #lilneup .icon-info .specification-box .specification-box-info p {
      text-align: justify;
      font-size: 1.4rem;
      margin-top: 1em; }

#lilneup-item .lineup-in {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #lilneup-item .lineup-in .img-area {
    width: 500px; }
    @media screen and (max-width: 1100px) {
      #lilneup-item .lineup-in .img-area {
        width: 400px; } }
    @media screen and (max-width: 768px) {
      #lilneup-item .lineup-in .img-area {
        width: 70%;
        margin: 0 auto 0; } }
    @media screen and (max-width: 480px) {
      #lilneup-item .lineup-in .img-area {
        width: 100%; } }
    #lilneup-item .lineup-in .img-area img {
      border-radius: 8px; }
  #lilneup-item .lineup-in .lineup-info {
    width: calc(100% - 550px);
    margin-top: 30px; }
    @media screen and (max-width: 1100px) {
      #lilneup-item .lineup-in .lineup-info {
        width: calc(100% - 430px); } }
    @media screen and (max-width: 768px) {
      #lilneup-item .lineup-in .lineup-info {
        width: 100%;
        margin: 50px auto 0; } }
    #lilneup-item .lineup-in .lineup-info figure {
      margin-bottom: 1em; }
      #lilneup-item .lineup-in .lineup-info figure img {
        width: auto;
        height: 70px; }
    #lilneup-item .lineup-in .lineup-info dl {
      display: flex;
      flex-wrap: wrap;
      margin-top: 1em;
      border-bottom: 1px solid #707070; }
      #lilneup-item .lineup-in .lineup-info dl dt, #lilneup-item .lineup-in .lineup-info dl dd {
        padding: 10px 1em;
        border-top: 1px solid #707070; }
      #lilneup-item .lineup-in .lineup-info dl dt {
        width: 6em;
        font-weight: 700; }
      #lilneup-item .lineup-in .lineup-info dl dd {
        width: calc(100% - 6em); }
#lilneup-item .sub-title-text {
  width: 100%;
  text-align: center;
  font-size: 1.8rem;
  line-height: 1.0em; }
#lilneup-item h3 {
  width: 100%;
  text-align: center;
  font-size: 3.0rem;
  line-height: 1.4em;
  color: #027A96;
  margin-bottom: 1.5em; }
#lilneup-item .lineup-box-bl {
  margin: 60px 0;
  padding: 60px 0;
  background: linear-gradient(90deg, #F5F8FC 0%, #F5F8FC 90%, #FFF 90%, #FFF 100%); }
  @media screen and (max-width: 768px) {
    #lilneup-item .lineup-box-bl {
      padding: 50px 0;
      margin: 50px 0; } }
  @media screen and (max-width: 480px) {
    #lilneup-item .lineup-box-bl {
      padding: 40px 0;
      margin: 40px 0; } }
  #lilneup-item .lineup-box-bl h3 {
    font-size: 2.0rem;
    color: #454545;
    margin-bottom: 0.8em; }
    @media screen and (max-width: 768px) {
      #lilneup-item .lineup-box-bl h3 {
        font-size: 1.8rem; } }
#lilneup-item .info {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 2em;
  background-color: #FFF;
  font-size: 1.4rem;
  line-height: 1.6em;
  text-align: justify;
  border: 1px solid #DDD; }
  @media screen and (max-width: 480px) {
    #lilneup-item .info {
      padding: 1.3em; } }
  #lilneup-item .info p {
    margin-top: 1em; }
  #lilneup-item .info dl {
    width: 48%;
    display: flex;
    flex-wrap: wrap; }
    @media screen and (max-width: 768px) {
      #lilneup-item .info dl {
        width: 100%;
        border-bottom: 1px dotted #999; } }
    #lilneup-item .info dl dt, #lilneup-item .info dl dd {
      padding: 6px 0;
      border-top: 1px dotted #999; }
    #lilneup-item .info dl dt {
      width: 9em;
      font-weight: 700; }
      #lilneup-item .info dl dt:first-child {
        border-top: none; }
    #lilneup-item .info dl dd {
      width: calc(100% - 9em); }
      #lilneup-item .info dl dd:nth-child(2) {
        border-top: none; }
#lilneup-item .btn {
  text-align: center; }
  #lilneup-item .btn a {
    display: flex;
    justify-content: center;
    align-items: center;
    /* 垂直中心 */
    padding: 8px 0;
    width: 320px;
    margin: 1.5em auto 0;
    color: #027A96;
    border: solid 1px #027A96;
    background-color: #FFF;
    text-align: center;
    position: relative; }
    @media screen and (max-width: 480px) {
      #lilneup-item .btn a {
        width: 260px; } }
    #lilneup-item .btn a:after {
      border-top: 1px solid #027A96;
      content: "";
      width: 30px;
      /* 線の長さ */
      position: absolute;
      right: -15px; }

#maintenance .maintenance-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 50px; }
  @media screen and (max-width: 768px) {
    #maintenance .maintenance-top {
      margin-bottom: 40px; } }
  @media screen and (max-width: 480px) {
    #maintenance .maintenance-top {
      margin-bottom: 30px; } }
  #maintenance .maintenance-top p {
    width: 45%; }
    @media screen and (max-width: 768px) {
      #maintenance .maintenance-top p {
        width: 100%; } }
  #maintenance .maintenance-top figure {
    width: 45%; }
    @media screen and (max-width: 768px) {
      #maintenance .maintenance-top figure {
        width: 70%;
        margin: 20px auto 0; } }
#maintenance .maintenance-box {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  padding: 40px 40px;
  background-color: #FDFAEF; }
  @media screen and (max-width: 768px) {
    #maintenance .maintenance-box {
      padding: 30px; } }
  @media screen and (max-width: 480px) {
    #maintenance .maintenance-box {
      padding: 20px; } }
  #maintenance .maintenance-box:nth-child(1), #maintenance .maintenance-box:nth-child(3), #maintenance .maintenance-box:nth-child(5) {
    background-color: #FFF; }
  #maintenance .maintenance-box .text {
    width: calc(100% - 45px); }
  #maintenance .maintenance-box .number {
    width: 45px;
    color: #027A96;
    font-size: 2.0rem;
    line-height: 1.4em;
    font-weight: 700; }
#maintenance .youtube {
  position: relative;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  height: 100%;
  overflow: hidden; }
  #maintenance .youtube .youtube-box {
    z-index: 1;
    /* 内容を前面に表示 */
    width: 850px;
    margin: 100px auto 0; }
    @media screen and (max-width: 1100px) {
      #maintenance .youtube .youtube-box {
        width: 90%; } }
    @media screen and (max-width: 768px) {
      #maintenance .youtube .youtube-box {
        margin: 60px auto 0; } }
    @media screen and (max-width: 480px) {
      #maintenance .youtube .youtube-box {
        margin: 50px auto 0; } }
    #maintenance .youtube .youtube-box div {
      position: relative;
      padding-bottom: 56.25%;
      /*アスペクト比 16:9の場合の縦幅*/
      height: 0;
      overflow: hidden; }
      #maintenance .youtube .youtube-box div iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }

#software h3 {
  font-size: 2.6rem;
  color: #027A96;
  margin-bottom: 0.5em; }
  @media screen and (max-width: 768px) {
    #software h3 {
      font-size: 2.2rem; } }
  @media screen and (max-width: 480px) {
    #software h3 {
      font-size: 1.8rem; } }
#software #software-box {
  background: linear-gradient(90deg, #F5F8FC 0%, #F5F8FC 85%, #FFF 85%, #FFF 100%);
  margin: 100px 0;
  padding: 100px 0; }
  @media screen and (max-width: 768px) {
    #software #software-box {
      padding: 70px 0;
      margin: 70px 0; } }
  @media screen and (max-width: 480px) {
    #software #software-box {
      padding: 50px 0;
      margin: 50px 0; } }
  #software #software-box .info-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 50px auto 0;
    box-sizing: border-box; }
    #software #software-box .info-box div {
      width: 30%; }
      @media screen and (max-width: 768px) {
        #software #software-box .info-box div {
          width: 100%;
          margin-bottom: 40px; }
          #software #software-box .info-box div:last-child {
            margin-bottom: 0; } }
      #software #software-box .info-box div figure {
        width: 100%;
        margin-bottom: 10px; }
      #software #software-box .info-box div .sub-title {
        font-weight: 700;
        color: #027A96;
        font-size: 2.0rem;
        text-align: center; }
        @media screen and (max-width: 768px) {
          #software #software-box .info-box div .sub-title {
            font-size: 1.8rem; } }
        @media screen and (max-width: 480px) {
          #software #software-box .info-box div .sub-title {
            font-size: 1.6rem; } }
  #software #software-box .text-area {
    width: 85%;
    margin: 0 0; }
    @media screen and (max-width: 768px) {
      #software #software-box .text-area {
        width: 100%;
        margin: 0 auto; } }
    #software #software-box .text-area span {
      font-weight: 700;
      color: #027A96; }
#software .software-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #software .software-img img {
    width: 16%; }
    @media screen and (max-width: 768px) {
      #software .software-img img {
        width: 32.5%;
        margin-bottom: 1.25%; } }
#software .f-text {
  text-align: center;
  font-weight: 700;
  font-size: 1.8rem;
  margin: 50px 0; }
  @media screen and (max-width: 768px) {
    #software .f-text {
      width: 90%;
      margin: 40px auto;
      font-size: 1.6rem;
      text-align: justify; } }
  @media screen and (max-width: 480px) {
    #software .f-text {
      font-size: 1.6rem; } }
#software .btn {
  text-align: center; }
  #software .btn a {
    display: flex;
    justify-content: center;
    align-items: center;
    /* 垂直中心 */
    padding: 8px 0;
    width: 320px;
    margin: 3em auto 0;
    color: #027A96;
    border: solid 1px #027A96;
    background-color: #FFF;
    text-align: center;
    position: relative; }
    @media screen and (max-width: 480px) {
      #software .btn a {
        width: 260px; } }
    #software .btn a:after {
      border-top: 1px solid #027A96;
      content: "";
      width: 30px;
      /* 線の長さ */
      position: absolute;
      right: -15px; }

#contact, #privacy, #error, #sitemap {
  width: 860px;
  margin: 100px auto;
  padding: 20px 0; }
  @media screen and (max-width: 1100px) {
    #contact, #privacy, #error, #sitemap {
      width: 90%; } }
  @media screen and (max-width: 768px) {
    #contact, #privacy, #error, #sitemap {
      width: 90%;
      margin: 70px auto; } }
  @media screen and (max-width: 480px) {
    #contact, #privacy, #error, #sitemap {
      margin: 50px auto; } }

/*お問い合わせフォーム*/
#contact {
  max-width: 900px;
  width: 90%; }
  @media screen and (max-width: 1100px) {
    #contact {
      margin: 60px auto; } }
  @media screen and (max-width: 768px) {
    #contact {
      width: 90%;
      margin: 40px auto; } }
  @media screen and (max-width: 480px) {
    #contact {
      margin: 30px auto; } }
  #contact .contact-img {
    width: 560px;
    margin: 80px auto 0; }
    @media screen and (max-width: 768px) {
      #contact .contact-img {
        width: 84%;
        margin: 60px auto 0; } }
    @media screen and (max-width: 480px) {
      #contact .contact-img {
        width: 90%;
        margin: 50px auto 0; } }
  #contact .topText {
    font-size: 20px;
    line-height: 1.8em;
    font-weight: 700;
    text-align: center; }
    @media screen and (max-width: 768px) {
      #contact .topText {
        width: 90%;
        margin: 0 auto;
        text-align: justify; } }
  #contact .topText1 {
    text-align: center; }
    @media screen and (max-width: 480px) {
      #contact .topText1 {
        width: 90%;
        margin: 0 auto;
        text-align: justify; } }
    #contact .topText1 a {
      text-decoration: underline; }

#privacy {
  text-align: justify;
  width: 900px;
  margin: 120px auto 100px; }
  @media screen and (max-width: 1100px) {
    #privacy {
      width: 90%; } }
  @media screen and (max-width: 768px) {
    #privacy {
      width: 86%;
      margin: 60px auto; } }
  #privacy h3 {
    font-size: 2.0rem;
    font-weight: 700;
    margin-bottom: 30px;
    text-align: center;
    width: 100%;
    box-sizing: border-box; }
    @media screen and (max-width: 480px) {
      #privacy h3 {
        font-size: 1.8rem;
        margin-bottom: 20px; } }
    #privacy h3.line1 {
      position: relative;
      display: inline-block;
      padding: 0 30%; }
      @media screen and (max-width: 768px) {
        #privacy h3.line1 {
          padding: 0 22%; } }
      @media screen and (max-width: 480px) {
        #privacy h3.line1 {
          padding: 0 10%; } }
      #privacy h3.line1:before, #privacy h3.line1:after {
        content: '';
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 30%;
        height: 1px;
        background-color: #027A96; }
        @media screen and (max-width: 768px) {
          #privacy h3.line1:before, #privacy h3.line1:after {
            width: 22%; } }
        @media screen and (max-width: 480px) {
          #privacy h3.line1:before, #privacy h3.line1:after {
            width: 10%; } }
      #privacy h3.line1:before {
        left: 0;
        background-color: #027A96; }
      #privacy h3.line1:after {
        right: 0; }
    #privacy h3.line2 {
      position: relative;
      display: inline-block;
      padding: 0 25%; }
      @media screen and (max-width: 768px) {
        #privacy h3.line2 {
          padding: 0 18%; } }
      @media screen and (max-width: 480px) {
        #privacy h3.line2 {
          padding: 0 10%; } }
      #privacy h3.line2:before, #privacy h3.line2:after {
        content: '';
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 25%;
        height: 1px;
        background-color: #027A96; }
        @media screen and (max-width: 768px) {
          #privacy h3.line2:before, #privacy h3.line2:after {
            width: 18%; } }
        @media screen and (max-width: 480px) {
          #privacy h3.line2:before, #privacy h3.line2:after {
            width: 10%; } }
      #privacy h3.line2:before {
        left: 0;
        background-color: #027A96; }
      #privacy h3.line2:after {
        right: 0; }
  #privacy ol {
    margin: 2em 0; }
    #privacy ol li {
      list-style: decimal;
      margin-left: 1.5em; }
  #privacy .textRight {
    text-align: right; }
  #privacy .subText {
    padding: 2em;
    margin: 2em 0;
    background-color: #F6F6F6; }
  #privacy .innText {
    width: 80%;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      #privacy .innText {
        width: 100%; } }
  #privacy dl {
    display: flex;
    flex-wrap: wrap; }
    #privacy dl dt {
      width: 30%;
      padding: 1em 0;
      border-top: 1px dotted #CCC;
      font-weight: 700; }
      #privacy dl dt:first-child {
        border-top: none; }
      @media screen and (max-width: 768px) {
        #privacy dl dt {
          width: 100%;
          padding-bottom: 0; } }
    #privacy dl dd {
      width: 70%;
      padding: 1em 0;
      border-top: 1px dotted #CCC; }
      #privacy dl dd:nth-child(2) {
        border-top: none; }
      @media screen and (max-width: 768px) {
        #privacy dl dd {
          width: 100%;
          padding-top: 0;
          border-top: none; } }
  #privacy .imgArea {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    margin: 30px auto; }
    @media screen and (max-width: 768px) {
      #privacy .imgArea {
        width: 100%; } }
    #privacy .imgArea figure {
      width: 32.5%; }
  #privacy .topMargin {
    margin-top: 1em; }
  #privacy ul {
    width: 90%;
    margin: 30px auto;
    padding: 2em;
    box-sizing: border-box;
    background: repeating-linear-gradient(135deg, rgba(208, 238, 237, 0.8), rgba(208, 238, 237, 0.8) 8px, rgba(219, 239, 241, 0.8) 8px, rgba(219, 239, 241, 0.8) 16px);
    border-radius: 8px; }
    @media screen and (max-width: 768px) {
      #privacy ul {
        width: 100%; } }
    @media screen and (max-width: 480px) {
      #privacy ul {
        padding: 1.2em; } }
    #privacy ul li {
      list-style: disc;
      margin-left: 1.5em;
      margin-bottom: 1em; }
      #privacy ul li:last-child {
        margin-bottom: 0; }
      @media screen and (max-width: 480px) {
        #privacy ul li {
          margin-left: 1.0em; } }
  #privacy .flow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 3% 50px; }
    @media screen and (max-width: 768px) {
      #privacy .flow {
        margin: 0 0 30px; } }
    #privacy .flow figure {
      width: 35%; }
      @media screen and (max-width: 768px) {
        #privacy .flow figure {
          width: 100%;
          margin-bottom: 1.0em; } }
    #privacy .flow p {
      width: 62%; }
      @media screen and (max-width: 768px) {
        #privacy .flow p {
          width: 100%; } }
  #privacy .arrow {
    width: 60px;
    margin: 0 auto 50px; }
    @media screen and (max-width: 768px) {
      #privacy .arrow {
        margin: 0 auto 30px; } }

/*サイトマップ*/
#sitemap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; }
  #sitemap .nav {
    width: 40%;
    margin-left: 10%; }
    #sitemap .nav:first-child {
      margin-left: 0; }
    @media screen and (max-width: 768px) {
      #sitemap .nav {
        width: 100%;
        margin-left: 0; } }
    #sitemap .nav p {
      margin-bottom: 30px; }
      #sitemap .nav p.mg-none {
        margin-bottom: 10px;
        cursor: pointer; }
    #sitemap .nav a {
      font-size: 1.8rem;
      /*color: #EC0E0E;*/
      width: 100%;
      box-sizing: border-box;
      padding-left: 10px;
      border-bottom: 1px solid #027A96;
      background-image: url("../images/arrow01.svg");
      background-size: 1em;
      background-repeat: no-repeat;
      background-position: right 10px top 4px;
      display: inline-block; }
      @media screen and (max-width: 480px) {
        #sitemap .nav a {
          width: 100%;
          box-sizing: border-box; } }
    #sitemap .nav .sub-nav {
      margin-bottom: 2px;
      padding-left: 1em; }
      #sitemap .nav .sub-nav:last-child {
        margin-bottom: 30px; }
      #sitemap .nav .sub-nav a {
        font-size: 1.6rem;
        color: #222;
        width: auto;
        border-bottom: none;
        background-image: none; }
      #sitemap .nav .sub-nav.mg {
        margin-bottom: 20px; }

#error dl {
  margin: 2em auto 0;
  padding: 2em;
  background-color: #F4F4F4; }

.pan {
  width: 1080px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  font-size: 1.2rem; }
  @media screen and (max-width: 1100px) {
    .pan {
      width: 94%; } }
  @media screen and (max-width: 768px) {
    .pan {
      margin: 0 auto 10px; } }
  .pan a {
    text-decoration: underline; }
  .pan .current-page {
    margin-left: 5px; }
    .pan .current-page:before {
      content: "／"; }

.title-area {
  position: relative;
  width: 100%;
  /*height: 300px;*/
  overflow: hidden;
  padding: 40px 0;
  margin-bottom: 10px;
  text-align: center;
  position: relative; }
  @media screen and (max-width: 768px) {
    .title-area {
      padding: 20px 0; } }
  @media screen and (max-width: 480px) {
    .title-area {
      padding: 15px 0; } }
  .title-area::before, .title-area::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .title-area::before {
    background-color: #F4F9FC;
    clip-path: polygon(0 0, 100% 100%, 0 100%);
    z-index: 1; }
  .title-area::after {
    background-color: #FFF;
    clip-path: polygon(0 0, 100% 0, 100% 100%);
    z-index: 1; }
  .title-area .title-in {
    position: relative;
    width: 95%;
    margin: 0 auto;
    display: flex;
    /*flex-wrap: wrap;*/
    align-items: center;
    justify-content: space-between;
    padding: 0 40px;
    z-index: 2; }
    @media screen and (max-width: 768px) {
      .title-area .title-in {
        padding: 0 25px; } }
    @media screen and (max-width: 480px) {
      .title-area .title-in {
        padding: 0 10px; } }
    .title-area .title-in h2 {
      font-size: 1.6rem;
      font-weight: normal; }
      @media screen and (max-width: 768px) {
        .title-area .title-in h2 {
          font-size: 1.6rem; } }
      @media screen and (max-width: 480px) {
        .title-area .title-in h2 {
          font-size: 1.4rem; } }
      .title-area .title-in h2 .en-title {
        font-size: 5.0rem;
        line-height: 1.2em;
        padding: 20px 0;
        text-align: center; }
        @media screen and (max-width: 768px) {
          .title-area .title-in h2 .en-title {
            font-size: 4.0rem;
            padding: 16px 0; } }
        @media screen and (max-width: 480px) {
          .title-area .title-in h2 .en-title {
            font-size: 3.0rem;
            padding: 12px 0; } }
        .title-area .title-in h2 .en-title .font-color {
          color: #027A96; }
      .title-area .title-in h2 .jp-title {
        font-size: 3.0rem;
        line-height: 1.2em;
        padding: 20px 0;
        text-align: center;
        font-weight: 600; }
        @media screen and (max-width: 768px) {
          .title-area .title-in h2 .jp-title {
            font-size: 2.4rem;
            padding: 16px 0; } }
        @media screen and (max-width: 480px) {
          .title-area .title-in h2 .jp-title {
            font-size: 2.0rem;
            padding: 12px 0; } }
    .title-area .title-in .title-img img {
      width: auto;
      max-height: 180px;
      height: 22vw; }

.text-r {
  text-align: right; }

.slick-slide {
  margin: 0 5px; }

.slick-slide img {
  width: 100%;
  height: auto; }

.slick-prev, .slick-next {
  z-index: 1; }

.slick-prev:before, .slick-next:before {
  color: #000; }

.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2; }

.slick-active {
  opacity: 1; }

.slick-current {
  opacity: 1; }

.thumb {
  margin: 20px 0 0; }

.thumb .slick-slide {
  cursor: pointer; }

.thumb .slick-slide:hover {
  opacity: .7; }

.thumb .slick-slide img {
  cursor: pointer;
  border: 1px solid #EEE;
  box-sizing: border-box; }