@charset "utf-8";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

* > *:last-child {
    margin-bottom: 0;
}

html {
    overflow-x: hidden;
    overflow-y: scroll;
}

.html {
    line-height: normal;
}

p {
    margin: 0;
}

p + p {
    margin-top: 10px;
}

body,
input,
select,
textarea {
    font-family: Arial,Helvetica,Roboto,"メイリオ",Meiryo,"游ゴシック","Yu Gothic","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    font-size: 100%;
}

body {
    font-size: 16px;
    line-height: 28px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
    margin: 0;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
.h1 small,
.h2 small,
.h3 small,
.h4 small,
.h5 small,
.h6 small,
h1 .small,
h2 .small,
h3 .small,
h4 .small,
h5 .small,
h6 .small,
.h1 .small,
.h2 .small,
.h3 .small,
.h4 .small,
.h5 .small,
.h6 .small {
    font-weight: normal;
    line-height: inherit;
    color: inherit;
}

i[class*="fa-"] {
    margin-right: 0.5em;
    font-size: 40px;
}

.tulink {
    text-decoration: underline;
}

.text-yellow {
    color: #f90;
}

.luc {
    cursor: default;
}

#main {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
}

#main .swiper-slide{
    height: 500px;
    overflow: hidden;
}

#main .swiper-slide img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#main-bg + article section:first-child {
    padding-top: 20px;
}

#cloud-area {
    background: #efefef;
    padding: 30px 0;
    line-height: 1.5;
}

#cloud-area .container {
    display: table;
    table-layout: fixed;
}

#cloud-area small {
    font-size: 11px;
    color: #f60;
}

#cloud-area .t1 {
    display: table-cell;
    width: 20%;
    padding: 15px;
    background: #444;
    color: #fff;
    text-align: center;
    vertical-align: middle;
}

#cloud-area .t2 {
    display: table-cell;
    width: 40%;
    padding: 15px;
    background: #fff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
}

#cloud-area .t3 {
    display: table-cell;
    width: 40%;
    padding: 15px;
    background: #fff;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
}

#cloud-area .t3n {
    display: table-cell;
    width: 40%;
    padding: 15px;
    background: #efefef;
    color: #999;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
    text-align: center;
    font-weight: bold;
    vertical-align: middle;
}

.mw-s {
    max-width: 150px;
    height: auto;
}


section {
    padding: 90px 0;
}

section p:last-child {
    margin-bottom: 0;
}

.lead {
    text-align: center;
    font-weight: bold;
    margin: 0 0 50px;
}

.cap {
    text-align: center;
    font-size: 14px;
    line-height: 1;
}

/* index */
h2.tit-appeal {
    text-align: center;
    position: relative;
    margin-bottom: 90px;
    font-size: 36px;
    line-height: 1;
}

h2.tit-appeal:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #1a2c6a;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.ssc {
    display: block;
    height: 100%;
    border: 1px solid #ddd;
    text-align: center;
    font-size: 14px;
    line-height: 24px;
    padding: 24px;
}

a.ssc:hover {
    box-shadow: 0 0 18px rgba(0,0,0,.15);
}

.ssc > h3 {
    font-size: 24px;
    line-height: 1;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100%;
    margin: -25px -25px 25px;
    font-weight: bold;
}

.ssc > h3 > span {
    display: block;
    margin-bottom: 24px;
}

.blue-office {
    background: url(../images/bg-index.jpg) center top no-repeat #374d98;
    color: #fff;
    padding: 0;
}

.blue-office a {
    color: #ffc600;
}

.blue-office a:hover {
    color: #ffc600;
    text-decoration: underline;
}

#topix {
    display: table;
    width: 100%;
    table-layout: fixed;
}

#topix h2,
#topix .nws-article {
    display: table-cell;
    vertical-align: middle;
}

#topix h2 {
    color: #fff;
    font-size: 48px;
    width: 190px;
    background: linear-gradient(to left, #1b3280 0%,#374d98 100%);
    padding: 60px 0;
    position: relative;
    font-weight: normal;
}

#topix h2:after {
    content: "";
    position: absolute;
    top: 50%;
    right: -30px;
    margin-top: -30px;
    border-style: solid;
    border-width: 30px 0 30px 32px;
    border-color: transparent transparent transparent #1b3280;
}

.nws-article {
    padding: 60px 0 60px 140px;
}

.tpx-tb {
    width: 100%;
    font-size: 14px;
}

.tpx-tb th {
    padding: 10px 0;
    vertical-align: top;
    white-space: nowrap;
    line-height: 20px;
    width: 110px;
    font-weight: normal;
}

.tpx-tb td {
    padding: 10px 0;
    vertical-align: top;
    word-break: break-all;
    line-height: 20px;
}

.tpx-tb td img {
    vertical-align: middle;
    margin-left: 0.5em;
}

.feature-box {
    display: table;
    width: 100%;
    table-layout: fixed;
    color: #fff;
}

.feature {
    display: table-cell;
    vertical-align: top;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 33.3333%;
    padding: 25px;
}

.feature h4 {
    text-align: center;
    margin-bottom: 15px;
    line-height: 1.6;
}

.feature h4 small {
    display: block;
    margin-top: 10px;
}

/* jacross */
#jacross01 {
    background: url(../images/bg-jacross01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#jacross02 {
    background: #374d98;
    position: relative;
    color: #fff;
    padding: 120px 0;
}

#jacross02 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jacross02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jacross02 .feature.f1 {
    background-color: #1a2c6a;
}

#jacross02 .feature.f2 {
    background-color: #263772;
}

#jacross02 .feature.f3 {
    background-color: #304179;
}

#jacross03 {
    background: url(../images/bg-jacross02.jpg) center top no-repeat #68749d;
    color: #fff;
}

#jacross03 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jacross03 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jacross03 h4 {
    color: #fff;
    border-color: #fff;
    font-weight: normal;
}

#jacross03 .lead {
    text-align: left;
    line-height: 1.7;
    text-shadow: 0 0 5px rgba(0,0,0,.7);
}

#jacross04 {
    background: url(../images/bg-jacross03.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#jacross04 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jacross04 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jacross05 {
    background: url(../images/bg-jacross05.jpg) center top no-repeat #fff;
    padding: 120px 0;
}

#jacross06 {
    background: #efefef;
    padding: 0 0 120px 0;
}

/* jacross-flat */
#jacross-flat01 {
    background: url(../images/bg-jacross-flat01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#jacross-flat02 {
    background: url(../images/bg-jacross-flat02.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
    padding: 120px 0;
}

#jacross-flat02 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jacross-flat02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jacross-flat02 .feature.f1 {
    background-color: #1a2c6a;
}

#jacross-flat02 .feature.f2 {
    background-color: #263772;
}

#jacross-flat02 .feature.f3 {
    background-color: #304179;
}

#jacross-flat03 {
    background: url(../images/bg-jacross-flat03.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

.scn {
    display: block;
    border: 1px solid #ddd;
    font-size: 14px;
    line-height: 24px;
    padding: 24px;
    background: #fff;
}

.ssc > span {
    display: block;
    margin-bottom: 24px;
}

#jacross-flat04 {
    background: url(../images/bg-jacross-flat04.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#jacross-flat04 h3 {
    color: #fff;
}

#jacross-flat05 {
    background: url(../images/bg-jacross-flat05.jpg) center top no-repeat #fff;
    padding: 120px 0;
}

#jacross-flat06 {
    background: #efefef;
    padding: 0 0 120px 0;
}

/* azureprice */
#azureprice01 {
    background: #fff;
    padding: 120px 0;
}

#azureprice02 {
    background: #efefef;
    position: relative;
    padding: 0 0 120px 0;
}

#azureprice02 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#azureprice02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/* awsprice */
#awsprice01 {
    background: #fff;
    padding: 120px 0;
}

#awsprice02 {
    background: #efefef;
    padding: 0 0 120px 0;
}

#awsprice02 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#awsprice02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/* onelogin */
#onelogin01 {
    background: url(../images/bg-onelogin01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#onelogin02 {
    background: #374d98;
    position: relative;
    color: #fff;
}

#onelogin02 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#onelogin02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#onelogin02 .feature.f1 {
    background-color: #1a2c6a;
}

#onelogin02 .feature.f2 {
    background-color: #263772;
}

#onelogin02 .feature.f3 {
    background-color: #304179;
}

#onelogin03 {
    background: #68749d;
}

#onelogin03 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#onelogin03 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#onelogin04 {
    background: url(../images/bg-onelogin04.jpg) center top no-repeat #efefef;
    position: relative;
}

#onelogin04 h3 {
    position: relative;
    margin-bottom: 45px;
}

section#onelogin04 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #1a2c6a;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#onelogin05 {
    background: url(../images/bg-onelogin05.jpg) center top no-repeat #374d98;
    padding: 120px 0 200px 0;
    position: relative;
}
.onelogin05_1 {
    padding: 120px 0 !important;
    background-color: #304385 !important;
}

#onelogin05 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#onelogin05 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/*#onelogin06{background: url(../images/bg-onelogin05.jpg) center top no-repeat #374d98;padding: 120px 0;}
#onelogin06 h3{text-align: center;color:#fff;position: relative;margin-bottom: 90px;}
section#onelogin06 > .container > h3:after{content:"";width: 210px;height: 3px;left: 50%;margin-left: -105px;background: #fff;bottom: 0;position: absolute;bottom: -44px;}*/
#onelogin-arrow {
    text-shadow: 0 0 5px rgba(0,0,0,.8);
    font-size: 26px;
    line-height: 1.3;
    background: url(../images/onelogin-last.png) no-repeat center bottom;
    width: 800px;
    min-height: 190px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    position: absolute;
    bottom: -65px;
    left: 50%;
    margin-left: -400px;
}

#onelogin-arrow span {
    font-size: 46px;
    color: #fc0;
}

table.pln-tb {
    border-spacing: 0;
    border-collapse: separate;
    width: 100%;
    background: #fff;
}

.pln-tb th {
    width: 1%;
    white-space: nowrap;
    padding: .875em;
}

.pln-tb td {
    width: 99%;
    padding: .875em;
    vertical-align: top;
}

.pln-tb {
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    line-height: 1.25;
}

.pln-tb th {
    color: #fff;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-image: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
    text-align: left;
    width: 7em;
    text-align: center;
}

.pln-tb td {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #f9f9f9;
    width: auto;
    vertical-align: top;
    text-align: center;
}

.pln-tb td h4 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    border-bottom: none;
    padding-bottom: 0;
}

.pln-tb td p + h4 {
    margin-top: 15px;
}

.pln-tb td strong {
    display: inline-block;
    width: 19em;
}

.pln-tb td span {
    display: inline-block;
    width: 2.5em;
    text-align: right;
    margin-right: 2em;
}

table.svc-tb {
    border-spacing: 0;
    border-collapse: separate;
    width: 100%;
    background: #fff;
}

.svc-tb th {
    width: 1%;
    white-space: nowrap;
    padding: .875em;
}

.svc-tb td {
    width: 99%;
    padding: .875em;
    vertical-align: top;
    color: #333;
}

.svc-tb {
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    line-height: 1.25;
}

.svc-tb th {
    color: #fff;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-image: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
    text-align: left;
    width: 7em;
    text-align: center;
}

.svc-tb td {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #f9f9f9;
    width: auto;
    vertical-align: top;
}

.svc-tb td h4 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    border-bottom: none;
    padding-bottom: 0;
}

.svc-tb td p + h4 {
    margin-top: 15px;
}

.svc-tb td strong {
    display: inline-block;
    width: 19em;
}

.svc-tb td span {
    display: inline-block;
    width: 2.5em;
    text-align: right;
    margin-right: 2em;
}

table.jacross-tb {
    border-spacing: 0;
    border-collapse: separate;
    width: 100%;
    background: #fff;
}

.jacross-tb .grandhead th {
    width: 1%;
    white-space: nowrap;
    padding: .875em;
}

.jacross-tb .grandhead th:first-child {
    text-align: left;
}

.jacross-tb th {
    width: 1%;
    white-space: nowrap;
    padding: .875em;
}

.jacross-tb td {
    width: 99%;
    padding: .875em;
}

.jacross-tb {
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
    line-height: 1.25;
}

.jacross-tb .grandhead th {
    color: #fff;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-image: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
    text-align: left;
    width: 7em;
    text-align: center;
}

.jacross-tb th {
    color: #fff;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #424f7b;
    text-align: left;
    width: 7em;
    text-align: center;
}

.jacross-tb td {
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #f9f9f9;
    width: auto;
}

.jacross-tb td:first-child {
    white-space: nowrap;
}

.jacross-tb td h4 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    border-bottom: none;
    padding-bottom: 0;
}

.jacross-tb td p + h4 {
    margin-top: 15px;
}

.jacross-tb td strong {
    display: inline-block;
    width: 19em;
}

.jacross-tb td span {
    display: inline-block;
    width: 2.5em;
    text-align: right;
    margin-right: 2em;
}

/* jhive */
#jhive01 {
    background: url(../images/bg-jhive01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#jhive02 {
    background: url(../images/bg-jhive02.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#jhive02 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jhive02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jhive02 .feature.f1 {
    background-color: #1a2c6a;
}

#jhive02 .feature.f2 {
    background-color: #263772;
}

#jhive02 .feature.f3 {
    background-color: #304179;
}

#jhive03 {
    background: #68749d;
}

#jhive03 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jhive03 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.box {
    background: #fff;
    border: 1px solid #ddd;
    padding: 24px;
    color: #333;
}

.box h4 {
    font-size: 27px;
    margin-bottom: 20px;
}

.box h5 {
    font-size: 21px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
    color: #1a2c6a;
}

.box02 {
    background: #1a2c6a;
    padding: 24px;
    color: #fff;
    border: 1px solid #ddd;
}

.box03 {
  background: #9bbf90;
  padding: 24px;
  color: #3c4c85;
  font-size: 18px;
  font-weight: bold;
}

.box04 {
  background: #fcf7ce;
  padding: 24px;
  color: #3c4c85;
  font-size: 18px;
  font-weight: bold;
}

.box05 {
    background: #fff;
    padding: 50px;
    color: #333;
}
@media screen and (max-width:991px){
    .box05 {
        padding: 40px;
    }
}
@media screen and (max-width:767px){
    .box05 {
        padding: 40px 25px;
    }
}

.box06 {
    background: linear-gradient(#ff8c00, #ec6b03);
    padding: 24px;
}

.box07 {
  background: #efefef;
  padding: 24px;
}
@media screen and (max-width:767px){
    .box07 {
        padding: 20px 16px;
    }
}

.srv-btn {
    background: #fff;
    border: 1px solid #ddd;
    padding: 24px;
    color: #333;
    display: block;
    font-size: 18px;
    font-weight: bold;
}

.srv-btn:hover {
    box-shadow: 0 0 15px rgba(0,0,0,.2);
}

.srv-btn h4 {
    font-size: 27px;
    margin-bottom: 20px;
}

.srv-btn h5 {
    font-size: 21px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
    color: #1a2c6a;
}

.srv-head-btn {
    border: 1px solid #ccc;
    background: #ccc;
    width: 300px;
    display: inline-block;
    padding: 10px;
    font-weight: bold;
    color: #777;
}

.srv-head-btn:hover,
.srv-head-btn.active:hover,
.srv-head-btn.active:link,
.srv-head-btn.active:visited,
.srv-head-btn.active:active {
    box-shadow: 0 0 14px rgba(255,255,255,1);
    background: #fff;
    color: #000;
}

.srv-head-btn:hover img,
.srv-head-btn.active:hover img,
.srv-head-btn.active:link img,
.srv-head-btn.active:visited img,
.srv-head-btn.active:active img {
    opacity: 1.0;
}

.srv-head-btn > strong {
    display: block;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

.srv-head-btn:link > strong,
.srv-head-btn:visited > strong,
.srv-head-btn:active > strong {
    border-bottom: 1px solid #999;
}

.srv-head-btn.active:link > strong,
.srv-head-btn.active:visited > strong,
.srv-head-btn.active:active > strong {
    border-bottom: 1px solid #ccc;
}

.srv-head-btn:hover > strong {
    border-bottom: 1px solid #ccc;
}

.srv-head-btn.luc:hover > strong {
    border-bottom: 1px solid #999 !important;
}

.srv-head-btn:focus {
    text-decoration: none;
}

.srv-head-btn > span {
    display: block;
}

.srv-head-btn > strong > img {
    width: 100px;
    height: auto;
    opacity: 0.7;
}

.srv-head-btn.luc {
    background-color: #aaa !important;
}

.srv-head-btn.luc:hover,
.srv-head-btn.luc:focus,
.srv-head-btn.luc.active:hover,
.srv-head-btn.luc.active:link,
.srv-head-btn.luc.active:visited,
.srv-head-btn.luc.active:focus,
.srv-head-btn.luc.active:active {
    box-shadow: none !important;
    background: #aaa !important;
    color: #777 !important;
}

.srv-head-btn.luc:hover img,
.srv-head-btn.luc.active:hover img,
.srv-head-btn.luc.active:link img,
.srv-head-btn.luc.active:visited img,
.srv-head-btn.luc.active:focus img,
.srv-head-btn.luc.active:active img {
    opacity: 0.7 !important;
}

.btn-area a+a {
    margin-left: 20px;
}

.srv-btn.luc {
    cursor: default;
    background: #ccc;
}

.srv-btn.luc:hover,
.srv-btn.luc:active,
.srv-btn.luc:link,
.srv-btn.luc:visited,
.srv-btn.luc:focus {
    cursor: default;
    background: #ccc;
    box-shadow: none;
    color: #777;
}

.srv-btn.luc img {
    opacity: 0.7;
}

.srv-btn.luc hr {
    border-top: 1px solid #bbb;
}

.text-orange {
    color: #f60;
}

.small-text {
    font-size: 85%;
}

.label-sm {
    font-size: 10px;
    padding: 1px 4px;
    line-height: 1;
}

/* jsoledi */
#jsoledi01 {
    background: url(../images/bg-jsoledi01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#jsoledi02 {
    background: url(../images/bg-jsoledi02.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#jsoledi02 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#jsoledi02 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jsoledi02 .box {
    background: #efefef;
    color: #1a2c6a;
    font-size: 120%;
    text-align: center;
}

#jsoledi03 {
    background: #68749d;
}

#jsoledi03 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jsoledi03 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.scn2 {
    display: block;
    border: 1px solid #ddd;
    font-size: 14px;
    line-height: 24px;
    padding: 10px;
    background: #304179;
    color: #fff;
    text-align: center;
}

#jsoledi04 {
    background: #efefef;
}

