@charset "UTF-8";

a { word-break: break-all; }

.list-hdg-set .hdg { font-weight: bold !important; }

.l-body * { word-break: normal; }

li {
  word-break: normal;
}

.u-br-pc { display: none; }

.biz-bg-mobilty { background: transparent url(/shared/image/bg_biz_mobility_sp.jpg) no-repeat right bottom; background-size: contain; margin-left: -25px; margin-right: -25px; padding-left: 25px; padding-right: 25px; padding-bottom: 56.9%; }

.biz-bg-mobilty .hdg { padding: 10px 12px; }

.biz-bg-mobilty .lead { font-size: 1.5rem; line-height: 1.5; padding-top: 4.5%; }

.l-inner.mobility { padding-top: 0; padding-bottom: 0; padding-left: 26px; padding-right: 26px; margin-left: -38px; margin-right: -38px; }

.area-mobi01 { background-color: #e8f3f6; padding-top: 1px; padding-bottom: 70px; }

.area-mobi01 .hdg { margin-top: 62px; font-size: 2.1rem; color: #1432aa; line-height: 1.8; font-weight: normal; text-align: center; letter-spacing: 0.18em; }

.area-mobi01 .lead { margin-top: 15px; font-size: 1.6rem; color: #182b68; text-align: center; font-weight: normal; letter-spacing: 0.12em; margin-left: .9em; }

.area-mobi01 .lead > span { margin-left: -.6em; }

.area-mobi02 { background-color: #e8f3f6; }

.area-mobi02 .movie { width: 100%; height: auto; font-size: 0; line-height: 0; margin: 0; padding: 0; }

.area-mobi02 .container { padding: 1px 40px; }

.area-mobi02 .txt { font-size: 1.4rem; color: #182b68; letter-spacing: 0.1em; line-height: 2; }

.area-mobi02.pt-movie { padding-bottom: 100px; }

.mobi-anime-wrap { position: relative; }

.area-mobi02 .mobi-anime-wrap:nth-child(1) .txt { padding-top: 60px; }

.area-mobi02 .mobi-anime-wrap:nth-child(2) .txt { padding-top: 50px; padding-bottom: 50px; }

.area-mobi02 .mobi-anime-wrap:nth-child(3) .txt { padding-bottom: 50px; }

.area-mobi02 .mobi-anime-wrap:nth-child(4) .txt { padding-bottom: 185px; }

.mobi-anime { position: absolute; height: auto; }

.mobi-anime.anime01 { transition: left 1.5s ease-out; left: 0px; top: 12px; }

.mobi-anime.anime01 img { width: 46px; }

.mobi-anime.anime01.anime-active { left: 120px; }

.mobi-anime.anime02 { transition: right 2.5s ease-out; right: -90px; bottom: 20px; }

.mobi-anime.anime02 img { width: 39px; }

.mobi-anime.anime02.anime-active { right: 50px; }

.mobi-anime.anime03 { transition: right 2s ease-out; right: -60px; bottom: 20px; }

.mobi-anime.anime03 img { width: 25px; }

.mobi-anime.anime03.anime-active { right: 140px; }

.mobi-anime.anime04 { transition: left 2s ease-out; left: -150px; bottom: 50px; }

.mobi-anime.anime04 img { width: 119px; }

.mobi-anime.anime04.anime-active { left: 140px; }

.mobi-anime.anime05 { transition: right 2.5s ease-out; right: -90px; bottom: 32px; }

.mobi-anime.anime05 img { width: 39px; }

.mobi-anime.anime05.anime-active { opacity: 1; right: 50px; }

.mobi-anime.anime06 { transition: left 1.2s ease-out; left: -10px; bottom: 0; }

.mobi-anime.anime06 img { width: 98px; }

.mobi-anime.anime06.anime-active { left: 100px; }

.area-mobi03 { padding: 95px 25px 35px; }

.area-mobi03 .hdg { text-align: center; font-size: 1.9rem; color: #1432aa; line-height: 1.2; font-weight: bold; letter-spacing: 2px; }

.area-mobi03 .lead { text-align: center; font-size: 1.3rem; color: #23356e; line-height: 1.8; font-weight: normal; letter-spacing: 1.3px; margin-top: 30px; }

.area-mobi03 .column { position: relative; padding-bottom: 133px; }

.area-mobi03 .column > .body { margin-top: 100px; opacity: 0; -webkit-transform: translateY(150px); transform: translateY(150px); transition: opacity 1.7s, -webkit-transform 1.5s; transition: opacity 1.7s, transform 1.5s; transition: opacity 1.7s, transform 1.5s, -webkit-transform 1.5s; }

.area-mobi03 .column > .body a { display: block; }

.area-mobi03 .column > .body:nth-child(1) .img::before { background: url(/biz/solution/products/image/mobility_thumb01_cover.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(1) a:hover .img::after { background: url(/biz/solution/products/image/mobility_thumb01_ov.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(1) .cover { bottom: -5%; left: 0; }

.area-mobi03 .column > .body:nth-child(2) .img::before { background: url(/biz/solution/products/image/mobility_thumb02_cover.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(2) a:hover .img::after { background: url(/biz/solution/products/image/mobility_thumb02_ov.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(2) .cover { bottom: -15%; left: 2px; }

.area-mobi03 .column > .body:nth-child(3) .img::before { background: url(/biz/solution/products/image/mobility_thumb03_cover.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(3) a:hover .img::after { background: url(/biz/solution/products/image/mobility_thumb03_ov.png) no-repeat center bottom/cover; }

.area-mobi03 .column > .body:nth-child(3) .cover { bottom: -14%; left: 0; }

.area-mobi03 .column > .body .img { position: relative; padding-top: 77.647%; overflow: hidden; }

.area-mobi03 .column > .body .img::before, .area-mobi03 .column > .body .img::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }

.area-mobi03 .column > .body .img img { width: 100%; height: auto; }

.area-mobi03 .column > .body .cover { display: block; content: ''; position: absolute; width: 100%; height: 100%; z-index: -1; }

.area-mobi03 .column > .body .more { display: none; content: ''; position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; z-index: 10; }

.area-mobi03 .column > .body .more img { width: auto; }

.area-mobi03 .column > .body .txt { margin-top: 36px; color: #666666; font-size: 1.5rem; line-height: 1.8; }

.area-mobi03 .column > .body a { color: #577dd7; }

.area-mobi03 .column > .body a:hover { text-decoration: none; }

.area-mobi03 .column > .body a:hover .more { display: block; }

.area-mobi03 .column > .body.anime-active { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }

.area-mobi04 { background-color: #e8f3f6; padding: 95px 25px 100px; }

.area-mobi04 .hdg { text-align: center; font-size: 1.9rem; color: #1432aa; line-height: 1.2; font-weight: bold; letter-spacing: 2px; }

.area-mobi04 .lead { text-align: center; font-size: 1.3rem; color: #23356e; line-height: 1.8; font-weight: normal; letter-spacing: 1.3px; margin-top: 30px; }

.area-mobi04 .column > .body { margin-top: 80px; }

.area-mobi04 .column > .body .img img { width: 100%; height: auto; }

.area-mobi04 .column > .body .hdg { text-align: center; font-size: 1.6rem; color: #1432aa; line-height: 1.5; font-weight: bold; letter-spacing: 2px; display: flex; height: 150px; padding-top: 5px; align-items: center; justify-content: center; }

.area-mobi04 .column > .body .txt { font-size: 1.5rem; color: #666666; line-height: 2; font-weight: normal; letter-spacing: 2px; }

.area-mobi04 .column > .body .btn { margin-top: 75px; }

.area-mobi04 .column > .body .inner { background-color: #fff; border-radius: 0 0 20px 20px; padding: 0 20px 75px; position: relative; }

.area-mobi04 .column > .body .inner::after { content: ''; width: calc(100% - 40px); background-color: #dbe8ed; height: 3px; border-radius: 3px; position: absolute; left: 0; right: 0; margin: auto; top: 0; }

.area-mobi05 { padding: 88px 20px 15px; }

.area-mobi05 .txt { margin-top: 35px; color: #666666; font-size: 1.5rem; line-height: 1.5; }

.mobility-btn { padding-bottom: 115px; position: relative; }

.nav-global > li.g-biz, .nav-global > li.g-technology, .nav-global > li.g-case, .nav-global > li.g-column, .nav-global > li.g-eventseminar { background-color: #d0d6ee; }

.nav-global > li.g-biz > a, .nav-global > li.g-technology > a, .nav-global > li.g-case > a, .nav-global > li.g-column > a, .nav-global > li.g-eventseminar > a { color: #2c47b3; border-bottom: 1px solid #fff; }

.nav-global > li.g-biz > a::before, .nav-global > li.g-technology > a::before, .nav-global > li.g-case > a::before, .nav-global > li.g-column > a::before, .nav-global > li.g-eventseminar > a::before { border-bottom: 2px solid #2c47b3; border-right: 2px solid #2c47b3; }

@media print, all and (min-width: 768px) { .biz-wrap-hdg-sol .inner { width: 700px; } .u-br-sp { display: none; } .u-br-pc { display: inline; } .biz-bg-mobilty { background: transparent url(/shared/image/bg_biz_mobility_pc.jpg) no-repeat right bottom; background-size: auto 250px; height: 250px; padding-bottom: 0; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding-right: calc(50vw - 50%); padding-left: calc(50vw - 50%); max-width: auto; max-width: initial; }
  .biz-bg-mobilty .hdg { font-size: 3.6rem; padding: 0; margin-left: 40px; }
  .biz-bg-mobilty .lead { font-size: 2.4rem; padding-top: 15px; margin-left: 40px; } .l-inner.mobility { padding-top: 0; padding-bottom: 0; padding-left: 40px; padding-right: 40px; margin-left: 0; margin-right: 0; } .area-mobi01 { margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding-right: calc(50vw - 50%); padding-left: calc(50vw - 50%); max-width: auto; max-width: initial; padding-bottom: 76px; } .area-mobi01.pt-movie-none { padding-bottom: 0; }
  .area-mobi01 .hdg { margin-top: 65px; font-size: 2.5rem; }
  .area-mobi01 .lead { margin-top: 15px; font-size: 2.1rem; } .area-mobi02 { margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding-right: 0; padding-left: 0; max-width: auto; max-width: initial; padding-bottom: 1px; }
  .area-mobi02 .container { width: 1120px; margin: 0 auto; padding: 1px 0; }
  .area-mobi02 .txt { text-align: center; font-size: 1.8rem; } .area-mobi02 .mobi-anime-wrap:nth-child(1) .txt { padding-top: 95px; }
  .area-mobi02 .mobi-anime-wrap:nth-child(2) .txt { padding-top: 55px; padding-bottom: 55px; }
  .area-mobi02 .mobi-anime-wrap:nth-child(3) .txt { padding-bottom: 55px; }
  .area-mobi02 .mobi-anime-wrap:nth-child(4) .txt { padding-bottom: 145px; } .mobi-anime.anime01 { transition: left 2s ease-out; left: 0; top: 180px; }
  .mobi-anime.anime01 img { width: 87px; }
  .mobi-anime.anime01.anime-active { left: 230px; }
  .mobi-anime.anime02 { transition: right 3.5s ease-out; right: -120px; bottom: 20px; }
  .mobi-anime.anime02 img { width: 75px; }
  .mobi-anime.anime02.anime-active { right: 238px; }
  .mobi-anime.anime03 { transition: right 1.5s ease-out; right: -50; bottom: 20px; }
  .mobi-anime.anime03 img { width: 51px; }
  .mobi-anime.anime03.anime-active { right: 190px; }
  .mobi-anime.anime04 { transition: left 1.5s ease-out; left: -180px; bottom: 30px; }
  .mobi-anime.anime04 img { width: 224px; }
  .mobi-anime.anime04.anime-active { left: 70px; }
  .mobi-anime.anime05 { transition: right 1.5s ease-out; right: 43px; bottom: 0; }
  .mobi-anime.anime05 img { width: 75px; }
  .mobi-anime.anime05.anime-active { right: 270px; }
  .mobi-anime.anime06 { transition: left 1.2s ease-out; left: 145px; bottom: 0; }
  .mobi-anime.anime06 img { width: 180px; }
  .mobi-anime.anime06.anime-active { left: 175px; bottom: -42px; } .area-mobi03 { padding: 95px 80px 120px; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); }
  .area-mobi03 .hdg { font-size: 2rem; }
  .area-mobi03 .lead { font-size: 1.4rem; }
  .area-mobi03 .column { padding-bottom: 110px; display: flex; margin-left: -80px; }
  .area-mobi03 .column > .body { width: calc(33.333% - 80px); margin-left: 80px; }
  .area-mobi03 .column > .body .txt { margin-top: 26px; } .area-mobi04 { padding: 95px 120px 200px; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); } .area-mobi04:has(+ .area-mobi02.pt-movie) { padding-bottom: 100px; }
  .area-mobi04 .hdg { font-size: 2rem; }
  .area-mobi04 .lead { font-size: 1.4rem; }
  .area-mobi04 .column { display: flex; flex-wrap: wrap; margin-left: -80px; }
  .area-mobi04 .column > .body { width: calc(50% - 80px); margin-left: 80px; margin-top: 100px; }
  .area-mobi04 .column > .body .hdg { height: 250px; padding-top: 15px; }
  .area-mobi04 .column > .body .txt { margin-top: 20px; }
  .area-mobi04 .column > .body .btn-wrap { margin-top: auto; }
  .area-mobi04 .column > .body .btn > a { width: 100%; }
  .area-mobi04 .column > .body .inner { padding: 0 50px 50px; height: 475px; display: flex; flex-direction: column; }
  .area-mobi04 .column > .body .inner::after { content: ''; width: calc(100% - 100px); } .area-mobi05 { padding: 60px 0 0px; }
  .area-mobi05 .txt { text-align: center; } .mobility-btn { padding-bottom: 80px; }
  .mobility-btn .btn > a { min-width: 390px; width: 390px; } .l-inner-full-sp.mobility { background-color: #dfddde; } .nav-global > li.g-biz { background-color: transparent; }
  .nav-global > li.g-biz > a { background-color: #1432aa; color: #fff; border-top: 1px solid #1432aa; border-left: 1px solid #1432aa; border-right: 1px solid #1432aa; border-bottom: 1px solid #1432aa; }
  .nav-global > li.g-biz > a > span::before { border-bottom: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: translateX(3px) translateY(0) rotate(44.999deg); transform: translateX(3px) translateY(0) rotate(44.999deg); }
  .nav-global > li.g-technology, .nav-global > li.g-case, .nav-global > li.g-column, .nav-global > li.g-eventseminar { background-color: transparent; }
  .nav-global > li.g-technology > a, .nav-global > li.g-case > a, .nav-global > li.g-column > a, .nav-global > li.g-eventseminar > a { color: #333; border-bottom: none; }
  .nav-global > li.g-technology > a::before, .nav-global > li.g-case > a::before, .nav-global > li.g-column > a::before, .nav-global > li.g-eventseminar > a::before { border-bottom: none; border-right: none; } }

@media print, all and (min-width: 768px) and (max-width: 1279px) { .biz-bg-mobilty { margin-left: -80px; margin-right: -40px; padding-left: 40px; padding-right: 40px; } .area-mobi01 { margin-left: -80px; margin-right: -80px; padding-left: 40px; padding-right: 40px; } .area-mobi02 { margin-left: -80px; margin-right: -80px; padding-left: 0; padding-right: 0; } .area-mobi04 { margin-right: -80px; margin-left: -80px; } }