#jsoledi04 .box {
    background: #374d98;
    text-align: center;
    color: #fff;
}

.special-lead3 {
    text-align: center;
}

.special-lead3 span {
    display: inline-block;
    padding: 30px 35px;
    box-shadow: 0 5px 20px rgba(0,0,0,.15);
    border-radius: 8px;
    background: #fff;
    font-size: 24px;
    line-height: 26px;
    font-weight: bold;
    margin-bottom: 30px;
    color: #0a125a;
}

#jsoledi05 {
    background: #374d98;
}

#jsoledi05 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jsoledi05 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jsoledi05 .container {
    text-align: center;
    color: #fff;
}

#jsoledi06 {
    background: #68749d;
}

#jsoledi06 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#jsoledi06 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jsoledi06 .container {
    text-align: center;
    color: #fff;
}

#jsoledi07 {
    background: #efefef;
}

/* info */
#info01 {
    background: url(../images/bg-info01.jpg) center top no-repeat #efefef;
    padding: 120px 0;
}

#info02 {
    background: url(../images/bg-info02.jpg) center top no-repeat #374d98;
    padding: 45px 0 0;
    position: relative;
    color: #fff;
}

#info02 h3 {
    position: absolute;
    top: 90px;
    left: 15px;
    right: 15px;
    text-align: center;
    font-weight: bold;
    color: #fff;
}

#info02 h3:after {
    display: none;
}

/* common parts */
.cclr {
    color: #2a71b9;
}

.btn-cclr {
    background: #004a8e;
    color: #fff;
}

a.btn-cclr:hover,
a.btn-cclr:active,
a.btn-cclr:focus {
    background: #1860a5;
    color: #fff;
}

a.btn-cclr.active {
    background: #1860a5;
    color: #fff;
}

#logo,
#nav-area {
    display: table-cell;
    vertical-align: top;
}

#logo {
    margin: 0;
    width: 657px;
}

#logo a {
    display: block;
    width: 304px;
}

#logo a img {
    width: 100%;
    height: auto;
}

/* bootstrap hack */
.fa-check-square {
    margin-right: 0.5em;
}

.fa-angle-right {
    margin-left: 0.5em;
}

.disc {
    margin: 0 0 15px;
    padding: 0;
}

.disc li {
    margin-left: 1em;
}

.circle {
    margin: 0;
    padding: 0;
    list-style: none;
}

.circle li {
    padding-left: 24px;
}

.circle li:before {
    content: "\f10c";
    font-family: FontAwesome;
    display: inline-block;
    width: 24px;
    margin-left: -24px;
}

.decimal {
    margin: 0;
    padding: 0;
}

.decimal li {
    margin-left: 2em;
}

section h3 {
    margin-bottom: 45px;
    font-size: 39px;
    font-weight: normal;
    color: #1a2c6a;
}

section > .container > h3 {
    text-align: center;
    position: relative;
    margin-bottom: 90px;
}

section > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #1a2c6a;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

section > .container > .row > div[class*="col-"] > h3 {
    text-align: left;
}

section > .container > h4 {
    margin-bottom: 30px;
    font-size: 24px;
    border-bottom: 2px solid #1a2c6a;
    padding-bottom: 15px;
    margin-bottom: 30px;
    font-weight: normal;
}

.thumbnail {
    border-radius: 0;
    padding: 0;
}

.special-lead {
    text-align: center;
}

.special-lead span {
    display: inline-block;
    padding: 30px 35px;
    box-shadow: 0 12px 12px rgba(0,0,0,.15);
    border-radius: 0 0 8px 8px;
    background: #fff;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 90px;
    color: #0a125a;
}

.special-lead2 {
    text-align: center;
}

.special-lead2 span {
    display: inline-block;
    padding: 30px 35px;
    box-shadow: 0 12px 12px rgba(0,0,0,.15);
    border-radius: 8px;
    background: #fff;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 30px;
    color: #0a125a;
}

body a,
body a:hover {
    text-decoration: none;
    outline: none;
    color: #1a2c6a;
}

body a:focus {
    outline: none;
    text-decoration: none;
}

.btn i {
    margin-right: 0.5em;
}

.text-large {
    font-size: 23px;
    font-weight: bold;
}

/* table */
table {
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
}

td p:last-child {
    margin-bottom: 0;
}

/* margin / padding */
.mt-50 {
    margin-top: -50px!important;
}

.mt0 {
    margin-top: 0 !important;
}

.mt20 {
    margin-top: 20px!important;
}

.mt30 {
    margin-top: 30px!important;
}

.mb0 {
    margin-bottom: 0!important;
}

.mb5 {
    margin-bottom: 5px!important;
}

.mb10 {
    margin-bottom: 10px!important;
}

.mb15 {
    margin-bottom: 15px!important;
}

.mb20 {
    margin-bottom: 20px!important;
}

.mb25 {
    margin-bottom: 25px!important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mb50 {
    margin-bottom: 50px!important;
}

.mb60 {
    margin-bottom: 60px !important;
}

.mb90 {
    margin-bottom: 90px !important;
}

.frame-fit {
    margin-left: -24px;
    margin-right: -24px;
    margin-top: -24px;
}

.clr {
    clear: both;
}

.mb0 {
    margin-bottom: 0;
}

.fsl {
    font-size: 125%;
    font-weight: bold;
}

.fs110 {
    font-size: 110%;
}

.fs120 {
    font-size: 120%;
}

.tac {
    text-align: center;
}

.dt {
    display: table;
    width: 100%;
}

.dtc {
    display: table-cell;
    vertical-align: middle;
    float: none;
}

.navbar-collapse {
    padding: 0;
}

br.dn {
    display: none;
}

.prf_tb th,
.hst_tb th {
    width: 7em;
}

.rnt_tb th {
    width: 9em;
}

.r-arrow {
    position: relative;
}

.r-arrow:after {
    content: "\f105";
    font-family: FontAwesome;
    position: absolute;
    top: 50%;
    margin-top: -10px;
    right: 10px;
}

.table-bordered {
    border: none;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}

.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th {
    border: none;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    vertical-align: middle;
}

.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > th,
.table-bordered th {
    background: #efefef;
    white-space: nowrap;
}

.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td,
.table-bordered > thead > tr > td,
.table-bordered td {
    background: #fff;
}

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

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

.ba1 i,
.ba2 i {
    font-size: 4em;
    vertical-align: middle;
    color: #999;
}

/* paging */
div.paging {
    line-height: normal;
    padding: 5px;
    text-align: center;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
}

div.paging span.current,
div.paging span a.paging-text {
    margin: 0px 2px;
    padding: 6px 10px;
    border: 1px solid #999;
    background: #fff;
    color: #333;
    display: inline;
    zoom: 1;
    display: inline-block;
    overflow: hidden;
    text-decoration: none;
    border-radius: 3px;
}

div.paging span.current {
    background: #069;
    display: inline;
    zoom: 1;
    text-decoration: none;
    display: inline-block;
    color: #fff;
}

div.paging span a.paging-text:hover {
    color: #fff;
    cursor: pointer;
    background: #069;
    display: inline;
    zoom: 1;
    text-decoration: none;
    display: inline-block;
}

div.paging img {
    vertical-align: middle;
}

#pagetop {
    position: fixed;
    bottom: 0px;
    right: 0px;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: 50px;
    line-height: 50px;
    color: #fff;
    cursor: pointer;
    background: #374d98;
}

#pagetop i {
    margin-right: 0;
}

@media (max-width:767px){
    body {
        line-height: 1.5;
    }

    #main-bg {
        padding-top: 75px;
    }

    #main .swiper-slide{
        height: 135px;
    }

    h2.tit-appeal {
        text-align: center;
        position: relative;
        margin-bottom: 45px;
        font-size: 24px;
        line-height: 1.25;
    }

    h2.tit-appeal:after {
        content: "";
        width: 140px;
        height: 3px;
        left: 50%;
        margin-left: -75px;
        background: #1a2c6a;
        bottom: 0;
        position: absolute;
        bottom: -21px;
    }

    .ssc {
        display: block;
        border: 1px solid #ddd;
        text-align: center;
        font-size: 10px;
        line-height: 15px;
        padding: 9px;
    }

    .ssc h3 {
        font-size: 16px;
        line-height: 1;
        background-position: center top;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: -10px -10px 10px;
    }

    .ssc > h3 > span {
        display: block;
        margin-bottom: 9px;
    }

    .btn-area a+a {
        margin-left: 0px;
    }

    #topix {
        display: block;
    }

    #topix h2,
    #topix .nws-article {
        display: block;
    }

    #topix h2 {
        color: #fff;
        font-size: 21px;
        width: auto;
        background: linear-gradient(to top, #1b3280 0%,#374d98 100%);
        padding: 15px 0;
        position: relative;
        margin: 0 -15px;
        text-align: center;
    }

    #topix h2:after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -16px;
        top: auto;
        right: auto;
        margin-left: -15px;
        border-style: solid;
        border-width: 16px 15px 0 15px;
        border-color: #1b3280 transparent transparent transparent;
    }

    .nws-article {
        padding: 20px 0 15px;
    }

    .tpx-tb {
        width: 100%;
        font-size: 14px;
    }

    .tpx-tb th {
        padding: 10px 0 2px;
        vertical-align: top;
        white-space: nowrap;
        line-height: 20px;
        width: 110px;
        display: block;
    }

    .tpx-tb td {
        padding: 2px 0 10px;
        vertical-align: top;
        word-break: break-all;
        line-height: 20px;
        display: block;
    }

    .tpx-tb td img {
        vertical-align: middle;
        margin-left: 0.5em;
    }

    /* jacross */
    #jacross01 {
        background: url(../images/bg-jacross01.jpg) center top /640px no-repeat #efefef;
        padding: 45px 0;
    }

    #jacross01 h3 {
        text-align: center;
    }

    #jacross02 {
        padding: 45px 0;
    }

    #jacross03 {
        background: url(../images/bg-jacross02.jpg) center top /640px no-repeat #68749d;
        text-align: center;
        color: #fff;
        position: relative;
    }

    #jacross04 {
        background: url(../images/bg-jacross03.jpg) center top /480px no-repeat #374d98;
        position: relative;
        color: #fff;
    }

    #jacross05 {
        padding: 45px 0;
    }

    #jacross06 {
        padding: 0 0 45px 0;
    }

    /* jacross-flat */
    #jacross-flat01 {
        background: url(../images/bg-jacross-flat01.jpg) center top /640px no-repeat #efefef;
        padding: 45px 0;
    }

    #jacross-flat01 h3 {
        text-align: center;
    }

    #jacross-flat02 {
        padding: 45px 0;
    }

    #jacross-flat03 {
        padding: 45px 0;
    }

    .scn {
        display: block;
        border: 1px solid #ddd;
        font-size: 14px;
        line-height: 24px;
        padding: 10px;
        background: #fff;
    }

    .ssc > span {
        display: block;
        margin-bottom: 24px;
    }

    #jacross-flat05 {
        padding: 45px 0;
    }

    #jacross-flat06 {
        padding: 0 0 45px;
    }

    #cloud-area {
        padding: 20px 0;
    }

    #cloud-area .container {
        display: block;
    }

    #cloud-area .t1 {
        display: block;
        width: auto;
        padding: 10px;
    }

    #cloud-area .t2 {
        display: block;
        width: auto;
        padding: 10px;
        border-top: none;
        border-left: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
    }

    #cloud-area .t3 {
        display: block;
        width: auto;
        padding: 10px;
        border-top: none;
        border-left: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
    }

    #cloud-area .t3n {
        display: block;
        width: auto;
        padding: 10px;
        border-top: none;
        border-left: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        border-right: 1px solid #ccc;
    }

    .svc-tb th,
    .svc-tb td {
        display: block;
        width: auto;
    }

    .box {
        padding: 10px;
    }

    .box h4 {
        font-size: 18px;
        margin-bottom: 10px;
    }

    .box h5 {
        font-size: 16px;
        margin-bottom: 15px;
        padding-bottom: 10px;
        margin-bottom: 10px;
        border-bottom: 1px solid #ddd;
        color: #1a2c6a;
    }

    .srv-head-btn:first-child {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .row + h5 {
        margin-top: 30px;
    }

    .frame-fit {
        margin: -10px -10px 10px;
    }

    .well {
        padding: 9px;
    }

    /* azureprice */
    #azureprice01 {
        padding: 45px 0;
    }

    #azureprice02 {
        padding: 0 0 45px 0;
    }

    #azureprice02 h3 {
        text-align: center;
        color: #fff;
        margin-bottom: 45px;
    }

    section#azureprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* awsprice */
    #awsprice01 {
        padding: 45px 0;
    }

    #awsprice02 {
        padding: 0 0 45px 0;
    }

    #awsprice02 h3 {
        text-align: center;
        color: #fff;
        position: relative;
        margin-bottom: 45px;
    }

    section#awsprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* onelogin */
    #onelogin01 {
        background: url(../images/bg-onelogin01.jpg) center top /640px no-repeat #efefef;
        padding: 45px 0;
    }

    #onelogin01 h3 {
        text-align: center;
    }

    #onelogin04 h3 {
        margin-bottom: 15px;
    }

    #onelogin05 {
        padding: 45px 0 170px 0;
        position: relative;
    }
    .onelogin05_1 {
      padding: 45px 0 !important;
    }

    #onelogin-arrow {
        text-shadow: 0 0 5px rgba(0,0,0,.8);
        font-size: 24px;
        line-height: 1.3;
        background: url(../images/onelogin-last.png) no-repeat center bottom;
        width: 800px;
        min-height: 190px;
        text-align: center;
        color: #fff;
        font-weight: bold;
        position: absolute;
        bottom: -65px;
        left: 50%;
        margin-left: -400px;
    }

    #onelogin-arrow span {
        font-size: 46px;
        color: #fc0;
    }

    #onelogin06 {
        padding-top: 75px;
    }

    /* jhive */
    #jhive01 {
        background: url(../images/bg-jhive01.jpg) center top /640px no-repeat #efefef;
        padding: 45px 0;
    }

    #jhive01 h3 {
        text-align: center;
    }

    #info01 {
        background: url(../images/bg-info01-sp.jpg) center 30px /320px no-repeat #efefef;
        padding: 315px 0 45px;
    }

    #info02 {
        background: url(../images/bg-info02.jpg) center top no-repeat #374d98;
        padding: 45px 0 0;
    }

    #info02 h3 {
        position: absolute;
        top: 45px;
        left: 15px;
        right: 15px;
        text-align: center;
        font-weight: bold;
        color: #fff;
    }

    .lead {
        margin-bottom: 10px;
    }

    .feature-box {
        display: block;
    }

    .feature {
        display: block;
        width: auto;
        padding: 10px;
    }

    .feature h4 {
        text-align: center;
        margin-bottom: 15px;
        line-height: 1.6;
    }

    .feature h4 small {
        display: block;
        margin-top: 10px;
    }

    .special-lead span {
        display: block;
        font-size: 18px;
        padding: 10px 15px;
        margin-bottom: 15px;
    }

    .special-lead2 span {
        display: block;
        font-size: 18px;
        padding: 10px 15px;
        margin-bottom: 15px;
    }

    .mb90 {
        margin-bottom: 60px !important;
    }

    .btn-cclr {
        display: block;
        width: auto;
        margin-bottom: 10px;
    }

    .icon-pos {
        display: block;
        font-size: 20px;
        height: 20px;
    }

    .icon-pos i {
        margin: 0;
    }

    .icon-text {
        font-size: 10px;
        letter-spacing: 0;
        line-height: 11px;
    }

    section {
        padding: 45px 0;
    }

    section h3 {
        font-size: 24px;
    }

    section > .container > h3 {
        font-size: 24px;
        margin-bottom: 57px;
    }

    section > .container > h3:after {
        content: "";
        width: 100px;
        height: 3px;
        left: 50%;
        margin-left: -50px;
        background: #1a2c6a;
        bottom: 0;
        position: absolute;
        bottom: -18px;
    }
    hr {
        margin: 14px 0;
    }

    #pagetop {
        position: fixed;
        bottom: 60px;
        right: 5px;
        width: 40px;
        height: 40px;
        text-align: center;
        font-size: 20px;
        line-height: 1;
        color: #fff;
        cursor: pointer;
        background: #374d98;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    /*add*/
    .special-lead3 span {
        font-size: 16px;
        line-height: 18px;
    }
}

@media (min-width:768px) and (max-width:991px){

    #main .swiper-slide{
        height: 320px;
    }

    h2.tit-appeal {
        text-align: center;
        position: relative;
        margin-bottom: 45px;
        font-size: 27px;
        line-height: 1.25;
    }

    h2.tit-appeal:after {
        content: "";
        width: 140px;
        height: 3px;
        left: 50%;
        margin-left: -75px;
        background: #1a2c6a;
        bottom: 0;
        position: absolute;
        bottom: -21px;
    }

    .ssc {
        display: block;
        border: 1px solid #ddd;
        text-align: center;
        font-size: 11px;
        line-height: 19px;
        padding: 14px;
    }

    .ssc > h3 {
        font-size: 18px;
        line-height: 1;
        background-position: center top;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: -15px -15px 15px;
    }

    .ssc > h3 > span {
        display: block;
        margin-bottom: 14px;
    }

    .nws-article {
        padding: 60px 0 60px 80px;
    }

    /* jacross */
    #jacross01 {
        background: url(../images/bg-jacross01.jpg) center top /947px no-repeat #efefef;
        padding: 60px 0;
    }

    #jacross02 {
        padding: 60px 0;
    }

    #jacross03 h3 {
        text-align: center;
        color: #fff;
        position: relative;
        margin-bottom: 60px;
    }

    section#jacross03 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    #jacross04 {
        background: url(../images/bg-jacross03.jpg) center top /947px no-repeat #374d98;
        position: relative;
        color: #fff;
    }

    #jacross05 {
        padding: 60px 0;
    }

    #jacross06 {
        padding: 0 0 60px 0;
    }

    /* jacross-flat */
    #jacross-flat01 {
        padding: 60px 0;
    }

    #jacross-flat02 {
        padding: 60px 0;
    }

    #jacross-flat03 {
        padding: 60px 0;
    }

    .scn {
        display: block;
        border: 1px solid #ddd;
        font-size: 14px;
        line-height: 24px;
        padding: 24px;
        background: #fff;
    }

    .ssc > span {
        display: block;
        margin-bottom: 24px;
    }

    #jacross-flat05 {
        padding: 60px 0;
    }

    #jacross-flat06 {
        padding: 0 0 60px;
    }

    .svc-tb th,
    .svc-tb td {
        display: block;
        width: auto;
    }

    /* azureprice */
    #azureprice01 {
        padding: 60px 0;
    }

    #azureprice02 {
        padding: 0 0 60px 0;
    }

    #azureprice02 h3 {
        text-align: center;
        color: #fff;
        margin-bottom: 60px;
    }

    section#azureprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* awsprice */
    #awsprice01 {
        padding: 60px 0;
    }

    #awsprice02 {
        padding: 0 0 60px 0;
    }

    #awsprice02 h3 {
        text-align: center;
        color: #fff;
        position: relative;
        margin-bottom: 60px;
    }

    section#awsprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* onelogin */
    #onelogin01 {
        background: url(../images/bg-onelogin01.jpg) center top /947px no-repeat #efefef;
        padding: 60px 0;
    }

    #onelogin05 {
        padding: 60px 0 170px 0;
        position: relative;
    }

    #onelogin-arrow {
        text-shadow: 0 0 5px rgba(0,0,0,.8);
        font-size: 26px;
        line-height: 1.3;
        background: url(../images/onelogin-last.png) no-repeat center bottom /510px;
        width: 510px;
        min-height: 190px;
        text-align: center;
        color: #fff;
        font-weight: bold;
        position: absolute;
        bottom: -42px;
        left: 50%;
        margin-left: -255px;
    }

    #onelogin-arrow span {
        font-size: 46px;
        color: #fc0;
    }

    /* jhive */
    #jhive01 {
        background: url(../images/bg-jhive01.jpg) center top /947px no-repeat #efefef;
        padding: 60px 0;
    }

    #info01 {
        background: url(../images/bg-info01.jpg) center center /947px no-repeat #efefef;
        padding: 60px 0;
    }

    #info02 {
        background: url(../images/bg-info02.jpg) center top no-repeat #374d98;
        padding: 45px 0 0;
        position: relative;
    }

    #info02 h3 {
        position: absolute;
        top: 60px;
        left: 15px;
        right: 15px;
        text-align: center;
        font-weight: bold;
        color: #fff;
    }

    section {
        padding: 60px 0;
    }

    .special-lead span {
        margin-bottom: 30px;
    }

    .special-lead2 span {
        margin-bottom: 30px;
    }

    .mb90 {
        margin-bottom: 60px !important;
    }

    #logo {
        width: 237px;
    }

    #logo a {
        width: 135px;
    }

    #fnav {
        display: block;
    }

    .fnav {
        display: block;
        width: auto;
    }

    .fnav + .fnav {
        border-left: none;
        padding-left: 0;
    }

    .fnav ul {
        line-height: 15px;
    }

    .fnav {
        font-size: 13px;
    }

    .fnav h4 {
        font-size: 13px;
        display: inline-block;
        width: 81px;
    }

    .sm-center {
        text-align: center;
    }
}

@media (min-width:992px) and (max-width:1199px){

    #main .swiper-slide{
        height: 414px;
    }

    .ssc {
        display: block;
        border: 1px solid #ddd;
        text-align: center;
        font-size: 14px;
        line-height: 24px;
        padding: 19px;
    }

    .ssc h3 {
        font-size: 24px;
        line-height: 1;
        background-position: center top;
        background-repeat: no-repeat;
        background-size: 100%;
        margin: -20px -20px 20px;
    }

    .ssc > h3 > span {
        display: block;
        margin-bottom: 19px;
    }

    .nws-article {
        padding: 60px 0 60px 100px;
    }

    /* jacross */
    #jacross01 {
        background: url(../images/bg-jacross01.jpg) center top /1225px no-repeat #efefef;
        padding: 90px 0;
    }

    #jacross02 {
        padding: 90px 0;
    }

    #jacross03 h3 {
        text-align: center;
        color: #fff;
        position: relative;
        margin-bottom: 90px;
    }

    section#jacross03 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    #jacross04 {
        background: url(../images/bg-jacross03.jpg) center top /1225px no-repeat #374d98;
        position: relative;
        color: #fff;
    }

    #jacross05 {
        padding: 90px 0;
    }

    #jacross06 {
        padding: 0 0 90px 0;
    }

    /* jacross-flat */
    #jacross-flat01 {
        padding: 90px 0;
    }

    #jacross-flat02 {
        padding: 90px 0;
    }

    #jacross-flat03 {
        padding: 90px 0;
    }

    .scn {
        display: block;
        border: 1px solid #ddd;
        font-size: 14px;
        line-height: 24px;
        padding: 24px;
        background: #fff;
    }

    .ssc > span {
        display: block;
        margin-bottom: 24px;
    }

    #jacross-flat05 {
        padding: 90px 0;
    }

    #jacross-flat06 {
        padding: 0 0 90px;
    }

    /* azureprice */
    #azureprice01 {
        padding: 90px 0;
    }

    #azureprice02 {
        padding: 0 0 90px 0;
    }

    #azureprice02 h3 {
        text-align: center;
        color: #fff;
        margin-bottom: 90px;
    }

    section#azureprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* awsprice */
    #awsprice01 {
        padding: 90px 0;
    }

    #awsprice02 {
        padding: 0 0 90px 0;
    }

    #awsprice02 h3 {
        text-align: center;
        color: #fff;
        position: relative;
        margin-bottom: 90px;
    }

    section#awsprice02 > .container > h3:after {
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #fff;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    /* onelogin */
    #onelogin01 {
        background: url(../images/bg-onelogin01.jpg) center top /1225px no-repeat #efefef;
        padding: 90px 0;
    }

    #onelogin05 {
        padding: 90px 0 170px 0;
        position: relative;
    }

    #onelogin-arrow {
        text-shadow: 0 0 5px rgba(0,0,0,.8);
        font-size: 26px;
        line-height: 1.3;
        background: url(../images/onelogin-last.png) no-repeat center bottom /660px;
        width: 660px;
        min-height: 190px;
        text-align: center;
        color: #fff;
        font-weight: bold;
        position: absolute;
        bottom: -53px;
        left: 50%;
        margin-left: -330px;
    }

    #onelogin-arrow span {
        font-size: 46px;
        color: #fc0;
    }

    /* jhive */
    #jhive01 {
        background: url(../images/bg-jhive01.jpg) center top /1225px no-repeat #efefef;
        padding: 90px 0;
    }

    #info01 {
        background: url(../images/bg-info01.jpg) center top /1225px no-repeat #efefef;
        padding: 90px 0;
    }

    #info02 {
        background: url(../images/bg-info02.jpg) center top no-repeat #374d98;
        padding: 30px 0 0;
        position: relative;
    }

    #info02 h3 {
        position: absolute;
        top: 75px;
        left: 15px;
        right: 15px;
        text-align: center;
        font-weight: bold;
        color: #fff;
    }

    section {
        padding: 75px 0;
    }

    .special-lead span {
        margin-bottom: 60px;
    }

    .special-lead2 span {
        margin-bottom: 30px;
    }

    .mb90 {
        margin-bottom: 60px !important;
    }

    #logo {
        width: 457px;
    }

    .fnav {
        font-size: 13px;
    }

    .fnav h4 {
        font-size: 13px;
        display: inline-block;
        width: 85px;
    }
}

@media print{
    body {
        background-image: none;
    }

    .container {
        width: 991px !important;
    }

    #pagetop {
        display: none;
    }
}

/*-------------------------taniguchi-------------------------------*/
/*----汎用-----*/
.orange {
    color: #ff8c00 !important;
}

.blue {
    color: #374d98 !important;
}

.red {
    color: #cc0000 !important;
}

.white {
    color: #fff !important;
}

.black {
    color: #333 !important;
}

.green {
    color: #03a801 !important;
}
.yellow {
  color: #d2cd10 !important;
}

.indent_1 {
    text-indent: -1em;
    margin-left: 1.5em;
}

.fss {
    font-weight: normal !important;
    font-size: 16px !important;
}

.title01 {
    color: #1a2c6a;
    border-bottom: 1px solid #1a2c6a;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title01 {
        color: #1a2c6a;
        padding-bottom: 10px;
        clear: both;
        font-weight: normal;
        font-size: 24px !important;
        margin-bottom: 15px;
    }
}

.title01-white {
    color: #fff;
    border-bottom: 1px solid #fff;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title01-white {
        color: #fff;
        padding-bottom: 10px;
        clear: both;
        font-weight: normal;
        font-size: 24px !important;
        margin-bottom: 15px;
    }
}

.title02 {
    background: linear-gradient(#ff8c00, #ec6b03);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .title02 {
        background: linear-gradient(#ff8c00, #ec6b03);
        padding: 10px 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}

.title02-blue {
    background: linear-gradient(#0054ff, #0496ec);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .title02-blue {
        background: linear-gradient(#0054ff, #0496ec);
        padding: 10px 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}

.title02-green {
    background: linear-gradient(#0f6c00, #149000);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .title02-green {
        background: linear-gradient(#0f6c00, #149000);
        padding: 10px 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}
.title03 {
    color: #1a2c6a;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title03 {
        color: #1a2c6a;
        clear: both;
        font-weight: normal;
        font-size: 24px !important;
        margin-bottom: 15px;
        line-height: 130%;
    }
}

.title04 {
    background: linear-gradient(#444, #111);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .title04 {
        background: linear-gradient(#444, #111);
        padding: 15px 10px;
        text-align: center;
        color: #fff;
        font-size: 30px !important;
        line-height: 120%;
    }
}

.title05 {
    color: #1a2c6a;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
}

@media (min-width: 768px) {
    .title05 {
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title06 {
    color: #fff;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
}

@media (min-width: 768px) {
    .title06 {
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title07 {
    color: #fff;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
}

@media (min-width: 768px) {
    .title07 {
        font-weight: normal;
        font-size: 35px !important;
    }
}

.title08 {
    color: #374d98;
    clear: both;
    font-weight: bold;
    font-size: 100% !important;
    line-height: 120%;
}

.title08_a {
    color: #fff;
    clear: both;
    font-weight: bold;
    font-size: 100% !important;
    line-height: 120%;
}

@media (min-width: 768px) {
    .title08 {
        font-weight: normal;
        font-size: 20px !important;
    }

    .title08_a {
        font-weight: normal;
        font-size: 20px !important;
    }
}

.title09 {
    color: #1a2c6a;
    border-bottom: 1px solid #1a2c6a;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}
.title09.lh-large{
    line-height: 2;
}
@media (min-width: 768px) {
    .title09 {
        color: #1a2c6a;
        padding-bottom: 10px;
        clear: both;
        font-weight: normal;
        font-size: 21px !important;
        margin-bottom: 15px;
    }
}

.title10 {
    color: #1a2c6a;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title10 {
        color: #1a2c6a;
        clear: both;
        font-weight: normal;
        font-size: 20px !important;
        font-weight: bold;
        margin-bottom: 15px;
        line-height: 130%;
    }
}

.title11 {
    color: #2f889f;
    border-bottom: 1px solid #2f889f;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title11 {
        padding-bottom: 10px;
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title12 {
    color: #367d4a;
    border-bottom: 1px solid #367d4a;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title12 {
        padding-bottom: 10px;
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title13 {
    color: #de9302;
    border-bottom: 1px solid #de9302;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title13 {
        padding-bottom: 10px;
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title14 {
    color: #1a2c6a;
    border-bottom: 1px solid #1a2c6a;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title14 {
        color: #1a2c6a;
        padding-bottom: 10px;
        clear: both;
        font-weight: normal;
        font-size: 24px !important;
        margin-bottom: 15px;
    }
}

.title15 {
    background: linear-gradient(#0800ff, #6a65ff);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .title15 {
        background: linear-gradient(#0800ff, #6a65ff);
        padding: 10px 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}


.title16 {
    color: #0d02de;
    border-bottom: 1px solid #0d02de;
    padding-bottom: 5px;
    clear: both;
    font-weight: bold;
    font-size: 120% !important;
    line-height: 120%;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .title16 {
        padding-bottom: 10px;
        font-weight: normal;
        font-size: 24px !important;
    }
}

.title17:before {
  content: '✓';
  font-weight: bold;
  margin-right: 10px;
  color: #e30000;
}

.title17 {
    color: #3630a7;
    clear: both;
    font-weight: bold;
    font-size: 100% !important;
    margin-bottom: 15px;
    text-align: center;
    border-bottom: 1px dotted #3630a7;
}

@media (min-width: 768px) {
    .title17 {
        padding-bottom: 10px;
        font-weight: bold;
        font-size: 18px !important;
    }
}

.title18:before {
    position: absolute;
    top: -.15em;
    left: 0;
    content: '\f119';
    font-family: "FontAwesome";
    font-size: 1.2em !important;
    font-weight: bold;
    margin-right: 10px;
    color: #008272;
}
.title18 {
    position: relative;
    padding-left: 1.5em;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #aaa;
    font-size: 18px !important;
    font-weight: bold;
    color: #1a2c6a;
}
@media (min-width: 768px) {
    .title18 {
        font-weight: bold;
        font-size: 22px !important;
    }
}

.title19:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '✓';
    font-weight: bold;
    margin-right: 10px;
    color: #e30000;
}
.title19 {
    position: relative;
    padding-left: 1.5em;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #aaa;
    font-size: 18px !important;
    font-weight: bold;
    color: #1a2c6a;
}
.title19 small{
    font-size: 14px !important;
    font-weight: normal;
    color: #111;
}
@media (min-width: 768px) {
    .title19 {
        font-weight: bold;
        font-size: 22px !important;
    }
    .title19 small{
        font-size: 15px !important;
    }
}

.title20{
    margin-bottom: 10px;
    font-size: 16px!important;
    font-weight: bold;
}
@media screen and (min-width:768px){
    .title20{
        font-size: 18px !important;
    }
}

.title21:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '✓';
    font-weight: bold;
    margin-right: 10px;
    color: #e30000;
}
.title21 {
    position: relative;
    padding-left: 1.5em;
    padding-bottom: 7px;
    margin-bottom: 7px !important;
    border-bottom: 1px dashed #aaa;
    font-size: 16px !important;
    font-weight: bold;
    color: #1a2c6a;
}
@media (min-width: 768px) {
    .title21 {
        font-weight: bold;
        font-size: 18px !important;
    }
}

.title22:before {
    position: absolute;
    top: 0;
    left: 0;
    content: '\f119';
    font-family: "FontAwesome";
    font-weight: bold;
    margin-right: 10px;
    color: #008272;
}
.title22 {
    position: relative;
    padding-left: 1.5em;
    padding-bottom: 7px;
    margin-bottom: 7px !important;
    border-bottom: 1px dashed #aaa;
    font-size: 16px !important;
    font-weight: bold;
    color: #1a2c6a;
}
@media (min-width: 768px) {
    .title22 {
        font-weight: bold;
        font-size: 18px !important;
    }
}

.midashi1 {
    text-align: center;
    font-weight: bold;
    margin: 0 0 50px;
    color: #fff;
    font-size: 21px !important;
}

.midashi2 {
    background: #374d98;
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .midashi2 {
        background: #374d98;
        padding: 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}

.midashi3 {
    font-size: 110% !important;
    line-height: 140%;
}

@media (min-width: 768px) {
    .midashi3 {
        font-size: 120% !important;
        line-height: 140%;
        font-weight: bold;
    }
}
@media (min-width: 992px) {
    .midashi3 {
        font-size: 160% !important;
        line-height: 160%;
        text-align: center;
    }
}

@media (min-width: 768px) {
    .box h4 {
        line-height: 140%;
    }
}

.midashi4 {
    background: #182a65;
    padding: 5px;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .midashi4 {
        padding: 10px;
        color: #fff;
        font-size: 22px !important;
    }
}

.midashi5 {
    background: #ff8c00;
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120% !important;
}

@media (min-width: 768px) {
    .midashi5 {
        background: #ff8c00;
        padding: 10px;
        text-align: center;
        color: #fff;
        font-size: 24px !important;
    }
}


.orange_midashi {
    color: #ff8c00;
    font-size: 18px !important;
    line-height: 140%;
}

@media (min-width: 768px) {
    .orange_midashi {
        font-size: 25px !important;
        line-height: 140%;
        font-weight: bold;
    }
}

@media (min-width: 992px) {
    .orange_midashi {
        font-size: 30px !important;
        line-height: 160%;
        text-align: center;
    }
}

/* text_box
----------------------------------------------------------*/
.text_box1 {
    border: 1px solid #ccc;
    padding: 20px;
    background: #fff;
}

.text_box2 {
    border-right: 1px solid #111;
    border-left: 1px solid #111;
    border-bottom: 1px solid #111;
    padding: 20px;
}

.text_box3 {
    background: #fff;
    padding: 20px;
    color: #333;
    text-align: left;
}

.text_box4 {
    background: #374d98;
    border: 1px solid #ddd;
    padding: 24px;
}

.text_box5 {
    border: 1px solid #ccc;
    padding: 10px;
    background: #fff;
    color: #333;
    text-align: left;
}

@media (min-width: 768px) {
    .text_box5 {
        padding: 20px;
    }
}

.text_box6 {
    padding: 10px;
    background: #fff;
    color: #ff8c00;
    text-align: left;
}

.text_box7 {
    border: 1px solid #ccc;
    padding: 10px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* btn
----------------------------------------------------------*/
@media (min-width: 768px) {
    .btn1 {
        text-align: left;
    }
}

.btn1 span {
    display: inline-block;
    padding: 30px 10px;
    box-shadow: 0 12px 12px rgba(0,0,0,.15);
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    margin-bottom: 30px;
    color: #0a125a;
}

@media (min-width: 768px) {
    .btn1 span {
        font-size: 24px;
        line-height: 26px;
        font-weight: bold;
    }
}


@media (min-width: 768px) {
    .btn2 {
        text-align: left;
    }
}

.btn2 span {
    display: inline-block;
    padding: 30px 10px;
    box-shadow: 0 12px 12px rgba(0,0,0,.15);
    border-radius: 8px;
    background: #0a125a;
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    margin-bottom: 30px;
    color: #fff;
}

@media (min-width: 768px) {
    .btn2 span {
        font-size: 24px;
        line-height: 26px;
        font-weight: bold;
    }
}

.btn3{
    position: relative;
    top: 0;
    display: inline-block;
    min-width: 250px;
    padding: 1em;
    margin-left: auto;
    margin-right: auto;
    background: #fc9100;
    border-radius: 5px;
    box-shadow: 0 5px 10px rgba(0,0,0,.3);
    transition: .2s;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}
.btn3 i{
    font-size: 1.2em !important;
}
.btn3:hover{
    top: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,.7);
    background: #ff6c00;
    color: #fff !important;
}
@media (min-width: 768px) {
    .btn3{
        min-width: 300px;
        font-size: 20px;
    }
}

/* bg
----------------------------------------------------------*/
.bg2 {
    background: #68749d;
}

.bg2 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section.bg2 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.bg2 .midashi3 {
    color: #fff;
}

#bg3 {
    background: url(../images/bg3.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #bg3 {
        background: url(../images/bg3.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

#bg4 {
    background: url(../images/bg4.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#bg4 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#bg4 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.bg5 {
    background: #efefef;
}

.bg5 .box {
    background: #374d98;
    text-align: center;
    color: #fff;
}

.bg6 {
    background: #374d98;
}

.bg6 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section.bg6 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.bg6 .container {
    text-align: center;
    color: #fff;
}

.bg7 {
    background: #fff;
}

.bg8 {
    background: #374d98;
}

.bg8 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section.bg8 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.bg8 .container {
    text-align: center;
    color: #fff;
}

@media (min-width: 768px) {
    .bg8 h3 {
        font-size: 30px;
        line-height: 1.3;
    }
}

/* table
----------------------------------------------------------*/
.table1 {
    width: 100%;
    border-collapse: collapse;
    border-bottom: solid 1px #2c3d7a;
}

.table1 th {
    width: 100%;
    padding: 7px 7px;
    font-weight: bold;
    border-top: solid 1px #2c3d7a;
    border-right: solid 1px #2c3d7a;
    border-left: solid 1px #2c3d7a;
    line-height: 140%;
    display: block;
    background: #2c3d7a;
    border-collapse: collapse;
    text-align: left;
}

.table1 th.bb_blue {
    border-bottom: solid 1px #374d98;
}

.table1 td {
    width: 100%;
    padding: 7px 7px;
    border-top: solid 1px #2c3d7a;
    border-right: solid 1px #2c3d7a;
    border-left: solid 1px #2c3d7a;
    line-height: 140%;
    display: block;
    text-align: left;
    background: #465dae;
}

@media (min-width: 768px) {
    .table1 {
        width: 100%;
        display: table;
        border-bottom: solid 1px #2c3d7a;
        margin-bottom: 0;
    }

    .table1 th {
        width: 1%;
        white-space: nowrap;
        padding: 10px 10px;
        font-weight: bold;
        border: solid 1px #2c3d7a;
        line-height: 140%;
        display: table-cell;
        border-collapse: collapse;
    }

    .table1 td {
        background: #465dae;
        padding: 10px 10px;
        border: solid 1px #2c3d7a;
        line-height: 140%;
        display: table-cell;
    }
}

/*---------------*/
.table2 {
    width: 100%;
    border-collapse: collapse;
    border-bottom: solid 1px #ccc;
}

.table2 th {
    width: 100%;
    padding: 10px;
    font-weight: bold;
    border-top: solid 1px #ccc;
    border-right: solid 1px #ccc;
    border-left: solid 1px #ccc;
    line-height: 140%;
    display: block;
    background: #eee;
    border-collapse: collapse;
    font-weight: normal;
}

.table2 td {
    background: #fff;
    width: 100%;
    padding: 10px;
    border-top: solid 1px #ccc;
    border-right: solid 1px #ccc;
    border-left: solid 1px #ccc;
    line-height: 140%;
    display: block;
}

.table2 .bg_gra_blue {
    color: #fff;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-image: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
}

@media (min-width: 768px) {
    .table2 {
        width: 100%;
        display: table;
        border-bottom: solid 1px #ccc;
        margin-bottom: 0;
    }

    .table2 th {
        width: 50%;
        padding: 10px 10px;
        font-weight: normal;
        border: solid 1px #ccc;
        line-height: 140%;
        display: table-cell;
        border-collapse: collapse;
        vertical-align: top;
    }

    .table2 td {
        background: #fff;
        padding: 10px 10px;
        border: solid 1px #ccc;
        line-height: 140%;
        display: table-cell;
        vertical-align: top;
    }
}

/*---------------*/
.table3 {
    width: 100%;
    border-collapse: collapse;
}

.table3 th {
    background: #2f889f;
    width: 100%;
    padding: 10px;
    font-weight: bold;
    line-height: 140%;
    display: block;
    border-collapse: collapse;
    color: #fff;
}

.table3 td {
    width: 100%;
    padding: 10px;
    line-height: 140%;
    display: block;
}

@media (min-width: 768px) {
    .table3 {
        width: 100%;
        display: table;
        margin-bottom: 0;
    }

    .table3 th {
        font-weight: normal;
        width: 1%;
        white-space: nowrap;
        padding: 10px 15px;
        line-height: 140%;
        display: table-cell;
        border-collapse: collapse;
        vertical-align: middle;
        font-size: 22px;
    }

    .table3 td {
        padding: 10px 15px;
        line-height: 140%;
        display: table-cell;
        vertical-align: top;
    }
}
/*---------------*/

.table4 {
    border-collapse: collapse;
    border: 1px solid #ccc;
    background: #fff;
    font-size: 14px;
    line-height: 140%;
}
.table4 > thead > tr > th,
.table4 > tbody > tr > th,
.table4 > tbody > tr > td{
    padding: .8em 1em;
    border: 1px solid #ccc;
    border-collapse: collapse;
}
.table4 > thead > tr > th{
    background-image: linear-gradient(0deg, rgb(26, 44, 106) 0%, rgb(55, 77, 152) 100%);
    color: #fff;
}
.table4 > tbody > tr > th {
    background: #ddd;
    border-bottom: 1px solid #555;
}
.table4 > tbody > tr > td.bottom {
    border-bottom: 1px solid #555;
}

@media (min-width: 768px) {
    .table4 {
        font-size: 16px;
    }
}

/* list
----------------------------------------------------------*/
.list01 li {
    list-style: square;
    margin-left: 20px;
    margin-bottom: 0px;
    font-size: 20px;
}

.list-sad{
    margin: 0;
    padding: 0;
    list-style: none;
}
.list-sad li {
    position: relative;
    padding-top: .5em;
    padding-bottom: .5em;
    padding-left: 1.5em;
    border-bottom: 1px dashed #aaa;
    line-height: 1.5;
}
.list-sad li:last-of-type{
    margin-bottom: 0;
}
.list-sad li::before{
    position: absolute;
    top: .2em;
    left: 0;
    content: '\f119';
    font-family: "FontAwesome";
    font-size: 1.25em;
    font-weight: bold;
    color: #008272;
}

.list-check{
    margin: 0;
    padding: 0;
    list-style: none;
}
.list-check li {
    position: relative;
    padding-top: .5em;
    padding-bottom: .5em;
    padding-left: 1.5em;
    border-bottom: 1px dashed #aaa;
    line-height: 1.5;
}
.list-check li:last-of-type{
    margin-bottom: 0;
}
.list-check li::before{
    position: absolute;
    top: .2em;
    left: 0;
    content: '✓';
    font-size: 1.25em;
    font-weight: bold;
    color: #e30000;
}

/*----扉ページ-----*/
.page_box {
    display: block;
    text-align: center;
    font-size: 14px;
    line-height: 24px;
    height: 100%;
    padding: 20px;
    background: #304179;
    color: #fff;
}

a.page_box:hover {
    box-shadow: 0 0 30px rgba(0,0,0,.60);
}

.link_white a:link,
.link_white a:visited {
    color: #fff;
}

.link_white a:hover {
    color: #fff;
}

.page_box h4 {
    line-height: 140%;
}

.bg1 {
    background: url(../images/bg1.jpg) no-repeat top center #fff;
}

/* iot
----------------------------------------------------------*/
.iot {
    background-image: url(../images/iot_tit.jpg);
    background-position: center top;
}

#iot_bg1 {
    background: url(../images/iot_bg1.jpg) center top no-repeat #374d98;
    position: relative;
    color: #000;
}

#iot_bg1 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#iot_bg1 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.iot_arrow {
    background: url(../images/iot_arrow.png) center top no-repeat;
    position: relative;
    color: #374d98;
    min-height: 107px;
}

.iot_arrow span {
    width: 100%;
    text-align: center;
    position: absolute;
    display: block;
    bottom: 20px;
    left: 0;
    right: 0;
    margin: 0 auto;
    font-size: 24px;
}

#iot_bg2 {
    background: url(../images/iot_bg2.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#iot_bg2 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#iot_bg2 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#iot_bg2 h4 {
    text-align: center;
    color: #fff;
    margin: 10px 0 0px 0;
    padding: 10px 0;
    font-size: 24px;
}

#iot_bg2 .bdr_b {
    border: 2px solid #53c7c3;
}

#iot_bg2 .bdr_g {
    border: 2px solid #7baa55;
}

#iot_bg2 .bdr_o {
    border: 2px solid #f60;
}

#iot_bg2 h4.bgb {
    background: #53c7c3;
}

#iot_bg2 h4.bgg {
    background: #7baa55;
}

#iot_bg2 h4.bgo {
    background: #f60;
}

#iot_bg3 {
    background: #68749d;
    color: #fff;
}

#iot_bg3 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#iot_bg3 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

ul.iot_list {
}

ul.iot_list li {
    margin: 10px 0;
    margin-left: 1em;
    text-indent: -1em;
    list-style: none;
}

ul.iot_list li:before {
    font-family: FontAwesome;
    content: '\f00c'; /* アイコンのunicode */
    margin-right: 5px;
    color: #ff0000;
}

ul.iot_list li:after {
}

.midashi2_iot {
    background: #374d98;
    padding: 5px;
    text-align: left;
    color: #fff;
    font-size: 120%;
}

@media (min-width: 768px) {
    .midashi2_iot {
        background: #374d98;
        padding: 10px;
        text-align: left;
        color: #fff;
        font-size: 23px!important;
    }
}

.midashi3_iot {
    background: #29265d;
    padding: 5px;
    text-align: left;
    color: #fff;
    font-size: 120%;
}

@media (min-width: 768px) {
    .midashi3_iot {
        background: #29265d;
        padding: 10px;
        text-align: left;
        color: #fff;
        font-size: 23px!important;
    }
}



/* imo
----------------------------------------------------------*/
.imo {
    background-image: url(../images/imo_tit.jpg);
    background-position: center top;
}

/*#imo_bg1{background: #374d98;position: relative;color:#fff;padding: 120px 0;}*/
#imo_bg1 {
    background: url(../images/imo_bg1.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#imo_bg1 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#imo_bg1 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/*#imo_bg2{background: #68749d;}*/
#imo_bg2 {
    background: url(../images/imo_bg2.jpg) center top no-repeat #68749d;
    position: relative;
    color: #fff;
}

#imo_bg2 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#imo_bg2 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#imo_bg3 {
    background: #efefef;
}
#imo_bg3 .box {
    background: #374d98;
    text-align: center;
    color: #fff;
}
#imo_bg4 {
    background: #68749d;
}
#imo_bg4 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#imo_bg4 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#imo_bg4 .container {
    text-align: center;
    color: #fff;
}

#imo_bg5 {
    background: url(../images/imo_bg4.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #imo_bg5 {
        background: url(../images/imo_bg4.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

/* japm
----------------------------------------------------------*/
.japm {
    background-image: url(../images/japm_tit.jpg);
    background-position: center top;
}

#japm_bg1 {
    background: url(../images/japm_bg1.jpg) no-repeat bottom center #68749d;
}

#japm_bg1 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#japm_bg1 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#japm_bg1 .container {
    text-align: center;
    color: #fff;
}

#japm_bg2 {
    background: url(../images/japm_bg2.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

#japm_bg4 {
    background: url(../images/bg5.png) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#japm_bg4 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#japm_bg4 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

@media (min-width: 768px) {
    #japm_bg2 {
        background: url(../images/japm_bg2.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

/* jsstart
----------------------------------------------------------*/
.jsstart {
    background-image: url(../images/jsstart_tit.jpg);
    background-position: center top;
}

#jsstart_bg1 {
    background: url(../images/jsstart_bg1.jpg) no-repeat bottom center #68749d;
}

#jsstart_bg1 h3 {
    text-align: center;
    color: #fff;
    position: relative;
}

section#jsstart_bg1 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#jsstart_bg1 .container {
    text-align: center;
    color: #fff;
}

#jsstart_bg2 {
    background: url(../images/jsstart_bg2.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #jsstart_bg2 {
        background: url(../images/jsstart_bg2.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

/* office365
----------------------------------------------------------*/
.office365 {
    background-image: url(../images/office365_tit.jpg);
    background-position: center top;
}

.office365_bg1 {
    background: rgba(206,231,238,0.7);
    padding: 10px;
}

@media (min-width: 768px) {
    .office365_bg1 {
        padding: 15px;
    }
}

.office365_bg1 h3 {
    color: #0e748f;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .office365_bg1 h3 {
        font-size: 25px;
        text-align: center;
    }
}

/*---------------*/
.office365_bg2 {
    background: rgba(248,223,234,0.7);
    padding: 10px;
}

@media (min-width: 768px) {
    .office365_bg2 {
        padding: 15px;
    }
}

.office365_bg2 h3 {
    color: #e45995;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .office365_bg2 h3 {
        font-size: 25px;
        text-align: center;
    }
}

/*---------------*/
.office365_bg3 {
    background: rgba(245,235,205,0.7);
    padding: 10px;
}

@media (min-width: 768px) {
    .office365_bg3 {
        padding: 15px;
    }
}

.office365_bg3 h3 {
    color: #d9a609;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .office365_bg3 h3 {
        font-size: 25px;
        text-align: center;
    }
}

/*---------------*/
.office365_bg4 {
    background: rgba(183,232,197,0.7);
    padding: 10px;
}

@media (min-width: 768px) {
    .office365_bg4 {
        padding: 15px;
    }
}

.office365_bg4 h3 {
    color: #0d9634;
    font-weight: bold;
    font-size: 110%;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .office365_bg4 h3 {
        font-size: 25px;
        text-align: center;
    }
}

/*---------------*/
#boffice365_bg7 {
    background: url(../images/office365_bg3.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #boffice365_bg7 {
        background: url(../images/office365_bg3.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

.softbox1 {
    border: 1px solid #333;
    padding: 10px;
    margin-bottom: 10px;
}

.soft1 {
    background: url(../images/softicon1.png) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 42px;
    clear: both;
    color: #0171c5;
}

.soft2 {
    background: url(../images/softicon2.png) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 42px;
    clear: both;
    color: #0171c5;
}

.soft3 {
    background: url(../images/softicon3.png) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 42px;
    clear: both;
    color: #0171c5;
}

@media (min-width: 768px) {
    .soft1,
    .soft2,
    .soft3 {
        font-size: 25px;
    }
}

.office365_box {
    border-right: 1px solid #111;
    border-left: 1px solid #111;
    border-bottom: 1px solid #111;
    padding: 10px;
}

@media (min-width: 768px) {
    .office365_box {
        padding: 20px;

        /*background:url(../images/office365_bg1.jpg) no-repeat center center;
	background-size:cover;*/
    }
}

#office365_bg5 {
    background: url(../images/office365_bg2.jpg) no-repeat center center;
    background-size: cover;
}

#office365_bg5 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#office365_bg5 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#office365_bg5 .container {
    text-align: center;
    color: #fff;
}

#office365_bg6 {
    background: url(../images/office365_bg1.jpg) no-repeat center center;
    background-size: cover;
}

/* J-FMAT
----------------------------------------------------------*/
.jfmat {
    background-image: url(../images/jfmat_tit.jpg);
    background-position: center top;
}

#jfmat_bg1 {
    background: url(../images/jfmat_bg1.jpg) center bottom no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #jfmat_bg1 {
        background: url(../images/jfmat_bg1.jpg) center bottom no-repeat #efefef;
        padding: 120px 0;
    }
}

#jfmat_bg2 {
    background: url(../images/jfmat_bg2.jpg) center top no-repeat #374d98;
    position: relative;
    color: #fff;
}

#jfmat_bg2 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#jfmat_bg2 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/*--------------*/
.point1 {
    background: url(../images/point1.jpg) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 50px;
    clear: both;
}

@media (min-width: 768px) {
    .point1 {
        background: url(../images/point1.jpg) no-repeat left center;
        min-height: 28px;
        height: 28px;
        padding: 3px 0px 3px 50px;
        clear: both;
        font-size: 22px;
    }
}

.point1 a:link,
.point1 a:visited {
    color: #374d98;
    text-decoration: underline;
}

.point1 a:hover {
    color: #374d98;
    text-decoration: none;
}

/*----------------*/
/*--------------*/
.point2 {
    background: url(../images/point2.jpg) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 50px;
    clear: both;
}

@media (min-width: 768px) {
    .point2 {
        font-size: 22px;
    }
}

.point2 a:link,
.point2 a:visited {
    color: #374d98;
    text-decoration: underline;
}

.point2 a:hover {
    color: #374d98;
    text-decoration: none;
}

/*----------------*/
.point3 {
    background: url(../images/point3.jpg) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 50px;
    clear: both;
}

@media (min-width: 768px) {
    .point3 {
        font-size: 22px;
    }
}

.point3 a:link,
.point3 a:visited {
    color: #374d98;
    text-decoration: underline;
}

.point3 a:hover {
    color: #374d98;
    text-decoration: none;
}

/*----------------*/
.point4 {
    background: url(../images/point4.jpg) no-repeat left center;
    min-height: 28px;
    height: 28px;
    padding: 3px 0px 3px 50px;
    clear: both;
}

@media (min-width: 768px) {
    .point4 {
        font-size: 22px;
    }
}

.point4 a:link,
.point4 a:visited {
    color: #374d98;
    text-decoration: underline;
}

.point4 a:hover {
    color: #374d98;
    text-decoration: none;
}

/*----------------*/
/* id
----------------------------------------------------------*/
.id {
    background-image: url(../images/id_tit.jpg);
    background-position: center top;
}

#id_bg1 {
    background: url(../images/id_bg1.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #id_bg1 {
        background: url(../images/id_bg1.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

/* log
----------------------------------------------------------*/
.log {
    background-image: url(../images/log_tit.jpg);
    background-position: center top;
}

.log_midashi1 {
    background: linear-gradient(#66aee2, #1d79bb);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120%;
    font-weight: bold;
}

@media (min-width: 768px) {
    .log_midashi1 {
        padding: 10px 10px;
        text-align: center;
        font-size: 24px;
    }
}

.log_midashi2 {
    background: linear-gradient(#e88cb5, #d3568e);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120%;
    font-weight: bold;
}

@media (min-width: 768px) {
    .log_midashi2 {
        padding: 10px 10px;
        text-align: center;
        font-size: 24px;
    }
}

.log_midashi3 {
    background: linear-gradient(#63af85, #24814e);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 120%;
    font-weight: bold;
}

@media (min-width: 768px) {
    .log_midashi3 {
        padding: 10px 10px;
        text-align: center;
        font-size: 24px;
    }
}

.log_midashi4 {
    background: linear-gradient(#555, #111);
    padding: 5px;
    text-align: center;
    color: #fff;
    font-size: 100%;
    font-weight: bold;
}

@media (min-width: 768px) {
    .log_midashi4 {
        padding: 10px 10px;
        text-align: center;
        font-size: 20px;
    }
}

@media (min-width: 992px) {
    .log_midashi4 {
        padding: 10px 10px;
        text-align: center;
        font-size: 24px;
    }
}

.log_midashi4 span {
    color: #ff8c00;
}

@media (min-width: 768px) {
    .log_midashi4 span {
        margin-right: 10px;
    }
}

#log_bg1 {
    background: url(../images/log_bg1.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #log_bg1 {
        background: url(../images/log_bg1.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

/* infra
----------------------------------------------------------*/
.infra {
    background-image: url(../images/infra_tit.jpg);
    background-position: center top;
}

#infra_bg1 {
    background: url(../images/infra_bg1.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #infra_bg1 {
        background: url(../images/infra_bg1.jpg) center top no-repeat #efefef;
        padding: 120px 0;
    }
}

#infra_bg2 {
    background: #374d98;
    position: relative;
    color: #fff;
}

#infra_bg2 h3 {
    text-align: center;
    color: #fff;
    margin-bottom: 90px;
}

section#infra_bg2 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#infra_bg3 {
    background: #68749d;
    position: relative;
    color: #fff;
}

#infra_bg3 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#infra_bg3 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

#infra_bg4 {
    background: url(../images/infra_bg4.jpg) no-repeat scroll 50% 50% / cover;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #infra_bg4 {
        padding: 120px 0;
    }
}

#infra_bg4 h3 {
    text-align: center;
    color: #fff;
    position: relative;
    margin-bottom: 90px;
}

section#infra_bg4 > .container > h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

/*table*/
.table_bg1 {
    color: #fff;
    background-image: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
    text-align: center;
}

.infra_table1 {
    border-collapse: collapse;
    border: 1px solid #ccc;
    background: #fff;
}

.infra_table1 th {
    background: #ddd;
    width: 30%;

    /*white-space:nowrap;*/
    padding: 7px 7px;
    font-weight: normal;
    border: 1px solid #ccc;
    line-height: 140%;
    border-collapse: collapse;
}

.infra_table1 td {
    padding: 7px 10px;
    border: 1px solid #ccc;
    line-height: 140%;
}

@media (min-width: 768px) {
    .infra_table1 th {
        width: 28%;
        white-space: nowrap;
        padding: 10px 15px;
    }

    .infra_table1 td {
        padding: 10px 15px;
    }
}

.infra_table2 {
    width: 100%;
    border-collapse: collapse;
    border-bottom: solid 1px #495374;
}

.infra_table2 th {
    width: 100%;
    padding: 7px 7px;
    font-weight: bold;
    border-top: solid 1px #495374;
    border-right: solid 1px #495374;
    border-left: solid 1px #495374;
    line-height: 140%;
    display: block;
    background: #495374;
    border-collapse: collapse;
    text-align: left;
}

.infra_table2 th.bb_blue {
    border-bottom: solid 1px #374d98;
}

.infra_table2 td {
    width: 100%;
    padding: 14px 7px;
    border-top: solid 1px #495374;
    border-right: solid 1px #495374;
    border-left: solid 1px #495374;
    line-height: 140%;
    display: block;
    text-align: left;
    background: #68749d;
}

@media (min-width: 768px) {
    .infra_table2 {
        width: 100%;
        display: table;
        border-bottom: solid 1px #495374;
        margin-bottom: 0;
    }

    .infra_table2 th {
        width: 1%;
        white-space: nowrap;
        padding: 10px 10px;
        font-weight: bold;
        border: solid 1px #495374;
        line-height: 140%;
        display: table-cell;
        border-collapse: collapse;
    }

    .infra_table2 td {
        background: #68749d;
        padding: 20px 10px;
        border: solid 1px #495374;
        line-height: 140%;
        display: table-cell;
    }
}

/*-------------*/
.nowrap {
    width: 1%;
    white-space: nowrap;
}

.sp20pc50 {
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .sp20pc50 {
        margin-bottom: 50px;
    }
}

.yellow {
    color: #fde804;
}

.fs_l {
    font-size: 16px;
    font-weight: bold;
}

@media (min-width: 768px) {
    .fs_l {
        font-size: 20px;
        font-weight: bold;
    }
}

/* introduction
----------------------------------------------------------*/
.introduction {
    background-image: url(../images/introduction_tit.jpg);
    background-position: center top;
}

#introduction_bg1 {
    background: url(../images/introduction_bg1.jpg) no-repeat scroll 50% 50% / cover;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #introduction_bg1 {
        padding: 120px 0;
    }
}

@media (min-width: 992px) {
    #introduction_bg1 {
        line-height: 2;
        font-size: 18px;
    }
}

.introduction_midashi1 {
    background: #2f889f;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 15px;
    font-size: 17px;
    font-weight: bold;
}

@media (min-width: 768px) {
    .introduction_midashi1 {
        padding: 10px;
        margin-bottom: 20px;
        text-align: center;
        font-size: 25px;
        font-weight: normal;
    }
}

@media (min-width: 992px) {
    .introduction_midashi1 {
        padding: 20px;
        margin-bottom: 30px;
        text-align: center;
    }
}

.introduction_midashi2 {
    background: #367d4a;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 15px;
    font-size: 17px;
    font-weight: bold;
}

@media (min-width: 768px) {
    .introduction_midashi2 {
        padding: 10px;
        margin-bottom: 20px;
        text-align: center;
        font-size: 25px;
        font-weight: normal;
    }
}

@media (min-width: 992px) {
    .introduction_midashi2 {
        padding: 20px;
        margin-bottom: 30px;
        text-align: center;
    }
}

.introduction_midashi3 {
    background: #d8a034;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 15px;
    font-size: 17px;
    font-weight: bold;
}

@media (min-width: 768px) {
    .introduction_midashi3 {
        padding: 10px;
        margin-bottom: 20px;
        text-align: center;
        font-size: 25px;
        font-weight: normal;
    }
}

@media (min-width: 992px) {
    .introduction_midashi3 {
        padding: 20px;
        margin-bottom: 30px;
        text-align: center;
    }
}

/* account
----------------------------------------------------------*/
.account {
    background-image: url(../images/account_tit.jpg);
    background-position: center top;
}

#account_bg1 {
    background: url(../images/account_bg1.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #account_bg1 {
        padding: 120px 0;
    }
}

#account_bg2 {
    background: url(../images/account_bg2.jpg) center top no-repeat #efefef;
    padding: 45px 0 0;
}

@media (min-width: 768px) {
    #account_bg2 {
        padding: 120px 0 0;
    }
}

#account_bg3 {
    background: url(../images/account_bg3.jpg) center top no-repeat #efefef;
    padding: 45px 0 0;
}

@media (min-width: 768px) {
    #account_bg3 {
        padding: 120px 0 0;
    }
}

#account_bg3 h3 {
    margin-bottom: 45px;
    font-size: 39px;
    font-weight: normal;
    color: #fff;
}

#account_bg3 h3 {
    text-align: center;
    position: relative;
    margin-bottom: 90px;
}

#account_bg3 h3:after {
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #fff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.account_table {
    border-collapse: collapse;
}

.account_table th {
    background: #1a2c6a;
    width: 1%;
    white-space: nowrap;
    padding: 7px 7px;
    font-weight: bold;
    line-height: 140%;
    border-collapse: collapse;
    border-bottom: 5px solid #68749d;
}

.account_table td {
    padding: 7px 10px;
    line-height: 140%;
    border-bottom: 5px solid #68749d;
}

@media (min-width: 768px) {
    .account_table th {
        width: 1%;
        padding: 10px 15px;
        font-size: 20px;
        border-bottom: 10px solid #68749d;
    }

    .account_table td {
        padding: 10px 15px;
        border-bottom: 10px solid #68749d;
    }
}

@media (min-width: 992px) {
    .account_table th {
        width: 1%;
        padding: 10px 50px;
    }

    .account_table td {
        padding: 10px 20px;
    }
}

.account_midashi {
    color: #fee617;
}

@media (min-width: 768px) {
    .account_midashi {
        font-size: 25px;
        line-height: 1.2;
    }
}

/* casb
----------------------------------------------------------*/
.casb {
    background-image: url(../images/casb_tit.jpg);
    background-position: center top;
}

@media (min-width: 768px) {
    .casb h2 span {
        font-size: 26px;
    }
}

@media (min-width: 992px) {
    .casb h2 span {
        font-size: 38px;
    }
}

#casb_bg1 {
    background: url(../images/casb_bg1.jpg) no-repeat scroll 50% 50% / cover;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #casb_bg1 {
        padding: 120px 0;
    }
}

#casb_bg2 {
    background: url(../images/casb_bg2.jpg) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #casb_bg2 {
        padding: 120px 0;
    }
}

.casb_box1 {
    background: #182a65;
    padding: 5px;
    color: #fff;
}

@media (min-width: 768px) {
    .casb_box1 {
        padding: 15px;
    }
}

@media (min-width: 992px) {
    .casb_box1 {
        padding: 20px;
        text-align: center;
    }
}

.casb_midashi1 {
    font-size: 20px;
    text-align: center;
}

@media (min-width: 768px) {
    .casb_midashi1 {
        font-size: 24px;
    }
}

@media (min-width: 992px) {
    .casb_midashi1 {
        font-size: 28px;
    }
}

.casb_box2 {
    color: #fff;
    text-align: left;
}

.casb_box3 {
    text-align: left;
}

.casb_midashi2 {
    color: #fff;
    font-size: 120%;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .casb_midashi2 {
        font-size: 22px;
        text-align: center;
    }
}

@media (min-width: 992px) {
    .casb_midashi2 {
        font-size: 35px;
        text-align: center;
        margin-bottom: 40px;
    }
}

.casb_box4 {
    border-bottom: 1px solid #1a2c6a;
    margin-bottom: 20px;
    padding-bottom: 20px;
}

.casb_text1 {
    color: #fff;
}

@media (min-width: 768px) {
    .casb_text1 {
        font-size: 18px;
        line-height: 1.3;
    }
}

@media (min-width: 992px) {
    .casb_text1 {
        font-size: 25px;
        line-height: 1.5;
    }
}

.casb_border {
    border: 1px solid #fff;
}

.casb_box5 {
    padding: 5px;
    text-align: left;
    border: 1px solid #fff;
}

@media (min-width: 768px) {
    .casb_box5 {
        padding: 15px;
    }
}

.casb_midashi3 {
    font-size: 120%;
    margin-bottom: 10px;
    color: #fff;
}

@media (min-width: 768px) {
    .casb_midashi3 {
        font-size: 22px;
    }
}

.casb_box6 {
    background: #fff;
    padding: 5px;
    text-align: left;
    color: #333;
}

@media (min-width: 768px) {
    .casb_box6 {
        padding: 15px;
    }
}

.casb_box7 {
    padding: 5px;
    text-align: left;
    background: #cfcfcf;
}

@media (min-width: 768px) {
    .casb_box7 {
        padding: 15px;
    }
}

.casb_midashi4 {
    font-size: 120%;
    margin-bottom: 10px;
}

@media (min-width: 768px) {
    .casb_midashi4 {
        font-size: 22px;
    }
}

.casb_box8 {
    padding: 5px;
    text-align: left;
    border: 1px solid #cfcfcf;
}

@media (min-width: 768px) {
    .casb_box8 {
        padding: 15px;
    }
}

.casb_midashi5 {
    color: #1a2c6a;
    font-size: 120%;
    margin-bottom: 20px;
}

@media (min-width: 768px) {
    .casb_midashi5 {
        font-size: 22px;
        text-align: center;
    }
}

@media (min-width: 992px) {
    .casb_midashi5 {
        font-size: 35px;
        text-align: center;
        margin-bottom: 40px;
    }
}

/* 2018032720180327追加
----------------------------------------------------------*/
.sankaku {
    width: 0;
    height: 0;
    border-top: 20px solid #ff8c00;
    border-right: 50px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 50px solid transparent;
    margin: 0 auto;
}

/* infra
----------------------------------------------------------*/
.cross {
    margin: 0 auto 60px;
    font-size: 120px;
    font-weight: normal;
    color: #1a2c6a;
    text-align: center;
}

@media (max-width:767px){
    .cross {
        font-size: 100px;
        margin: 0 auto 10px;
    }
}

/* consulting
----------------------------------------------------------*/
.consulting_bg {
    background: url(../images/bg2.jpg) no-repeat top center #fff;
}

.vdi {
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.vdi-bgc {
    background-color: #a92020;
}

.vdi-txt {
    font-size: 30px;
    font-weight: bold;
    color: #1a2c6a;
    text-decoration: underline;
}

.txt--left {
    text-align: left;
}

.th {
    background: #68749d;
    color: #ffffff;
    font-weight: bold;
    padding: 8px;
    border: 6px solid #ffffff;
}

.td {
    background-color: #94a0c8;
    color: #000000;
    font-weight: bold;
    padding: 3px;
    border: 6px solid #ffffff;
}

.img {
    max-width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.p-30 {
    padding: 30px;
}

.bg-white {
    background-color: #ffffff;
}

#office_bg_01 {
    background: url(../images/365security_top.png) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #office_bg_01 {
        padding: 120px 0 66px;
    }
}

#cloud-vdi_bg_01 {
    background: url(../images/cloud-vdi.png) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #cloud-vdi_bg_01 {
        padding: 120px 0 66px;
    }
}

#vulerabillty_bg_01 {
    background: url(../images/vulerabillty_bg.png) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #vulerabillty_bg_01 {
        padding: 120px 0 66px;
    }
}

.ttl {
    font-size: 26px;
    line-height: 50px;
}

.ttl-large {
    font-size: 34px;
    line-height: 60px;
}

.icon-size {
    font-size: 26px;
    line-height: 40px;
    font-weight: bold;
}

.br_pc{display:none;}
@media (min-width: 768px) {
	.br_pc{display:block;}
}

.br_sp{display:none;}
@media (max-width: 767px) {
	.br_sp{display:block;}
}

.tac{text-align:center;}

.iot_ai{margin-bottom:80px !important;}
@media (max-width: 767px) {
.iot_ai{margin-bottom:60px !important;}
}

.iot_ai ul{ padding:0 20px;}
@media (min-width: 768px) {
.iot_ai ul{ padding:0 20px; margin-bottom:20px;}
}
@media (min-width: 769px) and (max-width: 1024px){
.iot_ai ul{ padding-left:65px;}
}
@media (min-width:1200px){
.iot_ai ul{ padding:40px 0 0 135px;}
}

.iot_ai ul li{ list-style:square;}




.managed_table {
  border-collapse:  collapse;
}
.managed_table tr th,
.managed_table tr td {
  border: solid 1px;
  padding: 10px;
}
.managed_table tr th {
  text-align: center;
  background: #1a2c6a;
  color: #fff;
}
.managed_table tr td {
  background: #fff;
  color: #000;
}
@media (min-width: 769px) {
  .managed_table tr th {
    width: 25%;
  }
}
@media (max-width: 768px) {
  .managed_table tr {
    display: flex;
    flex-wrap: wrap;
  }
  .managed_table tr th {
    width:100%;
    text-align: center;
    border: 1px solid #1a2c6a;
  }
}


.managed_table02 {
  border-collapse:  collapse;
  margin-bottom: 20px;
}
.managed_table02 tr th,
.managed_table02 tr td {
  border: solid 1px #0078d7;
  padding: 10px 0px;
}
.managed_table02 tr th {
  text-align: center;
  background: #0078d7;
  color: #fff;
  width: 30%;
  padding: 10px 5px;
}
.managed_table02 tr td {
  padding: 10px;
  width: 35%;
}
.managed_table02 tr td ul {
    margin-left: 20px;
}
@media (max-width: 768px) {
  .managed_table02 tr {
    display: flex;
    flex-wrap: wrap;
  }
  .managed_table02 tr th {
    width:100%;
    text-align: center;
    border: 1px solid #fff;
  }
  .managed_table02 tr td {
    width:100%;
    border-top: none;
  }
}


.managed_table03 {
  border-collapse:  collapse;
  margin-bottom: 20px;
}
.managed_table03 tr th,
.managed_table03 tr td {
  border: solid 1px #008272;
  padding: 10px 0px;
}
.managed_table03 tr th {
  text-align: center;
  background: #008272;
  color: #fff;
  width: 30%;
  padding: 10px 5px;
}
.managed_table03 tr td {
  padding: 10px;
  width: 35%;
}
.managed_table03 tr td ul {
    margin-left: 20px;
}
@media (max-width: 768px) {
  .managed_table03 tr {
    display: flex;
    flex-wrap: wrap;
  }
  .managed_table03 tr th {
    width:100%;
    text-align: center;
    border: 1px solid #fff;
  }
  .managed_table03 tr td {
    width:100%;
    border-top: none;
  }
}

.managed_table04 {
  border-collapse:  collapse;
  margin-bottom: 20px;
}
.managed_table04 tr th,
.managed_table04 tr td {
  border: solid 1px #e2be38;
  padding: 10px 0px;
}
.managed_table04 tr th {
  text-align: center;
  background: #e2be38;
  color: #fff;
  width: 30%;
  padding: 10px 5px;
}
.managed_table04 tr td {
  padding: 10px;
  width: 35%;
}
.managed_table04 tr td ul {
    margin-left: 20px;
}
@media (max-width: 768px) {
  .managed_table04 tr {
    display: flex;
    flex-wrap: wrap;
  }
  .managed_table04 tr th {
    width:100%;
    text-align: center;
    border: 1px solid #fff;
  }
  .managed_table04 tr td {
    width:100%;
    border-top: none;
  }
}


.managed_table05 {
  border-collapse:  collapse;
}
.managed_table05 tr th,
.managed_table05 tr td {
  border: solid 1px;
  padding: 20px;
}
.managed_table05 tr th {
  text-align: center;
  background: #1a2c6a;
  color: #fff;
}
.managed_table05 tr td {
  background: #fff;
  color: #000;
}
.managed_table05 tr th.blueLight {
  text-align: center;
  background: #84a8ed;
  color: #fff;
}
.managed_table05 tr th.blueLight:after {
  display: block;
  content: "";
  background-image: url(../images/arrow-downLight.png);
  background-size: cover;
  width: 30px;
  height: 16px;
  position: absolute;
  bottom: -16px;
  z-index: 10;
  left: calc(50% - 15px );
}
@media (max-width: 768px) {
  .managed_table05 tr th.blueLight:after {
    display: none;
  }
}


@media (min-width: 769px) {
  .managed_table05 tr th {
    width: 25%;
    position: relative;
  }
  .managed_table05 tr th:after {
    display: block;
    content: "";
    background-image: url(../images/arrow-down.png);
    background-size: cover;
    width: 30px;
    height: 16px;
    position: absolute;
    bottom: -16px;
    z-index: 10;
    left: calc(50% - 15px );
  }
  .managed_table05 tr:last-child th:after {
    display: none;
  }
}
@media (max-width: 768px) {
  .managed_table05 tr {
    display: flex;
    flex-wrap: wrap;
  }
  .managed_table05 tr th {
    width:100%;
    text-align: center;
    border: 1px solid #1a2c6a;
  }
  .managed_table05 tr th.blueLight {
    width:100%;
    text-align: center;
    border: 1px solid #84a8ed;
  }
  .managed_table05 tr td {
    width:100%;
  }

}

.azurepaasTableTitle {
  background: #6785c1;
  padding: 15px;
  color: #fff;
  font-size: 20px;
}
.azurepaasTableBlue td {
  border: 2px solid #fff;
  background: #d3d9e9;
  color: #000;
  padding: 15px 10px;
}
.azurepaasTableBlue td.number {
  text-align:center;
  color:#000;
  font-size: 20px;
  width: 50px;
}
.azurepaasTableBlue td.conts {
  color:#000;
  font-size: 16px;
}

.azurepaasTableBlueLight td {
  border: 2px solid #fff;
  background: #ebedf4;
  color: #000;
  padding: 15px 10px;
}
.azurepaasTableBlueLight td.number {
  text-align:center;
  color:#000;
  font-size: 20px;
}
.azurepaasTableBlueLight td.conts {
  color:#000;
  font-size: 16px;
}
.azurepaasList {
  margin-left: 20px;
}
.disc {
  list-style: disc;
}

.azurepaasTable02Title {
  background: #495fab;
  padding: 5px 10px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  border: 2px solid #fff;
}
.azurepaasTableBlue td.azurepaasTable02subTitle {
  text-align:center;
  color:#000000;
  font-weight: bold;
}
.azurepaasTableBlue td.azurepaasTable02Conts ul {
  color:#000000;
  font-weight: bold;
  margin-left: 20px;
  font-size: 14px;
}

.azurepaasTableBlueLight td.azurepaasTable02subTitle {
  text-align:center;
  color:#000000;
  font-weight: bold;
}
.azurepaasTableBlueLight td.azurepaasTable02Conts ul {
  color:#000000;
  font-weight: bold;
  margin-left: 20px;
  font-size: 14px;
}

.center {text-align: center;}
.fwb {font-weight: bold !important;}


/* 20200501追加 */
#mg_se_bg1 {background: #efefef;}
#mg_se_bg2 {
  background: #374d98;
  position: relative;
  color: #fff;
}
section#mg_se_bg2 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#mg_se_bg2 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}
#mg_se_bg3 {
  background: #68749d;
  position: relative;
  color: #fff;
}
section#mg_se_bg3 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#mg_se_bg3 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}

#paas_se_bg1 {background: #efefef;}
#paas_se_bg2 {
  background: #374d98;
  position: relative;
  color: #fff;
}
section#paas_se_bg2 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#paas_se_bg2 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}
#paas_se_bg3 {
  background: #68749d;
  position: relative;
  color: #fff;
}
section#paas_se_bg3 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#paas_se_bg3 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}

#cloud_net_bg1 {background: #efefef;}
#cloud_net_bg2 {
  background: #374d98;
  position: relative;
  color: #fff;
}
section#cloud_net_bg2 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#cloud_net_bg2 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}
#cloud_net_bg3 {
  background: #68749d;
  position: relative;
  color: #fff;
}
section#cloud_net_bg3 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#cloud_net_bg3 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}

section#cloud_net_bg3 .link_list a {
    color: #fff;
}


#csv1 {background: #efefef;}
#csv2 {
  background: #374d98;
  position: relative;
  color: #fff;
}
section#csv2 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#csv2 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}
#csv3 {
  background: #68749d;
  position: relative;
  color: #fff;
}
section#csv3 > .container > h3 {
  color: #fff;
  text-align: center;
  position: relative;
  margin-bottom: 90px;
}
section#csv3 > .container > h3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #ffffff;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}


.paas_se_bg2List {
  margin-left: 20px;
  margin-bottom: 20px;
}
.link_list p a {
  text-decoration: underline;
  font-size: 20px;
}
.link_list p a:hover {
  text-decoration: none;
}
.zip_list a {
  text-decoration: underline;
  font-size: 18px;
  color: #fff;
}
.zip_list a:hover {
  text-decoration: none;
}
.zip_list i {
  font-size: 22px;
  margin-left: 10px;
}
.zip_list02 a {
  text-decoration: underline;
  font-size: 18px;
  color: #000;
}
.zip_list02 a:hover {
  text-decoration: none;
  color: #000;
}
.zip_list02 i {
  font-size: 22px;
  margin-left: 10px;
}

.checkList {
  list-style: none;
}
.checkList li {
  margin-left: 1em;
  text-indent: -1em;
  margin-bottom: 10px;
}
.checkList li:before {
    content: '✓';
    font-weight: bold;
}
.checkList li a {
  text-decoration: underline;
}
.checkList li a:hover {
  text-decoration: none;
}
.linkList p {
  margin-left: 20px;
  text-indent: -1em;
}
.linkList p:before{
  content: "●";
  margin-right: 10px;
}
.linkList p a {
  color:#fff;
  text-decoration: underline;
}
.linkList p a:hover {
  text-decoration: none;
}
.yellowTitle {
  font-size: 20px;
  color:#ee9100;
}

.lead01 {
  text-align: center;
  font-weight: bold;
  margin: 0 0 50px;
  font-size: 24px;
}
@media (max-width: 767px){
  .lead01 {
    font-size: 16px;
    margin-bottom: 20px
  }
}


#js-temp_bg_01 {
    background: url(../images/js-temp.png) center top no-repeat #efefef;
    padding: 45px 0;
}

@media (min-width: 768px) {
    #js-temp_bg_01 {
        padding: 120px 0 66px;
    }
}

.tal{text-align: left;}
.txt-blue{color: #1a2c6a;}


.ttl-01{
    font-size: 24px !important;
    line-height: 34px !important;
    font-weight: bold !important;
}
.ttl-02{
    font-size: 18px;
    line-height: 28px;
    text-align: left;
}
.ttl-03{
    font-size: 18px !important;
    line-height: 28px !important;
    text-align: left !important;
}
.ttl-04{
    font-weight: bold !important;
    font-size: 18px !important;
    text-align: left !important;
}
.ttl-05{
    font-size: 16px;
    font-weight: bold;
}
.ttl-06{
    font-weight: bold !important;
    font-size: 20px !important;
    text-align: left !important;
    padding: 10px 0;
}

@media (min-width: 768px) {
    .ttl-01{
        font-size: 34px !important;
        line-height: 60px !important;
        font-weight: bold !important;
    }
    .ttl-02{
        font-size: 26px;
        line-height: 50px;
        text-align: left;
    }
    .ttl-03{
        font-size: 26px !important;
        line-height: 50px !important;
        text-align: left !important;
    }
    .ttl-04{
        font-weight: bold !important;
        font-size: 28px !important;
        text-align: center !important;
        line-height: 40px;
    }
    .ttl-05{
        font-size: 23px;
    }
    .ttl-06{
        font-weight: bold !important;
        font-size: 20px !important;
        text-align: left !important;
        padding: 10px 0;
    }
}


.js-01{}
.js-01 div{}
.js-01 div div{
    background-color: #c6d9f1;
    padding: 20px;
    margin-bottom: 10px;
}
.js-01 h4{
    color: #0070c0;
    font-size: 24px;
    text-align: center;
    margin-bottom: 20px;
}
.js-01 p{
    background-color: #fff;
    padding: 10px 20px;
}
@media (min-width: 768px) {
    .js-01{}
    .js-01 div{}
    .js-01 div div{
        background-color: #c6d9f1;
        padding: 20px;
        margin-bottom: 40px;
    }
    .js-01 h4{
        color: #0070c0;
        font-size: 24px;
        text-align: center;
        margin-bottom: 20px;
    }
    .js-01 p{
        background-color: #fff;
        padding: 20px 40px;
    }
}



.js-temp-startpack{
    width: 100%;
    margin: 0px auto 20px;
}

.js-temp-startpack ul {
    padding: 0;
    position: relative;
    background-color: #558ed5;
    padding: 20px 0 20px 30px;
    font-size: 16x;
  }

  .js-temp-startpack ul li {
    color: white;
    line-height: 1.5;
    list-style-type: none!important;
    font-weight: bold; /*好みで太字に*/
    margin-bottom: 10px;
  }
  .js-temp-startpack ul li:last-child {
    margin-bottom: 0;
  }

.js-temp-startpack ul li:before {
    font-family: "FontAwesome";
    content: "\f0c8";
    position: absolute;
    left : 0.5em; /*左端からのアイコンまでの距離*/
    color: white; /*アイコン色*/
  }


  @media (min-width: 768px) {
    .js-temp-startpack{
        width: 80%;
        margin: 0px auto 50px;
    }

    .js-temp-startpack ul {
        padding: 0;
        position: relative;
        background-color: #558ed5;
        padding: 20px 0 20px 60px;
        font-size: 22px;
      }

      .js-temp-startpack ul li {
        color: white;
        line-height: 1.5;
        list-style-type: none!important;
        font-weight: bold; /*好みで太字に*/
        margin-bottom: 10px;
      }
      .js-temp-startpack ul li:last-child {
        margin-bottom: 0;
      }

    .js-temp-startpack ul li:before {
        font-family: "FontAwesome";
        content: "\f0c8";
        position: absolute;
        left : 1em; /*左端からのアイコンまでの距離*/
        color: white; /*アイコン色*/
      }
  }

    .mb-a{margin-bottom: 20px !important;}
    .txt-a{text-align: center !important;}
    .txt-b{text-align: left !important;}
    @media (min-width: 768px) {
        .mb-a{margin-bottom: 50px !important;}
        .txt-b{text-align: center !important;}
    }

    .fs14{font-size: 14px !important;}
    .fs16{font-size: 16px !important;}
.fs24{font-size: 24px !important;}
.text-blue{color: #1a2c6a !important;}


.interviewFooter {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding-bottom: 20px;
}
.interviewFooter p {
  text-indent: -1em;
  margin-left: 1em;
}
.recruitBox {
  padding: 30px 0px !important;
}
.figcaption {
  font-size: 14px!important;
  text-align: center;
  margin-top: 5px!important;
}
.recruitH3 {
  font-size: 39px;
  font-weight: normal;
  color: #1a2c6a;
}
.recruitH3:after {
  content: "";
  width: 210px;
  height: 3px;
  left: 50%;
  margin-left: -105px;
  background: #1a2c6a;
  bottom: 0;
  position: absolute;
  bottom: -44px;
}

.mt00 {
  margin-top: 0px!important;
}

.yellowTitle {
  color: #d2cd10;
  font-weight: bold;
  font-size: 20px;
}
.whiteText {
  color: #fff;
}

.bkWhite {
  background: #fff;
  color: #000;
  font-size: 14px;
  padding: 0 5px;
  margin-left: 5px;
  border-radius: 5px;
  display: inline-block;
}
.flexBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

@media  (max-width:991px){
  .flexBox {
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
  }
}

.flexSaseBox {
  display: flex;
  justify-content: space-around;
  position: relative;
  margin-bottom: 20px;
}
.flexSaseBox:after {
  display: block;
  content: "";
  background-image: url(../images/arrowRight.png);
  background-repeat: no-repeat;
  position: absolute;
  width: 50px;
  height: 50px;
  background-size: contain;
  top: calc(50% - 25px);
}

.flexSaseBox .box,
.flexSaseBox .box02 {
  width: 42%;
}
@media  (max-width:991px){
  .flexSaseBox {
    display: flex;
    justify-content: space-around;
    position: relative;
    flex-wrap: wrap;
  }
  .flexSaseBox:after {
    display: none;
  }
  .flexSaseBox .box,
  .flexSaseBox .box02 {
    width: 100%;
  }
}





.flexSaseArrowImg img {
  padding: 15px;
  width: 100%;
  margin:0 auto;
  text-align: center;
}

.kome {
  margin-left: 1em;
  text-indent: -1em;
}

.videoBorder {
  border-bottom: dotted 3px #000000;
  text-align: center;
  padding-bottom: 20px;

}

.videoBorder video {
  width: 80%;
  max-width: 800px;
}


.ns-solution-list-area {
    background: #fff;
    padding:20px;
}
.ns-solution-list { list-style: none;}
.ns-solution-list li {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.ns-solution-list02 {
    padding: 30px 0;
}
.ns-solution-list02 > li {
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    padding: 0 40px;
}

.ns-solution-list .ns-solution-list-borde-area {
    display: flex;
    justify-content: space-around;
    align-items: stretch;
    margin-bottom: 30px;
    position: relative;
}


.rightArrow {
    position: relative;
    width: 50px;
    height: 50px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    display: block;
}

.bottomArrow {display: none;}
.pc {display: block;}
.sp {display: none;}

@media (min-width:768px) and (max-width:991px){
    .rightArrow {display: block;}
    .bottomArrow {display: none;}
    .pc {display: none;}
    .sp {display: block;}
}
@media (max-width:767px){
    .rightArrow {display: none!important;}
    .bottomArrow {
        display: block;
        margin-bottom: 20px;
    }
    .pc {display: none!important;}
    .sp {display: block;}
}










.ns-solution-list-title-red {
    font-size: 30px;
    font-weight: bold;
    color: #e22424;
    width: 210px;
    text-align: center;
}
.ns-solution-list-title-blue {
    font-size: 30px;
    font-weight: bold;
    color: #0c3995;
    width: 210px;
    text-align: center;
}
.ns-solution-list-border-yellow-h4 {
    display: none;
 }
.ns-solution-list-border-blue-h4 {
    display: none;
}
.ns-solution-list-border-yellow {
    border: 2px solid #e6b500;
    border-radius: 20px;
    padding: 15px 5px;
    background: #fff2ce;
    color: #e22424;
    max-width: 450px;
    width: 100%;
    position: relative;
}


.ns-solution-list-border-blue {
    border: 2px solid #bdc9e2;
    border-radius: 20px;
    padding: 15px 5px;
    background:#d4e2ff;
    color: #000;
    max-width: 450px;
    width: 100%;
    position: relative;
}
.infoSASE {
    text-align: center;
    font-size: 15px;
    margin: 10px auto;
    width: auto;
}
.infoSASE a{
    display: inline-block;
    background: #c70a0a;
    padding: 5 10px;
    color: #fff;
    font-weight: bold;
    padding: 5px 15px;
    border-radius: 20px;
    width: 90%;
}
.infoSASE a i {
    font-size: 16px;
}

.infoSASE a:hover {
    text-decoration: none;
    background: #bc0b0b;
    color: #fff;
}


.ns-solution-list-border-title-red {
    text-align: center;
    font-size: 20px;
    color: #e22424;
    margin-bottom: 10px;
    font-weight: bold;
    line-height: 1.6;
}
.ns-solution-list-border-title-black {
    text-align: center;
    font-size: 20px;
    color: #333;
    margin-bottom: 10px;
    font-weight: bold;
    line-height: 1.6;
}
.disc-red  { padding-left: 20px;}
.disc-red li {
    list-style: disc;
    color: #e22424;
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px; 
}
.disc-black  { padding-left: 20px;}
.disc-black li {
    list-style: disc;
    color: #333;
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 5px;
}
.disc-black a {
    font-size: 16px;
    text-decoration: underline;
    color:#e22424;
}
.small-list {
    display: flex;
    justify-content: center;
    list-style: none;
    flex-wrap: wrap;
}
.small-list li {
    display: inline-block;
    margin: 5px 3px;
    background: #4f81bd;
    color: #fff;
    padding: 3px 20px;
    font-weight: bold;
    border-radius: 20px;
    font-size: 12px;
}
.disc-black-strong {
    font-size: 18px;
    font-weight: bold
}
@media (min-width:992px) and (max-width:1199px){
    .ns-solution-list-border-yellow {
        max-width: 380px;
        width: 100%;
    }
    .ns-solution-list-border-blue {
        max-width: 380px;
        width: 100%;
    }
    .ns-solution-list-border-title-red {
        font-size: 16px;
    }
    .ns-solution-list-border-title-black {
        font-size: 16px;
    }
    .ns-solution-list ul .ns-solution-list-borde-area {
        margin-bottom: 20px;
    }
    .disc-red li {
        font-size: 12px;
    }
    .disc-black li {
        font-size: 12px;   
    }
    .small-list li {
        padding: 3px 10px;
    } 
    .disc-black-strong {
        font-size: 125%;
    }
}
@media  (max-width:991px){
    .ns-solution-list-title-red {
        font-size: 2vw;
    }
    .ns-solution-list-title-blue {
        font-size: 2vw;
    }
    .ns-solution-list-border-title-red {
        font-size: 16px;
    }
    .ns-solution-list-border-title-black {
        font-size: 16px;
    } 
        .ns-solution-list ul .ns-solution-list-borde-area {
        margin-bottom: 10px;
    }
    .disc-red li {
        font-size: 12px;
    }
    .disc-black li {
        font-size: 12px; 
    }
    .disc-black-strong {
        font-size: 110%;
    } 
    .ns-solution-list-borde-area::after {
        font-size: 5vw;
        top: calc(8vw - -10%);
    }
    .small-list {
        flex-wrap: wrap;
    }
    .small-list li {
        width: 100%;
        text-align: center;
        font-size: 14px;
        padding: 2px;
        margin: 2px;
    }
    .ns-solution-list-border-yellow {
        max-width: 400px;
        width: 42%;
    }
    .ns-solution-list-border-blue {
        max-width: 400px;
        width: 42%;
    }
    .infoSASE {
        font-size: 12px;
        line-height: 1.7;
    }
    .infoSASE a{
        width: 100%;
    }
    .ns-solution-list02 > li {
        padding: 0 20px;
    }
}
@media (max-width:767px){
    .ns-solution-list-borde-area {
        flex-wrap: wrap;
        padding-bottom: 10px;
        border-bottom: 2px dotted #ccc;
    }
    .ns-solution-list-border-yellow {
        max-width: 680px;
        width: 100%;
        margin-bottom: 2vw;
    }
    .ns-solution-list-border-blue {
        max-width: 680px;
        width: 100%;
    }
    .ns-solution-list-borde-area::after {
        display: none;
    }
    .ns-solution-list-border-yellow-h4 {
        font-size: 14px;
        display: block!important;
        text-align: center;
        margin-bottom: 10px;
        color: #a40000;
    }
    .ns-solution-list ul .ns-solution-list-borde-area {
        margin-bottom: 20px;
    }
    .ns-solution-list-border-blue {
        margin-bottom: 20px;
    }
    .ns-solution-list-border-blue-h4 {
        font-size: 14px;
        display: block!important;
        text-align: center;
        margin-bottom: 10px;
        color: #294277;
    }
        .ns-solution-list-border-title-red {
        font-size: 18px;
    }
    .ns-solution-list-border-title-black {
        font-size: 18px;
    } 
    .ns-solution-list02 {
        padding: 0px;
    }
    .ns-solution-list02 > li {
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 0px;
        flex-wrap: wrap;
    }

    .infoSASE a{
        width: 100%;
    }
}


.wifiTask {
    margin-left: 1.5em;
    padding-left: 1em;
    text-indent: -2em;
    color: #e22424;
    font-size: 20px;
}
.wifiTask:before {
    content: "⇒";
    position: relative;
    display: inline-block;
    margin-left: 2em;
}

.wifiTask02 {
    margin-left: 1.5em;
    padding-left: 1em;
    text-indent: -2em;
    color: #111;
    font-size: 20px;
}

.wifiTask02:before {
    content: "⇒";
    position: relative;
    display: inline-block;
    margin-left: 2em;
}
@media (max-width:767px){
    .wifiTask {
        font-size: 16px;
    }
    .wifiTask02 {
        font-size: 16px;
    }
}


.boxTitle {
    display: inline-block;
    padding: 10px 30px;
    font-size: 24px;
    background: #0080b1;
    border-radius: 5px;
    margin-bottom: 20px;
}
.tac {text-align: center;}

.wifiZirei {
    background: #dfdfdf;
    padding: 10px 0px;
    margin: 10px 0;
}

.wifiZireiTitle {
    padding: 15px 20px;
    background: #215968;
    color: #fff;
    font-weight: bold;
    font-size: 15px;
}
.wifiZireiText {
    padding: 15px 0px 15px 20px;
    color: #595959;
    font-weight: bold;
    font-size: 14px;
}

@media (max-width:767px){
    .wifiZirei {
        margin: 0 0 10px 0;
        padding: 0px;
    }
    .wifiZireiTitle {
        display: block;
        width: 100%;
        text-align: center; 
        padding: 10px 0;
    }
    .wifiZireiText {
        display: block;
        width: 100%;
        padding: 10px 0;
        text-align: center;
    }
}


.introductionList {
    list-style: none;
}

.introductionList li {
    background: #dfdfdf;
    margin-bottom: 10px;
    color: #111;
    padding: 10px 0;
}

.introductionList li p {
    position: relative; 
}


.introductionTitle {
    display: inline-block;
    color: #374d98;
    padding: 10px 0 10px 10px;
    font-weight: bold;
    font-size: 18px;
    width: 25%;
}
.introductionText {
    display: inline-block;
    font-weight: bold;
    font-size: 18px;
    width: auto;
}
@media (max-width:991px){
    .introductionTitle {
        padding: 5px 0 10px 0;
        width: 100%;
        text-align: center;
}
    .introductionText {
        padding: 0px 0 10px 0;
        width: 100%;
        text-align: center;
        font-size: 14px;
    }
}

.checkStyle {
   position: relative; 
}

.checkStyle:before {
    content: "✓";
    position: relative;
    display: inline-block;
}


.flexBoxWifiFining {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

@media  (max-width:991px){
  .flexBoxWifiFining {
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: center;
  }
}

.wifiFixingTitle01 {
    font-size: 22px;
    font-weight: bold;
    background: #0080b1;
    color: #fff;
    width: 100%;
    text-align: center; 
    padding: 10px 0;
}
.wifiFixingTitle02 {
    font-size: 16px;
    font-weight: bold;
    background: #ececec;
    margin-top: 0px;
    color: #111;
    text-align: center;
    padding: 5px 10px;
    margin-bottom: 10px;
}
@media  (max-width:991px){
    .wifiFixingTitle01 {
        font-size: 14px;
    }
    .wifiFixingTitle02 {
        font-size: 14px;
    }
}

.wifiFixingImg {
    position: relative;
    margin-bottom: 20px;
}
.wifiFixingBeforeAfterText {
    position: absolute;
    top: 10px;
    font-size: 16px;
    font-weight: bold;
}


.network-youtube{
    padding: 90px 0 0;
}
@media (min-width: 768px) and (max-width: 991px){
    .network-youtube{
        padding: 60px 0 0;
    }
}
@media (max-width: 767px){
    .network-youtube{
        padding: 45px 0 0;
    }
}

.tit-case_sapsystem{
    font-size: 18px;
    background-color: #1a2c6a;
    color: #fff;
    padding: .5em .75em;
    line-height: 1.5;
    display: inline-block;
}

.task{
    -ms-flex-wrap: nowrap;
  	flex-wrap: nowrap;
}
.task dt{
    width: auto;
    white-space: nowrap;
}
.task dd{
    width: auto;
}
.tit-method{
    font-size: 39px;
    text-align: center;
}
.solution_list{
    list-style-type: decimal;
    padding-left: 1.5em;
}
@media (min-width: 768px) and (max-width: 991px){
    .task{
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }
    .task dt{
        width: auto;
    }
    .task dd{
        width: auto;
    }
    .tit-method{
        font-size: 24px;
    }
}
@media (max-width: 767px){
    .task{
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    .task dt{
        width: 100%;
    }
    .task dd{
        width: 100%;
    }
    .tit-method{
        font-size: 24px;
    }
}




.indent-1 {
    padding-left:1em;
    text-indent:-1em;
}
/*flex*/
.d-flex{
    display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}

.align-items-center{ align-items: center;}
.justify-content-center{ justify-content: center;}

.mb0-xs5{margin-bottom: 0;}
@media (max-width: 767px){
    .mb0-xs5{margin-bottom: 5px;}
}


/* aws */
#aws01 {
    background: url(../images/bg-aws01.jpg) no-repeat center / cover;
    padding: 60px 0;
}
@media screen and (max-width:991px) {
    #aws01 {
        background: #efefef;
    }
}

/* aws-internalization */
#aws-internalization01 {
    background: url(../images/bg-aws-internalization01.jpg) no-repeat center / cover;
    padding: 100px 0;
}
@media screen and (max-width:991px) {
    #aws-internalization01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* cloud-assessment01 */
#cloud-assessment01 {
    background: url(../images/bg-cloud-assessment01.jpg) no-repeat center / cover;
    padding: 100px 0;
}
@media screen and (max-width:991px) {
    #cloud-assessment01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* ccoe-support01 */
#ccoe-support01 {
    background: url(../images/bg-ccoe-support01.jpg) no-repeat center / cover;
    padding: 100px 0;
}
@media screen and (max-width:991px) {
    #ccoe-support01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* devops-support01 */
#devops-support01 {
    background: url(../images/bg-devops-support01.jpg) no-repeat center / cover;
    padding: 100px 0;
}
@media screen and (max-width:991px) {
    #devops-support01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* data-utilization01 */
#data-utilization01 {
    background: url(../images/bg-data-utilization01.jpg) no-repeat center / cover;
    padding: 100px 0;
}
@media screen and (max-width:991px) {
    #data-utilization01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* jscutt */
#jscutt01 {
    background: url(../images/bg-jscutt01.jpg) no-repeat center / cover;
    padding: 120px 0;
}
@media screen and (max-width:991px) {
    #jscutt01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* anti-ransomware */
#anti-ransomware01 {
    background: url(../images/bg-anti-ransomware.jpg) no-repeat center / cover;
    padding: 120px 0;
}
@media screen and (max-width:991px) {
    #anti-ransomware01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* ns-solution01 */
#ns-solution01 {
    background: url(../images/bg-ns-solution01.jpg) no-repeat center / cover;
    padding: 120px 0;
}
@media screen and (max-width:991px) {
    #ns-solution01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* ns-solutionk02 */
#ns-solution02 {
    background: url(../images/bg-ns-solution02.jpg) no-repeat top center,
                #374d98;
    padding: 120px 0;
}
#ns-solution02 h3{
    color: #fff;
}
#ns-solution02 h3::after{
    background: #fff;
}
@media screen and (max-width:991px) {
    #ns-solution02 {
        padding: 60px 0;
    }
}

/* resource-optimization */
#resource01 {
    background: url(../images/bg-resource01.jpg) no-repeat center / cover;
    padding: 60px 0;
}
@media screen and (max-width:991px) {
    #resource01 {
        background: #efefef;
    }
}

.resource01-title{
    font-size: 36px;
    line-height: 1.4;
}
@media screen and (max-width:767px) {

    .resource01-title{
        font-size: 24px;
    }
}

.resource02-item img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resource03-solution {
    display: grid;
    grid-template-columns: 40% 1fr;
}
.resource03-solution dt{
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 15px;
    align-items: center;
    padding: 20px;
    background: linear-gradient( 0deg, rgb(26,44,106) 0%, rgb(55,77,152) 100%);
    font-size: 20px;
    font-weight: normal;
    color: #fff;
}
.resource03-solution dt .icon{
    width: 80px;
    height: 80px;
    padding: 20px;
    border: 1px solid #fff;
    border-radius: 50%;
}
.resource03-solution dt .icon img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.resource03-solution dd{
    display: flex;
    align-items: center;
    padding: 20px;
    background: #efefef;
}


@media (max-width: 991px) {
    .resource03-solution {
        display: block;
    }
    .resource03-solution dt{
        font-size: 18px;
    }
    .resource03-solution dt .icon{
        width: 60px;
        height: 60px;
        padding: 15px;
    }
}


.anti-ransomware-atack-example{
    position: relative;
    padding: 10px 10px 10px 40px;
    background: #fff;
    box-sizing: border-box;
    list-style: none;
    color: #000;
}
.anti-ransomware-atack-example::before{
    position: absolute;
    top: 10px;
    left: 10px;
    content: "\f06a";
    font-family: "FontAwesome";
    font-weight: bold;
    font-size: 24px;
    color: #cc0000;
    line-height: 1;
}
.anti-ransomware-atack-example .title{
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
}

.anti-ransomware-feature-box{
    display: flex;
    padding: 30px;
    margin-bottom: 30px;
    background: #fff;
    border: 1px solid #ccc;
}
.anti-ransomware-feature-box .icon{
    flex-shrink: 0;
    width: 80px;
    margin-right: 30px;
}
.anti-ransomware-feature-box .detail{
    width: 100%;
}
@media screen and (max-width:575px) {
    .anti-ransomware-feature-box{
        padding: 30px 15px;
    }
    .anti-ransomware-feature-box .icon{
        width: 60px;
        margin-right: 15px;
    }
}
@media screen and (max-width:430px) {
    .anti-ransomware-feature-box{
        display: block;
    }
    .anti-ransomware-feature-box .icon{
        width: 100px;
        margin: 0 auto 15px;
    }
}

.anti-rasomware-introduction-problem{
    display: flex;
    align-items: flex-start;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px dashed #ccc;
    font-size: 18px;
    line-height: 1.8;
}
.anti-rasomware-introduction-problem dt{
    flex-shrink: 0;
    width: 80px;
    padding: 0 10px;
    margin-right: 15px;
    background: #1a2c6a;
    color: #fff;
    text-align: center;
    line-height: 1.6;
}
.anti-rasomware-introduction-problem dd{
    width: 100%;
    line-height: 1.6;
}
@media screen and (max-width:767px) {
    .anti-rasomware-introduction-problem{
        display: block;
        font-size: 16px;
        line-height: 1.8;
    }
    .anti-rasomware-introduction-problem dt{
        margin-right: initial;
        margin-bottom: 10px;
    }
}

.anti-rasomware-introduction-solution{
    display: flex;
    align-items: flex-start;
    font-size: 18px;
    
}
.anti-rasomware-introduction-solution dt{
    flex-shrink: 0;
    width: 80px;
    padding: 0 10px;
    margin-right: 15px;
    background: #f60;
    color: #fff;
    text-align: center;
    line-height: 1.6;
}
.anti-rasomware-introduction-solution dd{
    width: 100%;
    line-height: 1.6;
}
@media screen and (max-width:767px) {
    .anti-rasomware-introduction-solution{
        display: block;
        font-size: 16px;
        line-height: 1.8;
    }
    .anti-rasomware-introduction-solution dt{
        margin-right: initial;
        margin-bottom: 10px;
    }
}

/* ot_security */
#ot_security01 {
    background: url(../images/bg-ot_security.jpg) no-repeat center / cover;
    padding: 120px 0;
}
@media screen and (max-width:991px) {
    #ot_security01 {
        background: #efefef;
        padding: 60px 0;
    }
}

/* sspm01 */
#sspm01 {
    background: url(../images/bg-sspm01.jpg) no-repeat top center / contain,
                #374d98;
    padding: 120px 0;
}
#sspm01 h3{
    color: #fff;
}
#sspm01 h3::after{
    background: #fff;
}
@media screen and (max-width:991px) {
    #sspm01 {
        padding: 60px 0;
        background: #374d98;
    }
}

#log-contents {
    background: #68749d;
    position: relative;
    color: #fff;
}

#log-contents h3 {
    color: #fff;
}

#log-contents h3::after{
    content: "";
    width: 210px;
    height: 3px;
    left: 50%;
    margin-left: -105px;
    background: #ffffff;
    bottom: 0;
    position: absolute;
    bottom: -44px;
}

.log-box {
    border: 1px solid #fff;
    display: inline-block;
    padding: 20px 20px;
}

.list-jscutt-feature{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 -30px -30px;
    list-style: none;
}
.list-jscutt-feature li{
    width: 30%;
    padding: 0 30px;
    margin-bottom: 30px;
}
.list-jscutt-feature li figure{
    margin-bottom: 15px;
}
.ttl-jscutt-feature{
    margin-bottom: 0.5em;
    font-size: 22px;
    font-weight: bold;
    color: #1a2c6a;
    text-align: center;
}
@media screen and (max-width:991px){
    .list-jscutt-feature li{
        width: 33.333333%;
    }
    .ttl-jscutt-feature{
        font-size: 18px;
    } 
}
@media screen and (max-width:991px){
    .list-jscutt-feature{
        margin: 0 0 -30px;
    }
    .list-jscutt-feature li{
        width: 100%;
        max-width: 350px;
        padding: 0;
        margin: 0 auto 30px;
    }
}

#contact_link_pc{
    position:fixed;
	top:50%;
	right:0;
    transform: translateY(-100%);
	z-index:1000;
}
#contact_link_pc a{
    display: block;
    writing-mode: vertical-rl;
    color: #fff;
    background: linear-gradient(#ff8c00, #ec6b03);
    padding: 1em 0.8em;
    letter-spacing: .1em;
    font-weight: bold;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    box-shadow: rgb(50 50 93 / 25%) 0px 13px 27px -5px, rgb(0 0 0 / 30%) 0px 8px 16px -8px;
    transition:0.2s;
}
#contact_link_pc a::before{
    font-family: "FontAwesome";
    content: '\f0e0';
    font-weight: 900;
    margin-bottom: 5px;
}
#contact_link_pc:hover a{
    padding: 1em 1em;
    filter: brightness(1.2);
}
@media screen and (max-width:991px){
    /* #contact_link_pc a{
        padding: 2em .9em 2em 1em;
    } */
}
@media screen and (max-width:767px){
    #contact_link_pc{
        position:fixed;
        top: auto;
        bottom:0;
        left: 0;
        transform: initial;
        z-index:1000;
        width: 50%;
    }
    #contact_link_pc:hover{
        transform: translateY(0);
    }
    #contact_link_pc a{
        writing-mode: initial;
        text-align: center;
        padding: 1em;
        font-size: .9em;
        letter-spacing: 0;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 0;
    }
    #contact_link_pc a::before{
        margin-bottom: 0;
        margin-right: 10px;
    }
}

#document_link_pc{
    position:fixed;
	top:50%;
	right:0;
	z-index:1000;
}
#document_link_pc a{
    display: block;
    writing-mode: vertical-rl;
    color: #fff;
    background: linear-gradient(90deg, #0e2e74 0%, #6286d5 100%); 
    /* padding: 2em 1.5em; */
    padding: 1em 0.8em;
    letter-spacing: .1em;
    font-weight: bold;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    box-shadow: rgb(50 50 93 / 25%) 0px 13px 27px -5px, rgb(0 0 0 / 30%) 0px 8px 16px -8px;
    transition: .2s;
}
#document_link_pc a::before{
    font-family: "FontAwesome";
    content: '\f15c';
    font-weight: 900;
    margin-bottom: 5px;
}
#document_link_pc:hover a{
    padding: 1em 1em;
    filter: brightness(1.2);
}
@media screen and (max-width:991px){
    /* #document_link_pc a{
        padding: 2em .9em 2em 1em;
    } */
}
@media screen and (max-width:767px){
    #document_link_pc{
        position:fixed;
        top: auto;
        bottom:0;
        z-index:1000;
        width: 50%;
    }
    #document_link_pc:hover{
        transform: translateY(0);
    }
    #document_link_pc a{
        writing-mode: initial;
        text-align: center;
        padding: 1em;
        font-size: .9em;
        letter-spacing: 0;
        border-top-right-radius: 15px;
        border-bottom-left-radius: 0;
    }
    #document_link_pc a::before{
        margin-bottom: 0;
        margin-right: 10px;
    }
}


/* datacenter
----------------------------------------------------------*/
.datacenter_bg1{
    padding: 60px 0;
    background: url(../images/datacenter_bg1.jpg) no-repeat top center / cover;
}
@media screen and (min-width:768px){
    .datacenter_bg1{
        padding: 120px 0;
    }
}

.datacenter_bg2{
    padding: 60px 0 30px;
    background: #efefef;
}
@media screen and (min-width:768px){
    .datacenter_bg2{
        padding: 120px 0;
    }
}

.datacenter_bg3{
    padding: 30px 0 60px;
    background: url(../images/datacenter_bg3.jpg) no-repeat top center,
                #edeff7;
}

@media screen and (min-width:768px){
    .datacenter_bg3{
        padding: 120px 0;
    }
}

.datacenter_bg4{
    padding: 0 0 80px;
    background: url(../images/datacenter_bg4.jpg) no-repeat top center,
                #efefef;
}
@media screen and (min-width:768px){
    .datacenter_bg4{
        padding: 120px 0;
    }
}

.datacenter_bg5{
    padding: 80px 0;
    background: url(../images/datacenter_bg5.jpg) no-repeat top center,
                #68749d;
}
.datacenter_bg5 .container h3{
    color: #fff;
}
.datacenter_bg5 .container h3::after{
    background: #fff;
}
@media screen and (min-width:768px){
    .datacenter_bg5{
        padding: 120px 0;
    }
}

.datacenter-midashi1 {
    margin-bottom: 30px;
    font-size: 130%;
    font-weight: bold;
    color: #fff;
    text-align: center !important;
}

@media (min-width: 768px) {
    .datacenter-midashi1 {
        font-size: 160%;
        text-align: left !important;
    }
}

.datacenter-midashi2 {
    margin-bottom: 30px;
    font-size: 20px;
    text-align: center !important;
}
@media (min-width: 768px) {
    .datacenter-midashi2 {
        font-size: 24px;
    }
}
@media (min-width: 992px) {
    .datacenter-midashi2 {
        margin-bottom: 50px;
        font-size: 30px;
        text-align: left !important;
    }
}
@media (min-width: 1200px) {
    .datacenter-midashi2 {
        font-size: 36px;
    }
}

.datacenter-access-station{
    max-width: 600px;
    padding: 15px;
    background: #fff;
    border: 2px solid #374d98;
    border-radius: 3px;
    font-size: 16px;
    font-weight: bold;
}
.datacenter-access-station i{
    font-size: 18px;
    margin-right: 5px;
    color: #374d98;
}
@media (min-width: 768px) {
    .datacenter-access-station{
        font-size: 18px;
    }
    .datacenter-access-station i{
        font-size: 24px;
    }
}

.datacenter-contact{
    display: block;
    background: url(../images/datacenter_contact.png) no-repeat right top #efefef;
    padding: 60px 10px;
    text-align: center;
    width: 100%;
    font-size: 26px;
    font-weight: bold;
}


.illumio-list{
    display: flex;
}
.illumio-list > figure{
    flex-shrink: 0;
    margin-right: 15px;
}
.illumio-list > ul{
    width: 100%;
    margin-bottom: 30px;
    list-style: none;
}
.illumio-list > ul > li{
    position: relative;
    padding-left: 1.5em;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #374d98;
    font-size: 20px;
    font-weight: bold;
    color: #374d98;
}
.illumio-list > ul > li::before{
    position: absolute;
    top: 0;
    left: 0;
    content: "▶";
}
@media screen and (max-width:991px){
    .illumio-list > ul > li{
        font-size: 16px;
    } 
    .illumio-list > figure{
        width: 50px;
    }
}
@media screen and (max-width:767px){
    .illumio-list > figure{
        width: 30px;
    }
}

/*---------------*/
.ransomware-rank-table {
    width: 100%;
    margin-bottom: 10px;
    border-collapse: collapse;
}
.ransomware-rank-table th,
.ransomware-rank-table td {
    padding: 10px;
    border-bottom: 1px dashed #ccc;
}
.ransomware-rank-table th {
    width: 60px;
}
.ransomware-rank-table .first th,
.ransomware-rank-table .first td {
    font-size: 1.2em;
    font-weight: bold;
    color: #cc0000;
}


/*---------------*/
.sspm-area01-content{
    display: flex;
    align-items: center;
    column-gap: 60px;
    padding: 30px;
    background: #fff;
}
.sspm-area01-content:last-of-type{
    margin-bottom: 0;
}
.sspm-area01-content .image{
    flex-shrink: 0;
    width: 180px;
}
.sspm-area01-content .text{
    width: 100%;
    font-size: 18px;
    line-height: 2;
}
@media screen and (max-width:1199px){
    .sspm-area01-content{
        column-gap: 30px;
    }
    .sspm-area01-content .image{
        width: 130px;
    }
    .sspm-area01-content .text{
        font-size: 16px;
        line-height: 1.8;
    }
}
@media screen and (max-width:991px){
    .sspm-area01-content{
        align-items: center;
        padding: 15px;
    }
}
@media screen and (max-width:575px){
    .sspm-area01-content{
        flex-direction: column;
        row-gap: 15px;
        padding: 30px 15px;
    }
    .sspm-area01-content .text{
        font-size: 14px;
    }
}

.sspm-check-text{
    padding-left: 26px;
    margin-bottom: 15px;
}
.sspm-check-text:last-of-type{
    margin-bottom: 0;
}
@media screen and (max-width:767px){
    .sspm-check-text{
        padding-left: initial;
        margin-bottom: 20px;
        font-size: 14px;
    }
}

.sspm-feature-flex{
    display: flex;
    column-gap: 30px;
}
.sspm-feature-flex .detail{
    width: 100%;
}
.sspm-feature-flex .image{
    flex-shrink: 0;
    max-width: 350px;
}
@media screen and (max-width:767px){
    .sspm-feature-flex{
        flex-direction: column;
        row-gap: 15px;
    }
    .sspm-feature-flex .image{
        max-width: initial;
    }
}


/* 20230427_automotive-industry
----------------------------------------------------------*/
#automotive-industry01 {
    background: url(../images/bg-automotive-industry.jpg) no-repeat center / cover;
    padding: 120px 0 80px 0;
}

#automotive-industry02 {
    background: url(../images/bg-anti-ransomware02.jpg) no-repeat center / cover;
    padding: 120px 0 80px 0;
    color: #fff;
}

#automotive-industry03 {
    background-color: #efefef;
    width: 100%; 
    margin: 0 auto;
    padding-bottom: 6%;
}


@media screen and (max-width:991px) {
    #automotive-industry01 {
        background: #efefef;
        padding: 60px 0;
    }
}

@media screen and (max-width:991px) {
    #automotive-industry01 {
        padding: 60px 0;
    }
}

    #automotive-industry01 .container ,  #automotive-industry02 .container {
        margin: -2.8% auto 0;
    }

    #automotive-industry01 .container h3 , #automotive-industry02 .container h3 {
        text-align: center;
        position: relative;
        font-size: 36px;
        width: 100%;
        margin: 0 auto 128px;
    }

    #automotive-industry03 h3:after , #automotive-industry04 h3:after , #automotive-industry05 h3:after{
        content: "";
        width: 210px;
        height: 3px;
        left: 50%;
        margin-left: -105px;
        background: #1a2c6a;
        bottom: 0;
        position: absolute;
        bottom: -44px;
    }

    #automotive-industry02 h3 , #automotive-industry04 h3 , #automotive-industry04 {
        color: #fff;
    }

    #automotive-industry02 h3:after , #automotive-industry04 h3:after{
        background-color: #fff;
    }

    #automotive-industry01 .container p , #automotive-industry02 .container p {
        margin-bottom: 6%;
    }
    
    .flex-onayami{
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 74%;
        margin: 0 auto;
    }

    .f-image{
        width: 43%;
    }

    .f-point{
        width: 52%;
    }

    #automotive-industry03 h3 , #automotive-industry04 h3 , #automotive-industry05 h3{
        text-align: center;
        position: relative;
        margin-bottom: 6%;
    }
    
    .f-point p {
        font-size: 18.6px;
        font-weight: 800;
        width: 100%;
        color: #fff;
        background-color: #304179;
        border-radius: 10px;
        padding: 2% 0;
        text-align: center;
        letter-spacing: 0.12rem;
    }

    .answer{
        width: 74%;
        background-color: #ec6b03;
        color: #fff;
        font-size: 22px;
        font-weight: 800;
        border-radius: 10px;
        padding: 2.4% 8%;
        text-align: center;
        letter-spacing: 0.12rem;
        margin: 0 auto 4%;
    }

    #automotive-industry04{
        background-color: #374d98;
    }

    #automotive-industry05 p , #automotive-industry04 p{
        width: 100%;
        margin: 0 auto 2.6%;
        text-align: center;
        font-size: 22px;
        font-weight: 600;
    } 
    
    .a-source{
        font-size: 18px;
        font-weight: 600;
    }

    .pic{
        width: 100% !important;
        margin: 0 auto !important;
        text-align: center !important;
    }

    .pic img{
        width: 74%;
    }

@media screen and (max-width:1720px) {
    .f-point {
        width: 62%;
    }

    .f-image {
        width: 38%;
    }
}

@media screen and (max-width:1470px) {
    .f-point p {
        font-size: 16px;
    }

    .flex-onayami {
        margin: 0 auto 2.2%;
    }

    .answer {
        font-size: 18px;
    }
} 

@media screen and (max-width:1280px) {
    .flex-onayami {
        display: block;
    }

    .f-point {
        width: 100%;
        margin: -8% auto 0;
    }

    .f-image {
        width: 70%;
        margin: 0 auto;
    }

    #automotive-industry04 h3{
        width: 66%;
        margin: 0 auto 10%;
        font-size: 36px;
    }
    
    #automotive-industry04 p , #automotive-industry05 p {
        width: 86%;
        margin: 0 auto 3.4%;
        font-size: 20px;
    }

    .f-point p {
        font-size: 18px;
    }

    .answer {
        font-size: 20px;
    }

    #automotive-industry05 h3{
        margin: 0 auto 10%;
        font-size: 36px;
    }

    .pic {
        width: 100% !important;
        text-align: center !important;
    }

    .a-source{
        font-size: 16px !important;
    } 
}    

@media screen and (max-width:890px) {
    .f-point p {
        font-size: 16px;
    }
    
    .answer {
        font-size: 18px;
    }

    #automotive-industry04 p, #automotive-industry05 p {
        font-size: 16px;
    }

    .flex-onayami {
        width: 94%;
    }
    
    .answer {
        width: 93%;
    }
    
    .f-image {
        width: 100%;
    }    
}

@media screen and (max-width:680px) {
#automotive-industry01 .container h3 , #automotive-industry02 .container h3 , #automotive-industry04 h3 , #automotive-industry03 h3 , #automotive-industry05 h3{
        font-size:28px;
    }

    #automotive-industry04 h3 {
        width: 90%;
    }
    
    #automotive-industry01 .container h3, #automotive-industry02 .container h3 {
        margin: 0 auto 4%;
    }
    
    .pic img {
        width: 90%;
    }
}    

@media screen and (max-width:660px) {
    .f-point p {
        font-size: 14px;
        padding: 2%; 
    }

    .answer {
        font-size: 16px;
    }
}

/* 20240722追加
----------------------------------------------------------*/
.kadai-card{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 20px;
    height: 100%;
    padding: 30px;
    background: #fff;
    z-index: 1;
}
.kadai-card .image{
    width: 120px;
    height: 120px;
}
.kadai-card .image img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.kadai-card .num{
    position: absolute;
    top: -1em;
    left: 50%;
    transform: translateX(-50%);
    padding: .5em 1.5em;
    background: #d8a034;
    border-radius: 2em;
    font-size: 16px;
    font-weight: bold;
    line-height: 1;
    z-index: 1;
}
.kadai-card .text{
    color: #000;
    line-height: 1.5;
}
@media screen and (max-width:767px) {
    .kadai-card{
        flex-direction: row;
        column-gap: 15px;
        padding: 15px;
    }
    .kadai-card .image{
        flex-shrink: 0;
        width: 70px;
        height: 70px;
    }
    .kadai-card .body{
        display: flex;
        flex-direction: column;
        flex: 1;
    }
    .kadai-card .num{
        position: static;
        transform: initial;
        width: fit-content;
        margin-bottom: 5px;
        font-size: 12px;
    }
    .kadai-card .text{
        font-size: 14px;
    }
}

.data-utilization-support-card{
    height: 100%;
    padding: 30px;
    background: #fff;
    color: #000;
}
.data-utilization-support-card .title{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 240px;
    aspect-ratio: 100 / 86.602;
    padding: 20px;
    margin: 0 auto 30px;
    background: url(../images/data-utilization-support-card01.png) no-repeat center / cover;
    font-size: 24px;
    font-weight: bold;
    color: #fff !important;
    text-align: center;
}
.data-utilization-support-card.green .title{
    background: url(../images/data-utilization-support-card02.png) no-repeat center / cover;
}
.data-utilization-support-card.orange .title{
    background: url(../images/data-utilization-support-card03.png) no-repeat center / cover;
}
.data-utilization-support-card .subtitle{
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #004a8e;
    font-size: 20px;
    color: #004a8e;
    text-align: center;
}
.data-utilization-support-card.green .subtitle{
    color: #008272;
    border-color: #008272;
}
.data-utilization-support-card.orange .subtitle{
    color: #ec6b03;
    border-color: #ec6b03;
}
.data-utilization-support-card .text{
    margin-bottom: 20px;
    color: #000 !important;
}
.data-utilization-support-card .text:last-of-type{
    margin-bottom: 0;
}
@media screen and (max-width:767px) {
    .data-utilization-support-card{
        padding: 30px 20px 20px;
    }
    .data-utilization-support-card .title{
        width: 180px;
        margin-bottom: 20px;
        font-size: 18px;
    }
    .data-utilization-support-card .subtitle{
        padding-bottom: 8px;
        margin-bottom: 8px;
        font-size: 16px;
    }
    .data-utilization-support-card .text{
        margin-bottom: 16px;
        font-size: 14px;
    }
}

.data-utilization-merit{
    padding: 0;
    list-style: none;
    line-height: 1.7;
}
.data-utilization-merit > li{
    position: relative;
    padding: 20px 20px 20px 80px;
    margin-bottom: 20px;
    background: #fff2ce;
	counter-increment: cnt;
    font-size: 18px;
    font-weight: bold;
}
.data-utilization-merit > li:last-of-type{
    margin-bottom: 0;
}
.data-utilization-merit > li::before{
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    aspect-ratio: 1 / 1;
    background: #f60;
    border-radius: 50%;
    content: counter(cnt);
    color: #fff;
}
@media screen and (max-width:767px) {
    .data-utilization-merit > li{
        padding: 20px 16px;
        font-size: 16px;
        font-weight: bold;
    }
    .data-utilization-merit > li::before{
        position: relative;
        top: 0;
        left: 0;
        transform: initial;
        width: 40px;
        margin: 0 auto 16px;
    }
}

.j-aizen-logo{
    padding: 20px;
    background: #c70a0a;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1;
}
.j-aizen-logo .text{
    display: block;
    font-size: 24px;
}
@media screen and (max-width:767px) {
    .j-aizen-logo .text{
        font-size: 16px;
    }
}

.j-aizen-function{
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(3,auto);
    grid-template-columns: repeat(2,1fr);
    gap: 30px;
}
@media screen and (max-width:991px) {
    .j-aizen-function{
        grid-auto-flow: row;
        grid-template-rows: initial;
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

.j-aizen-function-box{
    padding: 30px 20px;
    background: #fff;
}
.j-aizen-function-box .head{
    display: flex;
    align-items: center;
    column-gap: 16px;
    margin-bottom: 16px;
}
.j-aizen-function-box .icon{
    flex-shrink: 0;
    width: 60px;
}
.j-aizen-function-box .title{
    flex: 1;
    font-size: 24px;
    font-weight: bold;
    color: #c70a0a;
    line-height: 1.5;
}
.j-aizen-function-box .title.blue{
    color: #0a125a !important;
}
.j-aizen-function-box .list{
    list-style: none;
    margin: 0;
}
.j-aizen-function-box .list > li{
    position: relative;
    padding-left: 1em;
    margin-bottom: .5em;
    font-size: 14px;
    line-height: 1.5;
}
.j-aizen-function-box .list > li:last-of-type{
    margin-bottom: 0;
}
.j-aizen-function-box .list > li::before{
    position: absolute;
    top: 0;
    left: 0;
    content: "・";
}
@media screen and (max-width:575px) {
    .j-aizen-function-box .head{
        column-gap: 12px;
    }
    .j-aizen-function-box .icon{
        width: 36px;
    }
    .j-aizen-function-box .title{
        font-size: 18px;
    }
}

.j-aizen-step-box{
    height: 100%;
    padding: 20px 16px;
    background: #efefef;
}

.j-aizen-step{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 1em;
    margin-bottom: 16px;
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    line-height: 1;
    z-index: 1;
}
.j-aizen-step::before{
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 15px);
    height: 100%;
    background: #0a125a;
    content: "";
    z-index: -1;
}
.j-aizen-step::after{
    position: absolute;
    top: 0;
    right: -5px;
    width: 20px;
    height: 100%;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #0a125a;

    content: "";
    z-index: -1;
}
.j-aizen-step .icon{
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 30px;
    aspect-ratio: 1 / 1;
    z-index: 1;
}
.j-aizen-step .icon img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}


.j-aizen-step-list{
    list-style: none;
    margin: 0 0 20px;
}
.j-aizen-step-list > li{
    position: relative;
    padding-left: 1em;
    margin-bottom: .5em;
    font-size: 14px;
    line-height: 1.5;
}
.j-aizen-step-list > li:last-of-type{
    margin-bottom: 0;
}
.j-aizen-step-list > li::before{
    position: absolute;
    top: 0;
    left: 0;
    content: "・";
}


.j-aizen-step-item{
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0;
}
.j-aizen-step-item > li{
    padding: 0.5em;
    background: #c70a0a;
    border-radius: 2px;
    font-size: 12px;
    color: #fff;
    line-height: 1;
}
.j-aizen-step-item.other > li{
    background: #5d2915;
}
.j-aizen-step-item.option > li{
    background: #1a2c6a;
}


.j-aizen-plan-list{
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 5px;
    list-style: none;
    margin: 0;
}
.j-aizen-plan-list > li{
    padding: 0.5em 1em;
    background: #fff;
    border: 1px solid #c70a0a;
    border-radius: 3px;
    font-size: 14px;
    font-weight: bold;
    color: #c70a0a;
    text-align: center;
    line-height: 1;
}
.j-aizen-plan-list > li.other{
    border-color: #5d2915;
    color: #5d2915;
}
.j-aizen-plan-list > li.option{
    border-color: #1a2c6a;
    color: #1a2c6a;
}