@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Lato|Noto+Sans+JP:400,700,900|Yantramanav:900&display=swap&subset=japanese');

body {
  margin: 0px;
  padding: 0px;
  background: #2f3233;
  color: #333;
  font: 14px/1.75 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  -webkit-text-size-adjust: 100%;
}

.en {
  font-family: 'Roboto';
  font-size: 120%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
  font-size: 100%;
  font-weight: normal;
  line-height: 1.66;
}

p {
  margin: 0;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

ol {
  margin: 0;
  padding: 0 0 0 16px;
}

dl,
dt,
dd {
  margin: 0px;
  padding: 0px;
}

a {
  opacity: 1;
  color: #28b9b9;
  text-decoration: none;
  transition: all 0.4s ease;
}

a:hover {
  opacity: 0.6;
}

a img {
  border: none;
}

img {
  width: auto\9;
  height: auto;
  max-width: 100%;
  border: 0;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic;
}

input,
button,
textarea {
  margin: 0;
  padding: 0;
  border-radius: 0;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="submit"],
button,
textarea {
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
}

.clearfix {
  zoom: 1;
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

#wrap {
  padding-top: 80px;
  background: #fff;
}

.layout {
  position: relative;
  max-width: 960px;
  margin: 0 auto;
}

.layout.min {
  max-width: 780px;
}

.layout.large {
  max-width: 1200px;
}

.cl01 {
  color: #28b9b9;
}

.cl02 {
  color: #007780;
}

.cl03 {
  color: #ff7300;
}

.cl04 {
  color: #00aeff;
}

.cl05 {
  color: #7fd6ff;
}

.cl06 {
  color: #333;
}

.cl07 {
  color: #007f92;
}

.cl08 {
  color: #26b7b7;
}

.cl09 {
  color: #f89a1b
}

.bt {
  display: block;
  border-radius: 3px;
  background: #33bdbd;
  background: linear-gradient(#33bdbd, #26b6b6);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
  color: #fff;
  text-align: center;
}

.txtCenter {
  text-align: center;
}

.txtRight {
  text-align: right;
}

.contentSP {
  display: none;
}

.fB {
  font-size: 18px;
}

.f24 {
  font-size: 24px
}

.-blank::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  background: url(/img/case_detail_ico_01.png);
  background-size: cover;
  vertical-align: middle;
}

@media only screen and (max-width: 1365px) {
  #wrap {
    padding-top: 58px;
  }
}

@media only screen and (max-width: 1023px) {
  .layout {
    padding: 0 24px;
  }
}

@media only screen and (max-width: 767px) {
  .layout {
    padding: 0 16px;
  }

  .contentPC {
    display: none;
  }

  .contentSP {
    display: block;
  }
}


/* ------------------------ header */
header {
  position: relative;
  z-index: 9000;
  top: 0;
  left: 0;
  width: 100%;
}

#header {
  position: fixed;
  z-index: 9000;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 1);
  transition: all 0.4s ease;
  display: flex;
  align-items: center;
  padding: 0 24px;
}

header .logo {
  position: relative;
  padding-top: 14px;
  margin-right: 28px;
}

header .logo .img {
  width: 246px;
}

header .logo .note {
  position: absolute;
  top: 0;
  right: 0;
  font-size: 10px;
  letter-spacing: 0.02em;
  line-height: 1;
  transform: translateY(4px);
}

header .logo .note .en {
  font-size: 11px;
  font-weight: 600;
}

header .header_nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex: 1;
}

header .header_nav.pc {
  display: flex !important;
}

header .header_nav ul {
  display: flex;
  font-weight: 600;
  align-items: baseline;
}

header .header_nav .nav_menu li a {
  color: #333;
}

header .header_nav .nav_menu li a:hover {
  color: #28b9b9;
  opacity: 1;
}

header .header_nav .nav_menu li {
  margin-right: 12px;
  white-space: nowrap;
}

header .header_nav .has_sub_menu {
  display: flex;
  align-items: center;
}

header .header_nav .has_sub_menu .arrow {
  display: inline-block;
  position: relative;
  top: -2px;
  width: 5px;
  height: 5px;
  margin-left: 7px;
  border-right: 2px solid #30bbbb;
  border-bottom: 2px solid #30bbbb;
  transform: rotate(45deg);
}

header .header_nav .contact {
  align-items: center;
}

header .header_nav .contact li {
  margin-right: 12px;
}

header .header_nav .contact li:last-child {
  margin-right: 0;
}

header .header_nav .contact li a {
  display: flex;
  width: 104px;
  height: 40px;
  justify-content: center;
  align-items: center;
  color: #fe7a0c;
  font-size: 13px;
  border: 2px solid #fe7a0c;
  border-radius: 20px;
  box-sizing: border-box;
}

header .header_nav .contact li a:hover {
  color: #fff;
  background: #fe7a0c;
  opacity: 1;
}

header .header_nav .contact li:last-of-type a {
  color: #fff;
  background: #fe7a0c;
}

header .header_nav .contact li:last-of-type a:hover {
  color: #fe7a0c;
  background: #fff;
}

header .header_nav .contact .tel .en {
  font-size: 15px;
}

header .header_nav .contact .tel .material-icons {
  font-size: 16px;
  color: #28b9b9;
  transform: translateY(2px);
  -webkit-transform: translateY(2px);
  margin-right: 4px;
}

header .service_nav {
  display: none;
  position: fixed;
  top: 80px;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 1);
  padding: 32px 0 72px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

header .header_nav .service_nav ul {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: auto 1fr 1fr 1fr;
  grid-template-rows: 144px 84px 84px 84px;
  align-items: center;
  gap: 18px;
}

header .header_nav .service_nav ul li {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.3;
  font-size: 16px;
  transition: all 0.4s ease;
  margin: 0;
  border-radius: 3px;
}

header .header_nav .service_nav ul li:hover {
  opacity: 0.6;
}

header .header_nav .service_nav ul li a {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  color: #fff;
  border: none;
  padding: 8px 36px;
}

header .header_nav .service_nav ul li a:hover {
  color: #fff;
  opacity: 0.6;
}

header .header_nav .service_nav ul li a .ico {
  flex-shrink: 0;
}

header .header_nav .service_nav ul li .en {
  font-size: 100%;
}

header .header_nav .service_nav ul li:first-of-type {
  grid-column: 1/2;
  grid-row: 1/3;
  background: url(/img/service_nav_bg_01.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  font-size: 20px;
}

header .header_nav .service_nav ul li:first-of-type a {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

header .header_nav .service_nav ul li:first-of-type a .txt {
  text-align: center;
}

header .header_nav .service_nav ul li:first-of-type .min {
  font-size: 14px;
  margin-top: 8px;
}

header .header_nav .service_nav ul li:nth-of-type(2) {
  background: url(/img/service_nav_bg_02.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(3) {
  background: url(/img/service_nav_bg_03.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(4) {
  background: url(/img/service_nav_bg_04.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* header .header_nav .service_nav ul li:nth-of-type(5){
	background: url(/img/service_nav_bg_05.png);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
} */
header .header_nav .service_nav ul li:nth-of-type(5) {
  background: url(/img/service_nav_bg_06.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(6) {
  background: url(/img/service_nav_bg_07.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(7) {
  background: url(/img/service_nav_bg_14.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(8) {
  background: url(/img/service_nav_bg_08.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(9) {
  background: url(/img/service_nav_bg_09.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(10) {
  background: url(/img/service_nav_bg_10.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(11) {
  background: url(/img/service_nav_bg_15.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(12) {
  background: url(/img/service_nav_bg_11.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(13) {
  background: url(/img/service_nav_bg_12.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .header_nav .service_nav ul li:nth-of-type(14) {
  background: url(/img/service_nav_bg_13.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

header .btNav {
  display: none;
}

header .header_nav .js_service_btNav {
  cursor: pointer;
  transition: 0.4s ease;
}

header .header_nav .js_service_btNav.on {
  color: #28b9b9;
}

header .header_nav .js_service_btNav:hover {
  color: #28b9b9;
  opacity: 1;
}

header .case_nav {
  display: none;
  position: fixed;
  top: 80px;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 1);
  padding: 32px 0 60px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

header .header_nav .case_nav ul {
  max-width: 1080px;
  margin: 0 auto;
  display: flex;
}

header .header_nav .case_nav ul li {
  width: calc((100% - 60px)/4);
}

header .header_nav .case_nav ul li a {
  display: block;
}

header .header_nav .case_nav ul li a:hover {
  opacity: 0.6;
  color: #333;
}

header .header_nav .case_nav ul li .img {
  padding-top: 59.21%;
  background-position: top center;
  background-size: cover;
  margin: 0;
}

header .header_nav .case_nav ul li .img img {
  display: none;
}

header .header_nav .case_nav ul li .txt {
  position: relative;
  padding: 0px 10px 10px;
}

header .header_nav .case_nav ul li .txt .h {
  display: inline-block;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  background: #32bcbc;
  padding: 4px 8px;
  color: #fff;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  font-weight: 600;
}

header .header_nav .case_nav ul li .txt .h.cat_1 {
  background: #9D6DC4;
}

header .header_nav .case_nav ul li .txt .h.cat_2 {
  background: #ff6666;
}

header .header_nav .case_nav ul li .txt .h.cat_3 {
  background: #26b7b7;
}

header .header_nav .case_nav ul li .txt .h.cat_4 {
  background: #00aeff;
}

header .header_nav .case_nav ul li .txt .h.cat_5 {
  background: #007f92;
}

header .header_nav .case_nav ul li .txt .h.cat_6 {
  background: #484c4d;
}

header .header_nav .case_nav ul li .txt .h.cat_7 {
  background: #ff7a34;
}

header .header_nav .case_nav ul li .txt .h.cat_8 {
  background: #ff6716;
}

header .header_nav .case_nav ul li .txt .h.cat_9 {
  background: #346BFF;
}

header .header_nav .js_case_btNav.on a {
  color: #28b9b9;
}

header .header_nav .case_nav ul li .txt .name {
  font-size: 13px;
}

header .header_nav .js_blog_btNav.has_sub_menu .arrow {
  top: 0;
}

header .blog_nav {
  display: none;
  position: fixed;
  top: 80px;
  left: 0;
  width: 100%;
  background: rgba(255, 255, 255, 1);
  padding: 32px 0 60px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

header .blog_nav .itemGroup {
  max-width: 1078px;
  margin: 0 auto;
  display: flex;
  gap: 64px;
}

header .blog_nav .item ul {
  display: block;
}

header .blog_nav .item ul li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 6px;
}

header .blog_nav .item ul li::before {
  content: "";
  position: absolute;
  top: 8px;
  left: -1px;
  width: 5px;
  height: 5px;
  border-right: 2px solid #30bbbb;
  border-bottom: 2px solid #30bbbb;
  transform: rotate(-45deg);
}

header .blog_nav .item .h {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.025em;
  line-height: 1.125;
  border-bottom: 2px solid #28b9b9;
  margin-bottom: 20px;
  padding-bottom: 4px;
}

header .blog_nav .item .tagGroup {
  max-width: 460px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

header .blog_nav .item .tagGroup .tag a {
  display: block;
  white-space: nowrap;
  line-height: 1;
  font-size: 12px;
  padding: 7px 8px;
  border-radius: 13px;
  border: 1px solid #28b9b9;
  transition: all 0.4s ease;
}

header .blog_nav .item .tagGroup .tag a:hover {
  opacity: 0.6;
}

header .blog_nav .item .tagGroup .tag a {
  color: #28b9b9 !important;
}

@media screen and (max-width: 1365px) {
  header .logo {
    padding: 15px 20px;
  }

  header .logo .img {
    width: 207px;
  }

  header .logo .note {
    display: none;
  }

  #header {
    display: inherit;
    height: auto;
    padding: 0;
  }

  header .header_nav {
    display: none;
    background: #fff;
    max-height: calc(100vh - 60px);
    overflow: scroll;
  }

  header .header_nav ul {
    display: inherit;
  }

  header .header_nav ul:first-of-type li {
    box-sizing: border-box;
    margin-right: 0;
    padding: 20px 40px;
    border-top: 1px solid #f3f5f5;
  }

  header .header_nav .js_service_btNav {
    position: relative;

  }

  header .header_nav .js_service_btNav:before {
    position: absolute;
    content: '';
    width: 15px;
    height: 2px;
    background: #28b9b9;
    top: 32px;
    right: 30px;
  }

  header .header_nav .js_service_btNav:after {
    position: absolute;
    content: '';
    width: 15px;
    height: 2px;
    background: #28b9b9;
    top: 32px;
    right: 30px;
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    transition: 0.4s ease;
  }

  header .header_nav .js_service_btNav.on:after {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  header .header_nav ul:first-of-type .service_nav {
    position: inherit;
    padding: 0;

  }

  header .header_nav .service_nav ul {
    display: inherit;
    font-weight: 300;
    max-width: 100%;
  }

  header .header_nav .service_nav ul li {
    position: relative;
    background: none !important;
    padding: 0;
    min-height: 65px !important;
    max-width: 100% !important;
    font-size: 14px;
    width: 100%;
    margin-bottom: 0;
    margin-right: 0;
    height: auto;
  }

  header .header_nav .service_nav ul li:after {
    position: absolute;
    content: '';
    width: 6px;
    height: 6px;
    border: 0px;
    border-top: solid 2px #28b9b9;
    border-right: solid 2px #28b9b9;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 28px;
    right: 40px;
    margin-left: 8px;
  }

  header .header_nav .service_nav ul li:first-of-type {
    border: none;
  }

  header .header_nav .service_nav ul li:first-of-type,
  header .header_nav .service_nav ul li:nth-of-type(2) {
    font-size: 14px;
  }

  header .header_nav .service_nav ul li a {
    color: #333;
    padding: 20px 40px 20px 60px;
    justify-content: flex-start;
  }

  header .header_nav .service_nav ul li:first-of-type a {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
  }

  header .header_nav .service_nav ul li:first-of-type a .txt {
    text-align: left;
  }

  header .header_nav .service_nav ul li:first-of-type .min {
    font-size: 10px;
    margin-top: 0px;
    margin-left: 8px;
  }

  header .header_nav .service_nav ul li a br {
    display: none;
  }

  header .header_nav .service_nav ul li a:hover {
    color: #333;
  }

  header .header_nav .service_nav ul li a .ico {
    display: none;
  }

  header .header_nav .has_sub_menu {
    display: block;
  }

  header .header_nav .has_sub_menu .arrow {
    display: none;
  }

  header .header_nav .contact li {
    box-sizing: border-box;
    margin-right: 0;
    padding: 20px 40px;
    text-align: center;
    background: #f8981c;
    color: #fff;
    border-top: 1px solid #fff;
  }

  header .header_nav .contact .tel .material-icons {
    color: #fff;
  }

  header .header_nav .contact li a {
    width: 100%;
    height: 100%;
    border: none;
    color: #fff;
  }

  header .header_nav .contact li:last-of-type a:hover {
    color: #fff;
    background: #f8981c;
  }

  header .btNav {
    display: block;
    position: absolute;
    top: 24px;
    right: 20px;
    width: 24px;
    height: 24px;
  }

  header .btNav span {
    position: absolute;
    top: 6px;
    left: 0;
    width: 100%;
    height: 3px;
    background: #28b9b9;
    transition: all 0.4s ease;
  }

  header .btNav span:first-of-type {
    top: 0;
  }

  header .btNav span:last-of-type {
    top: 12px;
  }

  header .btNav.on span {
    left: 50%;
    width: 0;
  }

  header .btNav.on span:first-of-type {
    top: 6px;
    left: 0;
    width: 100%;
    -webkit-transform: rotate(45deg);
    -webkit-transform-origin: center;
    transform: rotate(45deg);
    transform-origin: center;
  }

  header .btNav.on span:last-of-type {
    top: 6px;
    left: 0;
    width: 100%;
    -webkit-transform: rotate(-45deg);
    -webkit-transform-origin: center;
    transform: rotate(-45deg);
    transform-origin: center;
  }
}


/* ------------------------ footer */
#footer {
  position: relative;
}

#footer .contactSection {
  padding: 80px 0 78px 0;
  background: #484c4d;
  color: #fff;
}

#footer .contactSection .head {
  margin-bottom: 40px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.1em;
  line-height: 1.66;
}

#footer .contactSection .contactItemGroup {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}

#footer .contactSection .contactItemGroup .item {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: calc((100% - 72px)/3);
  background: #f4f5f5;
  border-radius: 3px;
  padding: 8px 28px 32px;
  color: #484c4d;
}

#footer .contactSection .contactItemGroup .item .ico {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 72px;
}

#footer .contactSection .contactItemGroup .item .h {
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 16px;
}

#footer .contactSection .contactItemGroup .item .txt {
  font-size: 14px;
  letter-spacing: 0.05em;
  line-height: 1.75;
  margin-bottom: 20px;
}

#footer .contactSection .contactItemGroup .item .btn {
  margin: auto auto 0;
  width: 100%;
  max-width: 240px;
  height: 56px;
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
}

#footer .contactSection .contactItemGroup .item .btn a {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  background: #28b9b9;
}

#footer .contactSection .phone {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  max-width: 580px;
  margin: 0 auto;
  padding: 20px 32px;
  align-items: center;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
}

#footer .contactSection .phone .txt {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

#footer .contactSection .phone .number {
  font-size: 26px;
  letter-spacing: 0.05em;
  font-weight: bold;
  line-height: 1.07;
  font-family: 'Roboto';
}

#footer .contactSection .phone .number .min {
  display: block;
  font-size: 14px;
  font-weight: normal;
  margin-top: 8px;
}

#footer .linkSection {
  overflow: hidden;
  padding: 64px 0 80px 0;
  background: #2f3233;
  color: #fff;
}

#footer .linkSection a {
  color: #fff;
  font-size: 13px;
}

#footer .linkSection .headArea {
  background: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 64px;
  padding: 0;
}

#footer .linkSection .headArea .logo img {
  max-width: 288px;
  width: 100%;
}

#footer .linkSection .bodyArea {
  display: flex;
  width: 100%;
  margin-bottom: 80px;
}

#footer .linkSection .bodyArea .left {
  flex: 1;
  font-size: 13px;
}

#footer .linkSection .bodyArea .left .topArea {
  display: flex;
  margin-bottom: 56px;
}

#footer .linkSection .bodyArea .left ul {
  font-weight: 600;
}

#footer .linkSection .bodyArea .left ul li {
  margin-bottom: 10px;
}

#footer .linkSection .bodyArea .left ul li a {
  position: relative;
  vertical-align: middle;
}

#footer .linkSection .bodyArea .left ul li a .ico {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 8px;
  background: url("/img/footer_ico_01.svg");
  background-size: contain;
  vertical-align: middle;
  transform: translateY(-1px);
}

#footer .linkSection .bodyArea .left .list03 ul li a .ico {
  display: inline-block;
  width: 10px;
  height: 12px;
  margin-left: 8px;
  background: url("/img/footer_ico_02.svg");
  background-size: contain;
  vertical-align: middle;
  transform: translateY(-1px);
}

#footer .linkSection .bodyArea .left ul li:last-of-type {
  margin-bottom: 0;
}

#footer .linkSection .bodyArea .left ul.inner {
  font-weight: 300;
  padding-left: 16px;
}

#footer .linkSection .bodyArea .left ul.inner li:first-of-type {
  position: relative;
  font-weight: 600;
}

#footer .linkSection .bodyArea .left ul.inner li:first-of-type::before {
  position: absolute;
  content: "";
  width: 10px;
  height: 1px;
  background: #999999;
  top: 50%;
  left: -16px;
  transform: translateY(-50%);
}

#footer .linkSection .bodyArea .left .list01 {
  width: 336px;
}

#footer .linkSection .bodyArea .left .list01 .h {
  font-weight: 600;
  margin-bottom: 16px;
}

#footer .linkSection .bodyArea .left .list01 ul li {}

#footer .linkSection .bodyArea .left .list02 {
  display: flex;
}

#footer .linkSection .bodyArea .left .list02 ul:first-of-type {
  width: 168px;
}

#footer .linkSection .bodyArea .left .list03 {
  margin-bottom: 24px;
}

#footer .linkSection .bodyArea .left .list02 ul li {
  margin-bottom: 14px;
}

#footer .linkSection .bodyArea .right {
  padding-left: 46px;
  border-left: 1px solid #484C4D;
}

#footer .share {
  position: absolute;
  top: 40px;
  right: -32px;
}

#footer .share li {
  float: left;
  margin-left: 8px;
}

#footer .socialBox {
  transform: translateX(24px);
}

#footer .socialBox .btGroup {
  display: flex;

}

#footer .socialBox .btGroup li :first-of-type {
  padding-right: 8px;
  line-height: 1;
}

#footer .socialBox .plugin {
  display: none;
}

#footer .btTop {
  opacity: 0.5;
  position: absolute;
  bottom: 226px;
  right: 40px;
  width: 40px;
  height: 40px;
  border-radius: 2px;
  background: #000;
  cursor: pointer;
  transition: all 0.4s ease;
}

#footer .btTop:after {
  content: '';
  position: absolute;
  top: 16px;
  left: 50%;
  width: 16px;
  height: 16px;
  margin-left: -8px;
  box-sizing: border-box;
  border-radius: 2px;
  border-right: 3px solid #fff;
  border-top: 3px solid #fff;
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(-45deg);
  transform-origin: center center;
  transform: rotate(-45deg);
}

#footer .bannerBlock .banner {
  width: 158px;
  margin-bottom: 20px;
}

#footer .bannerBlock .banner a {
  display: block;
}

#footer .bannerBlock .banner .sp {
  display: none;
}

#footer .azBtn {
  margin-bottom: 10px;
}

#footer .icms {
  width: 158px;
}

#footer .copy {
  color: #adb2b2;
  font-size: 12px;
  text-align: center;
}

@media only screen and (max-width: 1023px) {
  #footer .linkSection .bodyArea .left .list02 {
    display: block;
  }
}

@media only screen and (max-width: 767px) {
  #footer .contactSection {
    padding: 40px 0;
  }

  #footer .contactSection .head {
    font-size: 14px;
    margin-bottom: 32px;
  }

  #footer .contactSection .contactItemGroup {
    display: block;
  }

  #footer .contactSection .contactItemGroup .item {
    width: 100%;
    margin-bottom: 24px;
  }

  #footer .contactSection .contactItemGroup .item .ico {
    height: 48px;
  }

  #footer .contactSection .contactItemGroup .item .h {
    font-size: 16px;
    margin-bottom: 12px;
  }

  #footer .contactSection .contactItemGroup .item .btn {
    max-width: 240px;
  }

  #footer .contactSection .phone {
    display: block;
    padding: 20px 16px;
    text-align: center;
  }

  #footer .contactSection .phone .txt {
    font-size: 16px;
    margin-bottom: 12px;
  }

  #footer .linkSection {
    padding: 32px 0 64px;
  }

  #footer .linkSection .headArea {
    display: block;
    margin-bottom: 24px;
  }

  #footer .linkSection .headArea .logo {
    margin-bottom: 16px;
  }

  #footer .linkSection .headArea .logo img {
    max-width: 235px;
  }

  #footer .socialBox {
    position: static;
    width: auto;
    max-width: none;
    margin: 0 auto;
    text-align: left;
    transform: none;
  }

  #footer .linkSection .bodyArea .left .topArea {
    display: block;
    margin-bottom: 36px;
  }

  #footer .linkSection .bodyArea .left .list01 {
    margin-bottom: 24px;
  }

  #footer .linkSection .bodyArea .left .list02 {
    display: block;
  }

  #footer .linkSection .bodyArea .left .list02 ul {
    display: flex;
    flex-wrap: wrap;
  }

  #footer .linkSection .bodyArea .left .list02 ul:first-of-type {
    width: 100%;
  }

  #footer .linkSection .bodyArea .left .list02 ul li {
    width: 50%;
    margin-right: 0;
  }

  #footer .linkSection .bodyArea .right {
    border-left: none;
    border-top: 1px solid #484C4D;
    margin-top: 56px;
    padding-top: 32px;
    padding-left: 0;
  }

  #footer .bannerBlock .banner .sp {
    display: block;
    margin: 0 auto;
  }

  #footer .bannerBlock .banner .pc {
    display: none;
  }

  #footer .bannerBlock .banner:first-of-type {
    width: 100%;
  }

  #footer .bannerBlock .banner:first-of-type a {
    max-width: 343px;
    margin: 0 auto;
  }

  #footer .bannerBlock .inner {
    display: flex;
    justify-content: center;
    margin-top: 24px;
  }

  #footer .bannerBlock .inner .banner:first-of-type {
    width: 158px;
    margin-right: 28px;
    transform: translateY(-4px);
  }

  #footer .bannerBlock .inner .banner {
    margin-bottom: 0;
  }

  #footer .linkSection .bodyArea {
    display: block;
    margin-bottom: 42px;
  }

  #footer .socialBox .plugin {
    width: auto;
  }

  #footer .btTop {
    bottom: 0;
    right: 0;
  }
}



/* ------------------------ btFix */
.btFix .bxFix1 a {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 2;
  width: 136px;
  margin-top: -65px;
  margin-right: -95px;
  padding: 20px 0 20px 20px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  border-radius: 4px 0 0 4px;
  background: #fe7a0c;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
}

.btFix .bxFix1 a:hover,
.btFix .bxFix2 a:hover {
  opacity: 1;
  margin-right: 0;
}

.btFix .bxFix2 a {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 2;
  width: 136px;
  margin-top: 5px;
  margin-right: -95px;
  padding: 20px 0 20px 20px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  border-radius: 4px 0 0 4px;
  background: #fe7a0c;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
}

.btFix .bxFix1 i,
.btFix .bxFix2 i {
  margin-right: 23px;
  vertical-align: middle;
  line-height: 20px;
}

@media only screen and (max-width: 1023px) {
  .btFix {
    display: none;
  }
}



/* ------------------------ headArea */
.headArea {
  background: url(/img/bg_main.jpg) right center;
}

.headArea .inner {
  padding: 48px 0;
  background: url(/img/bg_mainwrap.jpg) no-repeat right center;
}

.headArea .inner p {
  font-weight: bold;
}

.headArea .shoulder {
  font-size: 16px;
  font-weight: 700;
}

.headArea .shoulder {
  font-size: 16px;
  font-weight: 700;
}

.headArea .shoulder .img {
  display: inline-block;
  width: 184px;
}

.headArea.aws .shoulder .img {
  width: 238px;
}

.headArea h1 {
  font-size: 36px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.headArea.token {
  background: #fff;
}

.headArea.token .inner {
  padding: 56px 0 64px 0;
  font-size: 14px;
  font-weight: bold;
  background: url(/img/bg_token.jpg) no-repeat right top / cover;
}

.headArea.token .logo {
  width: 100%;
  max-width: 510px;
  text-align: center;
  margin-bottom: 36px;
}

.headArea.token h1 {
  margin-bottom: 24px;
  width: 510px;
  text-align: center;
  font-size: 26px;
  border-top: 1px solid #25afaf;
  border-bottom: 1px solid #25afaf;
  padding: 10px 0;
}

.headArea.token p {
  width: 510px;
}

.headArea.token .top_btnArea {
  margin-top: 52px;
}

.headArea.feature h1 {
  margin-bottom: 30px;
}

.headArea.callcenter {
  background: url(/img/bg_callcenter.jpg) no-repeat right center / cover;
  font-size: 14px;
  font-weight: bold;
}

.headArea.callcenter .inner {
  background: none;
  padding: 64px 0;
}

.headArea.callcenter p {
  max-width: 600px;
  margin-bottom: 42px;
}

.headArea.callcenter h1 {
  color: #00aeff;
  font-size: 36px;
  line-height: 1.2;
  letter-spacing: 0;
}

.headArea.callcenter .caption {
  margin-bottom: 40px;
  color: #333;
  font-size: 14px;
  font-weight: normal;
}

.headArea.callcenter .caption .img {
  display: inline-block;
  width: 184px;
  margin-left: 8px;
}

.headArea.callcenter .h {
  position: relative;
  margin-bottom: 10px;
  padding-left: 88px;
  font-size: 25px;
  font-weight: bold;
  line-height: 1.4;
}

.headArea.callcenter .h .ico {
  position: absolute;
  top: 8px;
  left: 0;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  box-sizing: border-box;
  border: 2px solid #00aeff;
  color: #00aeff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 70px;
}

.headArea.callcenter .note {
  padding-top: 24px;
  font-size: 13px;
  font-weight: normal;
}

.headArea.consulting .top_btnArea,
.headArea.smarttg .top_btnArea {
  margin-top: 52px;
}

@media only screen and (max-width: 1023px) {
  .headArea .inner {
    background: url(/img/bg_mainwrap_sp.png) no-repeat right center #f7f5f2;
  }

  .headArea.callcenter {
    background-position: center;
  }

  .headArea.token .inner {
    background: url(/img/bg_token_tb.jpg) no-repeat right top / cover;
  }
}

@media only screen and (max-width: 767px) {
  .headArea {
    position: relative;
    background: none;
  }

  .headArea .inner {
    padding: 24px 0;
    background: url(/img/bg_mainwrap_sp.png) no-repeat right top #f7f5f2;
    background-size: 112px;
  }

  .headArea .inner br {
    display: none;
  }

  .headArea .shoulder {
    font-size: 12px;
  }

  .headArea .shoulder .img {
    width: 140px;
  }

  .headArea.aws .shoulder .img {
    width: 140px;
  }

  .headArea h1 {
    font-size: 22px;
    line-height: 1.4;
    letter-spacing: 0;
  }

  .headArea.feature h1 {
    width: 184px;
  }

  .headArea.token .inner {
    padding: 24px 0;
  }

  .headArea.token .logo {
    margin: 0 auto 24px;
  }

  .headArea.token .logo img {
    width: 224px;
  }

  .headArea.token h1 {
    width: 100%;
    margin-right: 0;
    margin-bottom: 16px;
    line-height: 1.4;
  }

  .headArea.token .h {
    display: inline-block;
    margin-bottom: 8px;
    font-size: 18px;
  }

  .headArea.token p {
    width: auto;
  }

  .headArea.callcenter {
    background: none;
    font-size: 14px;
  }

  .headArea.callcenter .inner {
    padding: 0 0 40px 0;
  }

  .headArea.callcenter .img {
    margin-bottom: 20px;
  }

  .headArea.callcenter h1 {
    display: none;
    font-size: 20px;
  }

  .headArea.callcenter .caption {
    display: none;
    margin-bottom: 16px;
  }

  .headArea.callcenter .h {
    min-height: 56px;
    padding: 8px 0 0 72px;
    font-size: 13px;
  }

  .headArea.callcenter .h .ico {
    top: 0;
    width: 53px;
    height: 53px;
    font-size: 12px;
    line-height: 49px;
  }

  .headArea.callcenter .note {
    font-size: 12px;
  }

  .headArea.callcenter p br {
    display: none;
  }
}



/* ------------------------ main */
.mainArea {
  background: url(/img/bg_main.jpg) right center #f7f5f5;
}

.mainArea .inner {
  padding: 66px 0;
  background: url(/img/bg_mainwrap.jpg) no-repeat right center;
}

.mainArea .copy {
  padding: 40px 0 72px 0;
  background: url(/img/main_balloon.png) no-repeat top left;
  color: #28b9b9;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.mainArea .copy .h {
  color: #007780;
  font-size: 38px;
}

.mainArea .copy .h .en {
  font-size: 42px;
  font-weight: 700;
}

.mainArea .btNews {
  width: 318px;
  height: 60px;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: bold;
  line-height: 60px;
  letter-spacing: 0.05em;
}

.mainArea .mark {
  display: inline-block;
  position: relative;
  left: -8px;
  width: 129px;
  margin-right: 5px;
}

.mainArea .btAws {
  display: inline-block;
  width: 180px;
}

.mainArea .bnrPaytg {
  display: inline-block;
  width: 180px;
  margin-left: 8px;
}

.mainArea .btSeminar {
  display: inline-block;
  height: 48px;
}

.mainArea .btSeminar a {
  display: block;
  padding: 0 8px;
  border-radius: 24px;
  background: #484d4d;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: 0.05em;
  transition: all 0.4s ease;
}

.mainArea .about {
  display: none;
  position: absolute;
  top: 108px;
  left: 50%;
  width: 700px;
  margin-left: -350px;
  padding: 48px 80px;
  box-sizing: border-box;
  background: #484d4d;
  background: rgba(72, 77, 77, 0.95);
  color: #fff;
  font-size: 14px;
}

.mainArea .about h2 {
  margin-bottom: 24px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
}

.mainArea .about .close {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 38px;
  height: 38px;
  cursor: pointer;
}

.mainArea .about .close:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 38px;
  margin-left: -1px;
  background: #fff;
  transform-origin: center center;
  transform: rotate(45deg);
}

.mainArea .about .close:after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 38px;
  margin-left: -1px;
  background: #fff;
  transform-origin: center center;
  transform: rotate(-45deg);
}

.mainArea .btAbout:hover {
  opacity: 0.8;
}

.mainArea .btAbout .cl01 {
  font-size: 20px;
}

.mainArea .btnArea {
  display: flex;
  justify-content: space-between;
  max-width: 584px;
}

.mainArea .btnArea .btn {
  width: calc((100% - 32px)/3);
  border-radius: 6px;
  box-shadow: 0 1px 2px 0 rgba(7, 0, 2, 0.1);
}

.mainArea .btnArea .btn .sp {
  display: none;
}

@media only screen and (max-width: 1023px) {
  .mainArea .inner {
    background: url(/img/bg_mainwrap_tab.png) no-repeat right top #f7f5f2;
    background-size: contain;
  }
}

@media only screen and (max-width: 767px) {
  .mainArea .inner {
    padding: 15px 0 54px 0;
    background: url(/img/bg_mainwrap_sp.png) no-repeat right top #f7f5f2;
    background-size: 112px;
  }

  .mainArea .copy {
    padding: 40px 0 47px 0;
    background-size: 105px;
    font-size: 14px;
  }

  .mainArea .copy .h {
    width: 200px;
    margin-bottom: 16px;
    font-size: 22px;
    line-height: 1.2;
  }

  .mainArea .copy .h .en {
    font-size: 24px;
  }

  .mainArea .copy br {
    display: none;
  }

  .mainArea .btNews {
    width: auto;
    text-align: center;
  }

  .mainArea .btNews a {
    display: inline-block;
    padding: 0 28px;
    height: 48px;
    font-size: 14px;
    line-height: 48px;
  }

  .mainArea .mark {
    display: block;
    position: static;
    margin: 0 auto 16px auto;
  }

  .mainArea .btAws {
    display: block;
    margin: 0 auto 16px;
  }

  .mainArea .bnrPaytg {
    display: block;
    margin: 0 auto;
  }

  .mainArea .btSeminar {
    display: block;
    text-align: center;
  }

  .mainArea .btSeminar a {
    display: inline-block;
    padding: 0 28px;
    font-size: 14px;
    line-height: 48px;
  }

  .mainArea .btnArea {
    display: block;
  }

  .mainArea .btnArea .btn {
    width: 100%;
    max-width: 305px;
    margin: 0 auto 16px;
    box-shadow: 1.414px 1.414px 3.92px 0.08px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
  }

  .mainArea .btnArea .btn:last-of-type {
    margin-bottom: 0;
  }

  .mainArea .btnArea .btn .sp {
    display: block;
  }

  .mainArea .btnArea .btn .pc {
    display: none;
  }
}

/*linkArea*/
.linkArea .linkGroup {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  padding: 48px 0;
  gap: 32px;

}

.linkArea .linkGroup .item a img {
  display: block;
  height: 32px;
}

/* .linkArea .linkGroup .item:nth-of-type(1) a img{
    width: 166px;
}
.linkArea .linkGroup .item:nth-of-type(2) a img{
    width: 175px;
}
.linkArea .linkGroup .item:nth-of-type(3) a img{
    width: 151px;
}
.linkArea .linkGroup .item:nth-of-type(4) a img{
    width: 192px;
}
.linkArea .linkGroup .item:nth-of-type(5) a img{
    width: 104px;
}
.linkArea .linkGroup .item:nth-of-type(6) a img{
    width: 132px;
}
.linkArea .linkGroup .item:nth-of-type(7) a img{
    width: 158px;
}
.linkArea .linkGroup .item:nth-of-type(8) a img{
    width: 126px;
}
.linkArea .linkGroup .item:nth-of-type(9) a img{
    width: 146px;
}
.linkArea .linkGroup .item:nth-of-type(10) a img{
    width: 192px;
}
.linkArea .linkGroup .item:nth-of-type(11) a img{
	width: 94px;
}
.linkArea .linkGroup .item:nth-of-type(12) a img{
	width:242px;
}
.linkArea .linkGroup .item:nth-of-type(13) a img{
	width: 157px;
}
.linkArea .linkGroup .item:nth-of-type(14) a img{
	width: 130px;
}
.linkArea .linkGroup .item:nth-of-type(15) a img{
	width: 135px;
} */
@media screen and (max-width: 767px) {
  .linkArea .linkGroup {
    margin: 0 auto;
    justify-content: flex-start;
    max-width: 305px;
    padding: 32px 0px;
    gap: 28px 20px;
  }

  .linkArea .linkGroup .item {
    width: calc((100% - 20px)/2);

  }
}

/* ------------------------ #contents */
.leadSection {
  padding: 64px 0 72px 0;
  color: #666;
  font-size: 16px;
}

.leadSection p {
  margin-bottom: 32px;
  padding: 0 60px;
}

.leadSection h2 {
  color: #333;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.hGroup {
  position: relative;
  padding: 40px 0;
  background: #fff;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

.hGroup:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
  z-index: 999;
}

.hGroup h2 {
  margin-bottom: 16px;
  color: #28b9b9;
  font-size: 22px;
  font-weight: bold;
}

.leadSection .product .feature {
  float: left;
  width: 460px;
  padding: 80px 0;
  background: #dadbdb;
  text-align: center;
}

.leadSection .product .feature h3 {
  margin-bottom: 32px;
  font-size: 18px;
  font-weight: bold;
}

.leadSection .product .feature .bt {
  display: inline-block;
  width: 320px;
  font-size: 18px !important;
  font-weight: bold;
  line-height: 60px;
}

.leadSection .product .token {
  float: right;
  width: 460px;
  padding: 80px 0;
  color: #fff;
  background: #636566;
  text-align: center;
}

.leadSection .product .token h3 {
  margin-bottom: 32px;
  font-size: 18px;
  font-weight: bold;
}

.leadSection .product .token .bt {
  display: inline-block;
  width: 320px;
  font-size: 18px !important;
  font-weight: bold;
  line-height: 60px;
}

@media only screen and (max-width: 1023px) {
  .leadSection p {
    padding: 0;
  }

  .leadSection .product .feature {
    float: none;
    margin: 0 auto 48px auto;
  }

  .leadSection .product .token {
    float: none;
    margin: 0 auto;
  }
}

@media only screen and (max-width: 767px) {
  .leadSection {
    padding: 64px 0 72px;
    font-size: 14px;
  }

  .leadSection h2 {
    font-size: 16px;
  }

  .leadSection .product .feature,
  .leadSection .product .token {
    width: auto;
    padding: 32px 16px;
  }

  .leadSection .product .feature {
    margin-bottom: 24px;
  }

  .leadSection .product .feature h3,
  .leadSection .product .token h3 {
    margin-bottom: 16px;
    font-size: 14px;
  }

  .leadSection .product .feature .bt,
  .leadSection .product .token .bt {
    width: 100%;
    font-size: 14px !important;
  }

  .hGroup {
    font-size: 14px;
  }

  .hGroup h2 {
    font-size: 18px;
  }
}


/* ------------------------ top */
.topArea .featureSection {
  padding: 56px 0;
  background: #c2f2f2;
}

.topArea .featureSection .item {
  position: relative;
  float: left;
  width: calc(100%/3);
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
  transition: all 0.4s ease;
}

.topArea .featureSection .item p {
  font-size: 16px;
}

.topArea .featureSection .item:nth-child(1) {
  transition-delay: 0.1s;
}

.topArea .featureSection .item:nth-child(2) {
  transition-delay: 0.2s;
}

.topArea .featureSection .item:nth-child(3) {
  transition-delay: 0.3s;
}

.topArea .featureSection.on .item {
  opacity: 1;
  top: 0;
}

.topArea .featureSection .item .cl02 {
  font-size: 22px;
}

.topArea .featureSection .item .num {
  display: inline-block;
  position: relative;
  margin-top: 10px;
  padding-top: 20px;
  padding-left: 40px;
  color: #007780;
  font-size: 34px;
  font-weight: bold;
  line-height: 1;
}

.topArea .featureSection .item .num:before {
  content: '';
  position: absolute;
  bottom: 16px;
  left: 7px;
  width: 4px;
  height: 46px;
  background: #ff7300;
}

.topArea .featureSection .item .num:after {
  content: '';
  position: absolute;
  bottom: 16px;
  left: 0;
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  border-right: 4px solid #ff7300;
  border-bottom: 4px solid #ff7300;
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(45deg);
  transform-origin: center center;
  transform: rotate(45deg);
}

.topArea .featureSection .item:last-of-type .num:after {
  bottom: auto;
  top: 40px;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg)
}

.topArea .featureSection .item .num .l {
  font-size: 84px;
  letter-spacing: 0;
}

.topArea .featureSection .item .mx {
  display: block;
  position: absolute;
  top: 0;
  left: 40px;
  width: 89px;
  background: #26b8b8;
  color: #fff;
  font-size: 14px;
  border-radius: 3px;
  line-height: 20px;
}

.topArea .featureSection .item:last-of-type .mx {
  background: transparent;
}

.topArea .cloudService p {
  margin-bottom: 0;
  padding: 0;
  font-size: 14px;
}

.topArea .cloudService .boxGroup {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto 1fr 1fr;
  grid-gap: 12px;
}

.topArea .cloudService .box {
  width: 100%;
  position: relative;
  margin: 0;
  padding: 32px 32px 104px;
  box-sizing: border-box;
  color: #fff;
}

.topArea .cloudService .box h3 {
  /*display: table-cell;*/
  height: 64px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  line-height: 1.3;
}

.topArea .cloudService .box h3 .logo {
  display: block;
  max-width: 248px;
  margin: 0 auto 8px;
}

.topArea .cloudService .box h3 .en {
  font-size: 18px;
}

.topArea .cloudService .blue {
  color: #1b41b3;
}

.topArea .cloudService .box a {
  display: block;
  /*	width: 75%;*/
  width: calc(100% - 64px);
  max-width: 208px;
  position: absolute;
  bottom: 32px;
  left: 50%;
  /*	margin-left: -37.5%;*/
  border-radius: 3px;
  background: #fff;
  font-size: 14px;
  font-weight: bold;
  color: #28b9b9;
  text-align: center;
  line-height: 48px;
  transform: translateX(-50%);
}

.topArea .cloudService .box:nth-child(1) {
  background: #346bff;
  grid-column: 1/4;
  grid-row: 1/2;
  padding: 32px 100px;
}

.topArea .cloudService .box:nth-child(2) {
  background: #28b9b9;
  grid-column: 1/2;
  grid-row: 2/3;
}

.topArea .cloudService .box:nth-child(3) {
  background: #9D6DC4;
  grid-column: 2/3;
  grid-row: 2/3;
}

.topArea .cloudService .box:nth-child(4) {
  background: #007780;
  grid-column: 3/4;
  grid-row: 2/3;
}

.topArea .cloudService .box:nth-child(5) {
  background: #FF7A34;
  grid-column: 1/2;
  grid-row: 3/4;
}

.topArea .cloudService .box:nth-child(6) {
  background: #02AEFF;
  grid-column: 2/3;
  grid-row: 3/4;
}

.topArea .cloudService .box:nth-child(7) {
  background: #FF6666;
  grid-column: 3/4;
  grid-row: 3/4;
}

/*.topArea .cloudService .box:nth-child(2) a {color: #f8981c}
.topArea .cloudService .box:nth-child(3) a {color: #007780}
.topArea .cloudService .box:last-child a {color: #00aeff}*/

.cloudService .box .outer .ico {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto 16px;
}

.cloudService .box .outer .ico img {
  max-width: 100%;
}

.topArea .cloudService .box:nth-child(1) .head {
  max-width: 355px;
  margin-bottom: 16px;
  display: block;
}

.topArea .cloudService .box:nth-child(1) .txtArea {
  display: flex;
  gap: 54px;
}

.topArea .cloudService .box:nth-child(1) .txtArea p {
  font-size: 16px;
}

.topArea .cloudService .box:nth-child(1) .txtArea a {
  position: relative;
  bottom: auto;
  left: auto;
  transform: none;
  max-height: 48px;
  margin-top: 4px;
}

.topArea .bx_5 p {
  padding: 0;
}

.topArea .newsSection {
  padding: 40px 0 64px 0;
}

.topArea .newsSection .blog {
  position: relative;
  margin-bottom: 48px;
  padding: 0 0 48px 134px;
  border-bottom: 1px solid #ddd;
}

.topArea .newsSection .blog .h {
  position: absolute;
  top: 0;
  left: 0;
  color: #ff7300;
  font-family: 'Roboto';
  font-size: 24px;
  letter-spacing: 0.05em;
}

.topArea .newsSection .blog .more {
  position: absolute;
  top: 48px;
  left: 0;
  font-size: 14px;
}

.topArea .newsSection .blog .more a {
  display: block;
  position: relative;
  padding-right: 16px;
}

.topArea .newsSection .blog .more a:after {
  content: '';
  position: absolute;
  top: 8px;
  right: 0;
  width: 8px;
  height: 8px;
  box-sizing: border-box;
  border-right: 1px solid #28b9b9;
  border-top: 1px solid #28b9b9;
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(45deg);
  transform-origin: center center;
  transform: rotate(45deg);
}

.topArea .newsSection .blog li {
  overflow: hidden;
  margin-bottom: 8px;
  font-family: 'Roboto';
  font-size: 15px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topArea .newsSection .blog li .nTitle {
  display: inline;
  margin-left: 20px;
  font-size: 14px;
  font-weight: normal;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  letter-spacing: 0.05em;
}

.topArea .newsSection .news {
  position: relative;
  padding: 0 0 0 134px;
}

.topArea .newsSection .news .h {
  position: absolute;
  top: 0;
  left: 0;
  color: #007780;
  font-family: 'Roboto';
  font-size: 24px;
  letter-spacing: 0.05em;
}

.topArea .newsSection .news .more {
  position: absolute;
  top: 48px;
  left: 0;
  font-size: 14px;
}

.topArea .newsSection .news .more a {
  display: block;
  position: relative;
  padding-right: 16px;
}

.topArea .newsSection .news .more a:after {
  content: '';
  position: absolute;
  top: 8px;
  right: 0;
  width: 8px;
  height: 8px;
  box-sizing: border-box;
  border-right: 1px solid #28b9b9;
  border-top: 1px solid #28b9b9;
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(45deg);
  transform-origin: center center;
  transform: rotate(45deg);
}

.topArea .newsSection .news li {
  overflow: hidden;
  margin-bottom: 8px;
  font-family: 'Roboto';
  font-size: 15px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topArea .newsSection .news li .nTitle {
  overflow: hidden;
  display: inline;
  /* margin-left: 30px; */
  margin-left: 20px;
  /* padding-left: 24px; */
  font-size: 14px;
  font-weight: normal;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  letter-spacing: 0.05em;
}

.topArea .newsSection .news li .pdf {
  background: url(/img/ico_pdf.png) no-repeat left top;
}

@media only screen and (max-width:1024px) {
  .topArea .featureSection .item {
    float: none;
    width: auto;
    margin-bottom: 32px !important;
  }
}

@media only screen and (max-width: 980px) {

  .topArea .cloudService .box {
    /*	width: 50%;*/
    padding: 24px 24px 96px 24px;
  }

  .topArea .cloudService .box h3 {
    /*	display: table-cell;*/
    /*	margin-bottom: 16px;*/
    font-size: 16px;
  }

  .topArea .cloudService .box a {
    bottom: 24px;
    padding: 0;
    font-size: 14px;
    line-height: 48px;
  }
}

@media only screen and (max-width: 767px) {

  .topArea .cloudService .box:nth-child(1) {
    padding: 24px 24px 96px 24px;
  }

  .topArea .cloudService .box:nth-child(1) .head {
    max-width: 305px;
  }

  .topArea .cloudService .box:nth-child(1) .txtArea {
    display: block;
  }

  .topArea .cloudService .box:nth-child(1) .txtArea a {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
  }

  .topArea .featureSection .item:last-child {
    margin-bottom: 0;
  }

  .topArea .featureSection .item .cl02 {
    font-size: 16px;
  }

  .topArea .cloudService .boxGroup {
    display: block;
  }

  .topArea .cloudService .box {
    width: 100%;
    padding: 24px 24px 96px 24px;
    margin-bottom: 16px;
  }

  .topArea .cloudService .box:last-of-type {
    margin-bottom: 0;
  }

  .topArea .cloudService .box h3 {
    display: block;
    height: auto;
    margin-bottom: 16px;
    font-size: 16px;
  }

  .topArea .cloudService .box a {
    bottom: 24px;
    padding: 0;
    font-size: 14px;
    line-height: 48px;
  }

  .topArea .newsSection {
    padding: 40px 0;
  }

  .topArea .newsSection .blog,
  .topArea .newsSection .news {
    margin-bottom: 32px;
    padding: 0 0 24px 0;
  }

  .topArea .newsSection .blog .h,
  .topArea .newsSection .news .h {
    position: static;
    margin-bottom: 16px;
    font-size: 20px;
  }

  .topArea .newsSection .blog .more,
  .topArea .newsSection .news .more {
    top: 8px;
    left: auto;
    right: 0;
  }

  .topArea .newsSection .blog li .nTitle,
  .topArea .newsSection .news li .nTitle {
    display: block;
    margin: 0;
    text-overflow: ellipsis;
  }
}


/* ------------------------ feature */
.featureArea .userSection {
  /*padding: 56px 0 80px 0;*/
  padding: 56px 0 0 0;
  /*border-top: 1px solid #ddd;*/
  /*background: #f3f5f5;*/
  text-align: center;
}

.featureArea .userSection h2 {
  margin-bottom: 40px;
  font-size: 24px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.featureArea .userSection h2 .en {
  font-size: 28px;
}

.featureArea .userSection .item {
  float: left;
  width: 25%;
  color: #26b7b7;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  letter-spacing: 0.05em;
  transition: all 0.4s ease;
}

.featureArea .userSection .itemGroup p {
  font-size: 15px;
}

.featureArea .userSection .item img {
  margin-bottom: 16px;
}

.featureArea .userSection .btFeature {
  width: 300px;
  margin: 0 auto;
  padding-top: 32px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 60px;
  letter-spacing: 0.05em;
}

.featureArea .featureSection .chart {
  margin-bottom: 64px;
  text-align: center;
  transition: all 0.4s ease;
}

.featureArea .featureSection .hGroup:nth-of-type(2) {
  background: #f3f5f5;

}

.featureArea .featureSection .hGroup:nth-of-type(2):after {
  border-top: 22px solid #f3f5f5;
}

.featureArea .featureSection .model {
  padding-top: 100px;
}

.featureArea .featureSection .itemGroup {
  padding: 56px 0 16px 0;
  background: #f3f5f5;
}

.featureArea .featureSection .itemGroup .layout {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.featureArea .featureSection .itemGroup .item {
  display: table;
  width: 460px;
  margin-bottom: 50px;
  box-sizing: border-box;
  color: #666;
  font-size: 14px;
  transition: all 0.4s ease;
}

.featureArea .featureSection .itemGroup .item .img {
  display: table-cell;
  width: 130px;
  vertical-align: top;
}

.featureArea .featureSection .itemGroup .item .body {
  display: table-cell;
  vertical-align: top;
}

.featureArea .featureSection .itemGroup h3 {
  margin-bottom: 8px;
  color: #333;
  font-size: 18px;
  font-weight: bold;
}

.featureArea .flowSection {
  position: relative;
  margin-bottom: 20px;
  padding: 56px 0 32px 0;
  border-bottom: 1px solid #e6e6e6;
  background: #f3f5f5;
  font-size: 16px;
  text-align: center;
}

.featureArea .flowSection:after {
  content: '';
  position: absolute;
  bottom: -16px;
  left: 50%;
  width: 32px;
  height: 32px;
  margin-left: -16px;
  box-sizing: border-box;
  background: #f3f5f5;
  border-right: 1px solid #e6e6e6;
  border-bottom: 1px solid #e6e6e6;
  transform-origin: center center;
  transform: rotate(45deg);
}

.featureArea .flowSection p {
  margin-bottom: 48px;
  font-size: 16px;
  font-weight: bold;
}

.featureArea .flowSection .chart {
  transition: all 0.4s ease;
}

.featureArea .costSection {
  padding: 24px 0 48px 0;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
}

.featureArea .costSection .h {
  margin-bottom: 16px;
  color: #007780;
}

.featureArea .costSection .cost {
  margin-bottom: 24px;
  transition: all 0.4s ease;
}

.featureArea .costSection .note {
  margin-top: 16px;
  color: #636666;
  font-size: 12px;
}

@media only screen and (max-width: 1023px) {
  .featureArea .userSection .item {
    display: inline-block;
    width: 50%;
    margin-bottom: 24px;
  }

  .featureArea .featureSection .itemGroup .item {
    width: auto;
  }
}

@media only screen and (max-width: 767px) {
  .featureArea .userSection {
    padding: 40px 0 0;
  }

  .featureArea .userSection h2 {
    font-size: 16px;
  }

  .featureArea .userSection .item {
    display: table;
    float: none;
    width: auto;
    margin-bottom: 24px;
    text-align: left;
  }

  .featureArea .userSection .item .img {
    display: table-cell;
    width: 72px;
    padding-right: 16px;
    vertical-align: top;
  }

  .featureArea .userSection .item .img img {
    margin: 0;
  }

  .featureArea .userSection .item p {
    display: table-cell;
    vertical-align: middle;
  }

  .featureArea .featureSection .itemGroup .item {
    width: auto;
    margin-bottom: 24px;
  }

  .featureArea .featureSection .itemGroup .item .img {
    width: 72px;
    padding-right: 16px;
  }

  .featureArea .featureSection .itemGroup h3 {
    margin-bottom: 4px;
    font-size: 14px;
  }

  .featureArea .costSection {
    font-size: 14px;
  }

  .featureArea .featureSection .model {
    padding-top: 50px;
  }
}



/* ------------------------ case */
.caseArea .caseNav {
  padding: 20px 0;
  border-bottom: 1px solid #ddd;
  text-align: center;
}

.caseArea .caseNav li {
  display: inline-block;
  border-left: 1px solid #ddd;
  padding: 0 32px;
  font-size: 16px;
  font-weight: bold;
  line-height: 36px;
  cursor: pointer;
}

.caseArea .caseNav li:hover {
  color: #29b3b5;
}

.caseArea .caseNav li .num {
  display: inline-block;
  margin-right: 8px;
  color: #29b3b5;
}

.caseArea .head {
  padding: 56px 0;
  text-align: center;
  position: relative;
}

.caseArea .head:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.caseArea .head .no {
  color: #28b9b9;
  font-size: 13px;
  line-height: 1.2;
  letter-spacing: 0.1em;
}

.caseArea .head .no .num {
  display: block;
  font-family: 'Roboto';
  font-size: 32px;
  font-weight: 700;
}

.caseArea .head h2 {
  font-size: 22px;
  font-weight: bold;
}

.caseArea .body {
  padding: 60px 0 72px 0;
  background: #f3f5f5;
}

.caseArea .body .img {
  margin-bottom: 40px;
  text-align: center;
  transition: all 0.4s ease;
}

.caseArea .point {
  display: table;
  width: 900px;
  margin: 0 auto;
  background: #fff;
  transition: all 0.4s ease;
}

.caseArea .point h3 {
  display: table-cell;
  width: 233px;
  height: 100%;
  background: #007780;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}

.caseArea .point ul {
  display: table-cell;
  padding: 24px 40px;
  border: 5px solid #79b6ba;
  border-left: none;
  font-size: 16px;
  line-height: 1.5;
}

.caseArea .point ul li {
  position: relative;
  padding: 4px 0 4px 20px;
}

.caseArea .point ul li:after {
  content: '';
  position: absolute;
  top: 12px;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #28b9b9;
}

@media only screen and (max-width: 1023px) {
  .caseArea .point {
    width: auto;
  }
}

@media only screen and (max-width: 767px) {
  .caseArea .caseNav li {
    display: block;
    border: none;
    padding: 0;
    font-size: 14px;
    line-height: 24px;
  }

  .caseArea .head {
    padding: 24px 0;
  }

  .caseArea .head .no .num {
    font-size: 24px;
  }

  .caseArea .head h2 {
    font-size: 16px;
  }

  .caseArea .body {
    padding: 40px 0;
  }

  .caseArea .point h3 {
    display: block;
    width: auto;
    height: auto;
    padding: 0 16px;
    font-size: 16px;
    line-height: 40px;
  }

  .caseArea .point ul {
    display: block;
    padding: 16px;
    border-top: none;
    border-left: 5px solid #79b6ba;
    font-size: 14px;
  }
}



/* ------------------------ token */
.tokenArea .tokenSection {
  padding: 66px 0 80px 0;
  background: #fff;
}

.tokenArea .tokenSection .logo {
  max-width: 267px;
  margin: 0 auto 40px;
}

.tokenArea .tokenSection h2 {
  margin-bottom: 40px;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.tokenArea .tokenSection h2 .cl07 {
  font-size: 24px;
}

.tokenArea .tokenSection .itemGroup {
  width: 75%;
  margin: 0 auto;
}

.tokenArea .tokenSection .item {
  float: left;
  width: 33.3%;
  text-align: center;
  color: #007f92;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  transition: all 0.4s ease;
}

.tokenArea .tokenSection .item img {
  margin-bottom: 16px;
}

.tokenArea .tokenSection .btToken {
  width: 300px;
  margin: 0 auto;
  padding-top: 32px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  line-height: 60px;
  letter-spacing: 0.05em;
}

.tokenArea .summary {
  padding: 40px 0 16px 0;
  background: #007f92;
  color: #fff;
  font-size: 16px;
}

.tokenArea .summary ul {
  width: 660px;
  margin: 0 auto;
}

.tokenArea .summary ul li {
  position: relative;
  margin-bottom: 24px;
  padding-left: 20px;
}

.tokenArea .summary ul li:after {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #21c3cc;
  ;
}

.tokenArea .head {
  padding: 40px 0;
  text-align: center;
  color: #28b9b9;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
  position: relative;
}

.tokenArea .head:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.tokenArea .head h2 {
  color: #333;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.tokenArea .body {
  padding: 56px 0 80px 0;
  background: #f3f5f5;
}

.tokenArea .body p {
  margin-bottom: 48px;
  font-size: 16px;
}

.tokenArea .body .img {
  text-align: center;
  transition: all 0.4s ease;
}

.tokenArea .body .graph {
  transition: all 0.4s ease;
}

.tokenArea .body .graph li {
  float: right;
  width: 370px;
  color: #484c4d;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
}

.tokenArea .body .graph li:first-child {
  float: left;
  color: #28b9b9;
}

.tokenArea .body .graph img {
  margin-bottom: 24px;
}

.tokenArea .body .graph .min {
  font-size: 12px;
}

.tokenArea .encryption {
  transition: all 0.4s ease;
}

.tokenArea .encryption .item {
  position: relative;
  padding: 30px 40px 30px 210px;
}

.tokenArea .encryption .item.token {
  background: #c2f2f2;
  color: #007780;
}

.tokenArea .encryption .item:last-child {
  border-top: 1px solid #ddd;
}

.tokenArea .encryption .item p {
  margin: 0;
  font-size: 14px;
}

.tokenArea .encryption .item h3 {
  position: absolute;
  top: 30px;
  left: 40px;
  font-size: 16px;
  font-weight: bold;
}

.tokenArea .encryption .item.token h3 {
  color: #ff7300;
}

.tokenArea .encryption .item .num {
  margin-bottom: 16px;
}

#footer.token .h {
  display: flex;
  text-align: left;
  align-items: center;
}

#footer.token .h .logo {
  margin-right: 16px;
}

#footer.token .contactSection li {
  text-align: left;
}

.tokenArea .mb80 {
  margin-bottom: 80px;
}

@media only screen and (max-width: 1023px) {
  .tokenArea .body .graph li {
    width: 48%;
  }
}

@media only screen and (max-width: 767px) {
  .tokenArea .tokenSection {
    padding: 40px 0;
  }

  .tokenArea .tokenSection h2 {
    margin-bottom: 24px;
    font-size: 16px;
  }

  .tokenArea .tokenSection h2 .cl07 {
    font-size: 16px;
  }

  .tokenArea .tokenSection .itemGroup {
    width: auto;
  }

  .tokenArea .tokenSection .item {
    display: table;
    float: none;
    width: auto;
    text-align: left;
  }

  .tokenArea .tokenSection .item .img {
    display: table-cell;
    width: 72px;
    padding-right: 16px;
  }

  .tokenArea .tokenSection .item p {
    display: table-cell;
    vertical-align: middle;
  }

  .tokenArea .summary {
    padding: 40px 0;
    font-size: 14px;
  }

  .tokenArea .summary ul {
    width: auto;
  }

  .tokenArea .head {
    padding: 24px 0;
    font-size: 14px;
  }

  .tokenArea .head h2 {
    font-size: 18px;
  }

  .tokenArea .body {
    padding: 40px 0 64px 0;
  }

  .tokenArea .encryption .item {
    padding: 16px;
  }

  .tokenArea .encryption .item h3 {
    position: static;
    margin-bottom: 8px;
    text-align: center;
  }

  .tokenArea .body p {
    margin-bottom: 24px;
    font-size: 14px;
  }

  .tokenArea .body .graph li {
    float: none !important;
    width: auto;
    margin-bottom: 16px;
    font-size: 14px;
    text-align: center;
  }

  .tokenArea .body .graph img {
    margin-bottom: 8px;
  }
}



/* ------------------------ callcenter */
.callcenter .btn {
  margin-top: 32px;
  width: 280px;
  height: 60px;
  border-radius: 30px;
  overflow: hidden;
}

.callcenter .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ff7300;
  color: #fff;
  width: 100%;
  height: 100%;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.callcenter .btn a .ico {
  margin-right: 16px;
}

.callcenterArea .column2 .column {
  float: left;
  width: 47.9%;
  margin-left: 4.1%;
  box-sizing: border-box;
}

.callcenterArea .column3 .column {
  float: left;
  width: 30.5%;
  margin-left: 4.1%;
  box-sizing: border-box;
}

.callcenterArea .column4 .column {
  float: left;
  width: 21.8%;
  margin-left: 4.1%;
  box-sizing: border-box;
}

.callcenterArea .column2 .column:first-child,
.callcenterArea .column3 .column:first-child,
.callcenterArea .column4 .column:first-child {
  margin-left: 0;
}

.callcenterArea .section .img {
  text-align: center;
}

.callcenterArea .section>.head {
  padding: 40px 0;
  text-align: center;
  background: #00aeff;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.callcenterArea .section>.head h2 {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.callcenterArea .section>.body {
  padding: 56px 0 80px 0;
  background: #f3f5f5;
}

.callcenterArea .about {
  padding: 56px 0;
  background: #c2e7f7;
}

.callcenterArea .about .aboutBlock {
  display: table;
  width: 100%;
  margin-bottom: 54px;
}

.callcenterArea .about .aboutBlock .ico {
  display: table-cell;
  width: 67px;
  padding-right: 40px;
  vertical-align: middle;
}

.callcenterArea .about .aboutBlock .body {
  display: table-cell;
  position: relative;
  padding-left: 40px;
  border-left: 1px solid #5a5e5e;
  font-size: 16px;
  vertical-align: middle;
}

.callcenterArea .about .aboutBlock .bt {
  position: absolute;
  bottom: 0;
  right: 0;
  padding: 0 8px 0 24px;
  border-radius: 4px;
  background: #5a5e5e;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  line-height: 24px;
  cursor: pointer;
}

.callcenterArea .about .aboutBlock .bt:after {
  content: '';
  position: absolute;
  left: 8px;
  top: 10px;
  border: 4px solid transparent;
  border-top: 4px solid #fff;
}

.callcenterArea .about .detailBlock {
  background: #fff;
}

.callcenterArea .about .detailBlock table {
  width: 100%;
  border-collapse: collapse;
}

.callcenterArea .about .detailBlock table th {
  padding: 16px 24px;
  border: 1px solid #c2e7f7;
  background: #007ab3;
  color: #fff;
  font-size: 16px;
  text-align: center;
  white-space: nowrap;
}

.callcenterArea .about .detailBlock table td {
  padding: 16px 24px;
  border: 1px solid #c2e7f7;
  font-size: 16px;
  vertical-align: top;
}

.callcenterArea .about .detailBlock .detail {
  display: table-cell;
  min-width: 210px;
  border-left: 1px solid #eee;
}

.callcenterArea .about .detailBlock .detail:first-child {
  border-left: none;
}

.callcenterArea .about .detailBlock .h {
  background: #007ab3;
  color: #fff;
  font-size: 16px;
  text-align: center;
  line-height: 48px;
  white-space: normal;
}

.callcenterArea .about .detailBlock .body {
  padding: 16px 24px;
  background: #fff;
  font-size: 16px;
  text-align: center;
}

.callcenterArea .about .detailBlock .min {
  display: block;
  color: #999;
  font-size: 12px;
}

.callcenterArea .card {
  padding: 32px 0 80px 0;
}

.callcenterArea .card h2 {
  margin-bottom: 32px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .card .column {
  padding: 32px 40px;
  background: #ccefff;
}

.callcenterArea .card h3 {
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .card .ico {
  float: left;
  width: 80px;
}

.callcenterArea .card .body {
  padding-left: 104px;
}

.callcenterArea .client {
  padding: 48px 0 64px 0;
  background: #007ab3;
  color: #fff;
}

.callcenterArea .client .column {
  padding: 0 16px;
}

.callcenterArea .client h2 {
  margin-bottom: 48px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .client h2 .cl03 {
  font-size: 28px;
}

.callcenterArea .client .ico {
  width: 100px;
  margin: 0 auto 16px auto;
}

.callcenterArea .client h3 {
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

.callcenterArea .example {
  padding: 0 0 56px 0;
}

.callcenterArea .example h2 {
  margin-bottom: 56px;
  padding: 40px 24px;
  background: #00aeff;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .answer {
  background: #fff;
}

.callcenterArea .answer .layout {
  max-width: 780px;
}

.callcenterArea .answer>.layout {
  max-width: 960px;
}

.callcenterArea .answer>.layout h3 {
  margin-bottom: 32px;
  margin-top: 56px;
  font-size: 20px;
  font-weight: bold;
  text-align: center
}

.callcenterArea .answer>.layout .column2 {
  margin-bottom: 56px;
}

.callcenterArea .answer>.layout .column {
  float: left;
  width: 47.9%;
  margin-left: 4.1%;
  padding: 32px 40px;
  box-sizing: border-box;
  background: #ccefff;
}

.callcenterArea .answer>.layout .column:first-child {
  margin-left: 0;
}

.callcenterArea .answer>.layout .column .num {
  margin-bottom: 16px;
  color: #00aeff;
  font-size: 40px;
  font-weight: bold;
  text-align: center;
  line-height: 1.1;
}

.callcenterArea .answer>.layout .column .h {
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

.callcenterArea .answer>h2 {
  margin-bottom: 56px;
  padding: 40px 24px;
  background: #00aeff;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .answer .img {
  margin-bottom: 64px;
}

.callcenterArea .answer .answerBlock {
  position: relative;
  padding: 64px 0;
  background: #007ab3;
  color: #fff;
  font-size: 20px;
  text-align: center;
}

.callcenterArea .answer .answerBlock:after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.callcenterArea .answer .answerBlock h2 {
  margin-bottom: 24px;
  font-size: 34px;
  font-weight: bold;
}

.callcenterArea .feature {
  padding: 0 0 72px 0;
  background: #c2e7f7;
  text-align: center;
}

.callcenterArea .feature .cl04 {
  font-size: 16px;
  font-weight: bold;
}

.callcenterArea .feature h2 {
  margin-bottom: 48px;
  padding: 40px 24px;
  background: #00aeff;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.callcenterArea .feature .column .img {
  padding: 0 0px;
}

.callcenterArea .feature .column p {
  margin-top: 24px;
  font-size: 13px;
}

.callcenterArea .feature .column a {
  color: #00aeff;
}

.callcenterArea .feature .column a.arw:after {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 8px;
  box-sizing: border-box;
  border-right: 1px solid #28b9b9;
  border-top: 1px solid #28b9b9;
  -webkit-transform-origin: center center;
  -webkit-transform: rotate(45deg);
  transform-origin: center center;
  transform: rotate(45deg);
}

.callcenterArea .comparison {
  font-size: 16px;
  text-align: center;
}

.callcenterArea .comparison .column2 {
  margin-bottom: 56px;
}

.callcenterArea .pcidss .aboutBlock .layout,
.callcenterArea .pcidss .requirementBlock .layout {
  max-width: 780px;
}

.callcenterArea .pcidss .aboutBlock {
  padding: 56px 0;
  background: #5a5e5e;
  color: #fff;
  font-size: 16px;
}

.callcenterArea .pcidss .aboutBlock h2 {
  margin-bottom: 32px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .pcidss .requirementBlock {
  padding: 32px 0 56px 0;
  color: #007ab3
}

.callcenterArea .pcidss .requirementBlock h3 {
  margin-bottom: 16px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.callcenterArea .pcidss .requirementBlock table {
  margin-bottom: 40px;
  border-top: 1px solid #ddd;
}

.callcenterArea .pcidss .requirementBlock th {
  width: 120px;
  padding: 8px 16px;
  border-bottom: 1px solid #ddd;
  font-weight: normal;
  text-align: left;
}

.callcenterArea .pcidss .requirementBlock .num {
  margin-left: 8px;
  font-weight: bold;
}

.callcenterArea .pcidss .requirementBlock td {
  padding: 8px 0;
  border-bottom: 1px solid #ddd;
}

.callcenterArea .pcidss .requirementBlock .note {
  padding: 24px 40px;
  background: #c2e7f7;
  color: #333;
  font-size: 16px;
}

.callcenterArea .pcidss .summaryBlock {
  position: relative;
  padding: 48px 0;
  background: #007ab3;
  color: #fff;
  font-size: 16px;
  text-align: center;
}

.callcenterArea .pcidss .summaryBlock:after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.callcenterArea .pcidss .summaryBlock .layout {
  max-width: 900px;
}

.callcenterArea .pcidss .summaryBlock h2 {
  margin-bottom: 32px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.callcenterArea .pcidss .summaryBlock .boxGroup {
  border: 4px solid #61cbfb;
  margin-bottom: 40px;
  background: #40c2ff;
  text-align: left;
}

.callcenterArea .pcidss .summaryBlock .boxGroup .box {
  float: left;
  width: 50%;
  padding: 24px 56px;
  box-sizing: border-box;
  background: #fff;
  color: #333;
}

.callcenterArea .pcidss .summaryBlock .boxGroup .box:first-child {
  background: #40c2ff;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  .callcenter .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .callcenter .btn a {
    font-size: 16px;
  }

  .callcenter .btn .ico {
    width: 21px;
    margin-right: 10px;
  }

  .callcenterArea .column2 .column,
  .callcenterArea .column3 .column,
  .callcenterArea .column4 .column {
    float: none;
    width: auto;
    margin: 0 0 24px 0;
  }

  .callcenterArea .section>.head {
    padding: 24px 0;
    font-size: 14px;
  }

  .callcenterArea .section>.head h2 {
    font-size: 16px;
  }

  .callcenterArea .section>.body {
    padding: 40px 0;
  }

  .callcenterArea .about {
    padding: 40px 0;
  }

  .callcenterArea .about .aboutBlock .ico {
    display: none;
  }

  .callcenterArea .about .aboutBlock .body {
    display: block;
    padding: 0;
    border: none;
    font-size: 14px;
  }

  .callcenterArea .about .aboutBlock .bt {
    display: inline-block;
    position: relative;
    margin-top: 16px;
  }

  .callcenterArea .about .detailBlock {
    overflow: auto;
  }

  .callcenterArea .about .detailBlock table {
    width: 720px;
  }

  .callcenterArea .about .detailBlock table th {
    padding: 8px;
    font-size: 14px;
  }

  .callcenterArea .about .detailBlock table td {
    padding: 8px;
    font-size: 14px;
  }

  .callcenterArea .about .detailBlock .h {
    font-size: 14px;
    line-heigt: 24px;
  }

  .callcenterArea .about .detailBlock .body {
    padding: 16px;
    font-size: 14px;
    text-align: left;
  }

  .callcenterArea .card {
    padding: 40px 0;
  }

  .callcenterArea .card h2 {
    margin-bottom: 16px;
    font-size: 16px;
  }

  .callcenterArea .card .column {
    padding: 16px;
  }

  .callcenterArea .card h3 {
    margin-bottom: 24px;
    font-size: 14px;
  }

  .callcenterArea .card .ico {
    width: 48px;
  }

  .callcenterArea .card .body {
    padding-left: 64px;
  }

  .callcenterArea .client {
    padding: 40px 0;
  }

  .callcenterArea .client h2 {
    margin-bottom: 24px;
    font-size: 16px;
  }

  .callcenterArea .client h2 .cl03 {
    font-size: 20px;
  }

  .callcenterArea .client .column {
    display: table;
  }

  .callcenterArea .client .ico {
    display: table-cell;
    width: 64px;
    padding-right: 16px;
  }

  .callcenterArea .client h3 {
    margin-bottom: 8px;
    font-size: 14px;
    text-align: left;
  }

  .callcenterArea .example {
    padding: 0 0 40px 0;
  }

  .callcenterArea .example h2 {
    padding: 24px 16px;
    margin-bottom: 24px;
    font-size: 16px;
  }

  .callcenterArea .answer h2 {
    padding: 24px 16px;
    margin-bottom: 24px;
    font-size: 16px;
  }

  .callcenterArea .answer .img {
    margin-bottom: 40px;
  }

  .callcenterArea .answer>.layout h3 {
    margin: 24px 0;
    font-size: 16px;
  }

  .callcenterArea .answer>.layout .column {
    float: none;
    width: 100%;
    margin: 0 0 24px 0;
    padding: 16px;
  }

  .callcenterArea .answer>.layout .column .num {
    font-size: 24px;
  }

  .callcenterArea .answer>.layout .column .h {
    font-size: 14px;
  }

  .callcenterArea .answer .answerBlock {
    padding: 40px 0;
    font-size: 14px;
  }

  .callcenterArea .answer .answerBlock h2 {
    margin-bottom: 16px;
    font-size: 16px;
  }

  .callcenterArea .feature {
    padding: 0 0 40px 0;
  }

  .callcenterArea .feature .cl04 {
    font-size: 14px;
  }

  .callcenterArea .feature h2 {
    margin-bottom: 24px;
    padding: 24px 16px;
    font-size: 16px;
  }

  .callcenterArea .feature .column {
    margin-bottom: 64px;
  }

  .callcenterArea .feature .column .img {
    padding: 0 48px;
  }

  .callcenterArea .feature .column:nth-child(odd) {
    margin-left: 0;
  }

  .callcenterArea .pcidss .aboutBlock {
    padding: 40px 0;
    font-size: 14px;
  }

  .callcenterArea .pcidss .aboutBlock h2 {
    margin-bottom: 24px;
    font-size: 16px;
  }

  .callcenterArea .pcidss .requirementBlock {
    padding: 40px 0;
  }

  .callcenterArea .pcidss .requirementBlock th {
    display: block;
    width: auto;
    padding: 8px 0 4px 0;
    border-bottom: none;
  }

  .callcenterArea .pcidss .requirementBlock td {
    display: block;
    padding: 4px 0 8px 0;
  }

  .callcenterArea .pcidss .requirementBlock .note {
    padding: 16px;
    font-size: 14px;
  }

  .callcenterArea .pcidss .summaryBlock {
    font-size: 14px;
  }

  .callcenterArea .pcidss .summaryBlock h2 {
    margin-bottom: 16px;
    font-size: 16px;
  }

  .callcenterArea .pcidss .summaryBlock .boxGroup .box {
    float: none;
    width: auto;
    padding: 16px;
  }

  .callcenterArea .comparison {
    font-size: 14px;
  }

  .callcenterArea .comparison .column2 {
    margin-bottom: 24px;
  }
}


/* ------------------------ privacy */
.privacyArea {
  padding: 60px 0;
  font-size: 13px;
}

.privacyArea .head {
  margin-bottom: 60px;
  padding-left: 25px;
  border-left: solid 2px #00bfcc;
}

.privacyArea .head h1 {
  margin-bottom: 18px;
  font-size: 18px;
  font-weight: bold;
}

.privacyArea .body .section {
  margin-bottom: 50px;
}

.privacyArea .body .section h2 {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 2px solid #c3c7c7;
  font-size: 16px;
  font-weight: bold;
}

.privacyArea .txtRight {
  font-size: 12px;
}

@media only screen and (max-width: 767px) {
  .privacyArea {
    padding: 40px 0;
  }

  .privacyArea .head {
    margin-bottom: 40px;
    padding-left: 16px;
  }

  .privacyArea .head h1 {
    margin-bottom: 16px;
    font-size: 16px;
  }

  .privacyArea .body .section {
    margin-bottom: 40px;
  }
}



/* ------------------------ news */
.news_list {
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e6e6e6;
}

.news_list li {
  margin-bottom: 8px;
  font-family: 'Roboto';
  font-size: 15px;
  font-weight: 700;
}

.news_list li:after {
  content: '';
  display: block;
  clear: both;
}

.news_list li .nTitle {
  float: right;
  display: block;
  width: 690px;
  margin-left: 30px;
  padding-left: 24px;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: normal;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  letter-spacing: 0.05em;
}

.news_list li .pdf {
  background: url(/img/ico_pdf.png) no-repeat left top;
}

@media only screen and (max-width: 1023px) {
  .news_list {
    padding: 0 24px 20px 24px;
  }

  .news_list li {
    margin-bottom: 16px;
  }

  .news_list li .nTitle {
    float: none;
    width: auto;
    margin-left: 0;
  }
}

@media only screen and (max-width: 767px) {
  .news_list {
    padding: 0 16px 20px 16px;
  }
}


/* ------------------------ blog */
.blogHead {
  background: url(/img/bg_main.jpg) right center;
}

.blogHead .inner {
  padding: 47px 0 42px 0;
  background: url(/img/bg_mainwrap.jpg) no-repeat right center;
}

.blogHead .h {
  overflow: hidden;
  width: 387px;
  height: 121px;
  margin: 0;
  padding: 0;
  background: url(/img/text_h_blog.png) no-repeat;
  text-indent: 100%;
  white-space: nowrap;
}

#content_inner {
  width: 800px;
  margin: 0 auto;
  padding: 60px 0 75px 0;
}

.blog_item {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e6e6e6;
}

.blog_item .date {
  float: left;
  width: 110px;
  font-weight: bold;
}

.blog_item .body {
  float: right;
  width: 656px;
  padding: 0px 0px 0px 32px;
  border-left: 2px solid #00bfcc;
}

.blog_item h2 {
  margin-bottom: 8px;
  font-size: 18px;
}

.blog_item h2 a {
  color: #333;
  font-weight: bold;
  text-decoration: none;
}

.blog_item p {
  margin-bottom: 20px;
}

.blog_item .more {
  margin-bottom: 5px;
}

.blog_item .more a {
  display: inline-block;
  position: relative;
  padding-left: 10px;
  color: #00bfcc;
  text-decoration: none;
  line-height: 1;
}

.blog_item .more a:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -6px;
  border: 4px solid transparent;
  border-left: 4px solid #00bfcc;
}

.blog_item .tagGroup {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 13px;
}

.blog_item .tagGroup .tag a {
  display: block;
  white-space: nowrap;
  line-height: 1;
  font-size: 12px;
  padding: 7px 8px;
  border-radius: 13px;
  border: 1px solid #28b9b9;
  transition: all 0.4s ease;
  font-weight: 600;
}

.bt_top,
.bt_prev {
  text-align: center;
}

.bt_top .bt,
.bt_prev .bt {
  display: inline-block;
  width: 192px;
  font-size: 14px;
  font-weight: bold;
  line-height: 42px;
}

#h_group {
  padding: 30px 0px;
  background: #007780;
  color: #fff;
}

#h_group .h_group_inner {
  width: 800px;
  margin: 0px auto;
}

#h_group .top {
  margin-bottom: 24px;
}

#h_group .dateGroup {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
}

#h_group .top .tagGroup {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

#h_group .top .tagGroup .tag a {
  display: block;
  white-space: nowrap;
  line-height: 1;
  font-size: 12px;
  padding: 7px 8px;
  border-radius: 13px;
  border: 1px solid #fff;
  transition: all 0.4s ease;
  font-weight: 600;
  color: #fff;
}

#h_group .date {
  display: flex;
  gap: 6px;
  align-items: center;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
}

#h_group .date .ico {
  width: 16px;
  height: 16px;
  transform: translateY(-1px);
}

#h_group h1 {
  font-size: 24px;
  font-weight: bold;
}

.article {
  margin-bottom: 40px;
}

/* lwptoc */
#contents .lwptoc_i {
  padding: 28px 8% 32px;
  background: #f8f8f8;
}

#contents .lwptoc_header {
  text-align: center;
}

#contents .lwptoc_title {
  display: inline-block;
  padding: 0 5px 6px;
  border-bottom: 2px solid #28b9b9;
  color: #28b9b9;
  font-size: 18px;
  font-weight: 700;
}

#contents .lwptoc_title::before {
  content: "";
  display: inline-block;
  position: relative;
  top: -2px;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  background: url(/img/ico_toc.svg) no-repeat center / cover;
  vertical-align: middle;
}

#contents .lwptoc_item a {
  display: flex;
  align-items: flex-start;
  padding: 5px 0;
  border-bottom: 1px dashed #cfd8dc !important;
  color: #333;
  font-size: 16px;
}

#contents .lwptoc_item_number {
  margin-right: 12px;
  color: #28b9b9;
  font-size: 20px;
  font-weight: 700;
  font-family: 'Roboto';
  line-height: 1.4;
}

#contents .lwptoc_itemWrap .lwptoc_itemWrap {
  margin: 0 0 0 24px;
}

#contents .lwptoc_itemWrap .lwptoc_itemWrap a {
  padding: 7px 0;
  font-size: 14px;
}

#contents .lwptoc_itemWrap .lwptoc_itemWrap .lwptoc_item_number {
  font-size: 16px;
  line-height: 1.5;
}

.article {
  counter-reset: h2Num;
}

.article h2 {
  margin-bottom: 20px;
  padding-left: 17px;
  border-left: 2px solid #00bfcc;
  font-size: 20px;
  /* font-weight: bold; */
}

.article h3 {
  margin-bottom: 18px;
  font-size: 18px;
}

.article h2.is-numActive {
  counter-reset: nestedNum;
}

.article h2.is-numActive::before,
.article h3.is-numActive::before {
  display: inline-block;
  margin-right: 16px;
  color: #28b9b9;
  font-weight: 700;
  font-family: 'Roboto';
}

.article h2.is-numActive::before {
  counter-increment: h2Num;
  content: counter(h2Num);
  font-size: 24px;
}

.article h3.is-numActive::before {
  counter-increment: nestedNum;
  content: counter(h2Num) "."counter(nestedNum);
  font-size: 20px;
}

.article p {
  margin-bottom: 25px;
}

.article iframe {
  max-width: 100%;
}

.snsBtn_u {
  margin-bottom: 39px;
}

.snsBtn_u li {
  float: left;
}

.snsBtn_u .twitter {
  width: 100px;
}

.snsBtn_u .facebook {
  margin-right: 10px;
}

.snsBtn_u .gplus {
  width: 70px;
}

.snsBtn_u .hatebu {
  width: 50px;
}

.shareGroup {
  margin-bottom: 40px;

}

.shareGroup li {
  display: inline-block;
  padding-right: 8px;
  vertical-align: top;
}

.facebookBox .inner {
  display: table;
  width: 100%;
  margin-bottom: 40px;
  background: #484c4d;
  color: #fff;
}

.facebookBox .img {
  display: table-cell;
  width: 50%;
  background: url(/img/img_fb.jpg) no-repeat center center;
  background-size: cover;
}

.facebookBox .body {
  display: table-cell;
  width: 50%;
  padding: 24px;
  text-align: center;
  vertical-align: middle;
}

.facebookBox .body .h {
  margin-bottom: 16px;
  font-size: 18px;
  line-height: 1.3;
}

.facebookBox .body .note {
  margin-top: 16px;
  font-size: 12px;
}

.blogIndexBanner {
  max-width: 960px;
  margin: 0 auto;
  padding: 24px 24px 0;
}

.blogIndexBanner img {
  box-shadow: -1px 1px 2px 0px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
}

@media only screen and (min-width: 768px) {
  .blogIndexBanner a:hover {
    opacity: 1;
  }

  .blogIndexBanner img {
    transition: .5s ease;
  }

  .blogIndexBanner a:hover img {
    transform: scale(1.05);
  }
}

@media only screen and (max-width: 1023px) {
  .blog_item {
    margin: 0 24px 30px 24px;
  }

  .blog_item .date {
    width: 16%;
  }

  .blog_item .body {
    width: 84%;
    box-sizing: border-box;
  }

  #h_group .h_group_inner {
    width: auto;
    margin: 0 24px;
  }

  .article {
    margin-bottom: 24px;
    padding: 0 24px;
  }

  .shareGroup {
    margin-bottom: 24px;
    padding: 0 0 0 24px;
  }

  .shareGroup li {
    padding: 0 8px 8px 0;
  }

  .facebookBox {
    padding: 0 24px;
  }
}

@media only screen and (max-width: 767px) {
  .blog_item {
    margin: 0 16px 16px 16px;
    padding-bottom: 16px;
  }

  .blog_item .date {
    float: none;
    width: auto;
    margin-bottom: 0;
  }

  .blog_item .body {
    float: none;
    width: auto;
    padding: 0;
    border: none;
  }

  .blog_item h2 {
    margin-bottom: 4px;
    font-size: 16px;
  }

  #h_group {
    padding: 24px 0;
  }

  #h_group .h_group_inner {
    margin: 0 16px;
  }

  #h_group .date {
    font-size: 14px;
  }

  #h_group .date .ico {
    width: 14px;
    height: 14px;
  }

  #h_group h1 {
    font-size: 18px;
  }

  .article {
    margin-bottom: 24px;
    padding: 0 16px;
  }

  /* lwptoc */
  #contents .lwptoc_i {
    padding: 20px 16px;
  }

  #contents .lwptoc_title {
    font-size: 16px;
  }

  #contents .lwptoc_title::before {
    top: -1px;
    width: 20px;
    height: 20px;
  }

  #contents .lwptoc_item a {
    font-size: 14px;
  }

  #contents .lwptoc_item_number {
    font-size: 18px;
  }

  #contents .lwptoc_itemWrap .lwptoc_itemWrap {
    margin: 0 0 0 22px;
  }

  #contents .lwptoc_itemWrap .lwptoc_itemWrap a {
    font-size: 12px;
  }

  #contents .lwptoc_itemWrap .lwptoc_itemWrap .lwptoc_item_number {
    font-size: 14px;
  }

  .article h2 {
    font-size: 16px;
  }

  .article h3 {
    font-size: 14px;
  }

  .article h2.is-numActive::before {
    font-size: 20px;
  }

  .article h3.is-numActive::before {
    font-size: 18px;
  }

  .shareGroup {
    margin-bottom: 16px;
    padding: 0 0 0 16px;
  }

  .facebookBox {
    padding: 0 16px;
  }

  .facebookBox .inner {
    display: blcok;
    margin-bottom: 16px;
  }

  .facebookBox .img {
    display: none;
  }

  .facebookBox .body {
    display: block;
    width: 100%;
    padding: 16px;
    box-sizing: border-box;
  }

  .facebookBox .body .h {
    margin-bottom: 8px;
    font-size: 16px;
  }

  .facebookBox .body .note {
    margin-top: 8px;
  }

  .blogIndexBanner {
    padding: 16px 16px 0;
  }
}



/* ------------------------ form */
.big_title_contact {
  width: 630px;
  min-height: 140px;
  margin: 0 auto 60px auto;
  padding: 20px;
  box-sizing: border-box;
  background: url(/img/contact_head.png) no-repeat top left;
  line-height: 1.5;
}

.big_title_contact h2 {

  margin: 0 0 10px 0;
  font-size: 18px;
  font-weight: 900;
}

.big_title_contact span {
  font-size: 13px;
}

#formList {
  width: 630px;
  margin: 0 auto 42px auto;
}

#formList dt {
  position: relative;
  float: left;
  clear: both;
  font-size: 13px;
  width: 205px;
  height: 32px;
  padding-bottom: 7px;
}

#formList dt:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 32px;
  background: #28b9b9;
}

#formList dt .title {
  display: block;
  height: 32px;
  margin: 0 0 0 12px;
  padding: 0 0 7px 0;
}

.checkList dt .title {
  display: block;
  height: 32px;
  margin: 0 0 0 10px;
  padding: 0 0 7px 0;
}

#formList dt.last-child {
  margin-bottom: 0;
}

#formList .requisite {
  color: #cc0000;
}

#formList .act {
  font-size: 11px !important;
  display: block;
  color: #636666;
}

#formList dd {
  padding: 0 0 16px 205px;
  margin-bottom: 8px;
}

#formList dt.last-child,
#formList dd.last-child {
  margin-bottom: 0 !important;
}

.eq-ie7 #formList dd {
  margin-bottom: 1px;
  display: block;
}

.checkList #formList dt {
  margin-bottom: 16px;
}

.checkList #formList dd {
  margin-bottom: 16px;
  padding-bottom: 32px;
}

.detailsDd {
  height: auto !important;
}

.privacy {
  clear: both;
  text-align: center;
  font-size: 13px;
}

.privacy a {
  color: #00bfcc;
  text-decoration: none;
}

.privacy a:hover {
  color: #00bfcc;
  text-decoration: underline;
}

#formList input,
#formList textarea {
  background: #f3f5f5;
  border: solid 1px #c3c7c7;
  line-height: 1;
  padding: 8px 10px;
  width: 403px;
}

#formList input.focus,
#formList textarea.focus {
  color: #333333;
}

#formList textarea {
  height: 100px;
  vertical-align: top;
}

input[type="text"],
input[type="password"],
textarea,
select {
  outline: none;
}

.err {
  border: solid 1px #cc0000 !important;
}

.err_msg {
  color: #cc0000;
  font-size: 11px;
  margin: -22px 0 0 8px;
  padding-bottom: 8px !important;
}

#tel {
  width: 167px !important;
}

#code {
  width: 108px !important;
}

#shadow {
  width: 100%;
  margin: 35px auto 0 auto;
  padding: 30px 0 0 0;
  text-align: center;
  background: url(/img/bg_shadow.png) 0 0 no-repeat;
}

#shadow button,
#shadow input,
#shadow a {
  display: inline-block;
  margin: 0 10px;
}

#shadow .last-child {
  margin-right: 0;
}

#shadow .cancel {
  display: inline-block;
  width: 192px;
  border-radius: 3px;
  background: #a3a5a6;
  background: linear-gradient(#a3a5a6, #979a9a);
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 48px;
}

#shadow a {
  display: inline-block;
  width: 192px;
  border: none;
  font-size: 14px;
  font-weight: bold;
  line-height: 48px;
}

#shadow button {
  display: inline-block;
  width: 192px;
  height: 48px;
  border: none;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.4s ease;
}

/* チェックボックスに応じて「確認画面へ」の状況を入れ替え（処理は /js/check.js に記載）
 Sugawara,2022/3/30
 **/

#shadow button[disabled] {
  cursor: default;
  background: rgba(51, 189, 189, 0.5);
  ;
  color: #fff;
}

.thank_msg {
  text-align: center;
}

.thank_msg h2 {
  margin: 0 0 70px 0;
  font-size: 20px;
  font-weight: 900;
}

.thank_msg p {
  text-align: left;
  font-weight: 900;
  display: inline-block;
  margin-bottom: 50px;
  line-height: 1.8;
}

.eq-ie7 .thank_msg p {
  display: inline;
  zoom: 1;
}

label.chk {
  text-align: left;
}

label.chk input {
  width: auto !important;
  margin-right: 8px;
}

@media only screen and (max-width: 1023px) {
  #content_inner {
    width: auto;
  }
}

@media only screen and (max-width: 767px) {
  #content_inner {
    padding: 40px 0;
  }

  .big_title_contact {
    width: auto;
    min-height: 0;
    margin: 0 16px 40px 16px;
    padding: 16px;
    background: #d5eff5;
  }

  .big_title_contact h2 {
    font-size: 16px;
  }

  #formList {
    width: auto;
    margin: 0 16px 32px 16px;
  }

  #formList dt {
    float: none;
    width: auto;
    height: auto;
    margin-bottom: 8px;
    padding: 0;
    border-left: 2px solid #28b9b9;
  }

  #formList dt.last-child {
    margin-bottom: 8px !important;
  }

  #formList dt:after {
    display: none;
  }

  #formList dt .title {
    height: auto;
    padding: 0;
  }

  #formList dd {
    padding: 0 0 16px 0;
  }

  #formList input,
  #formList textarea {
    width: 100%;
    box-sizing: border-box;
  }

  .privacy {
    padding: 0 16px;
  }

  #shadow {
    background-position: center top;
  }

  #shadow button,
  #shadow input,
  #shadow a {
    margin: 0 auto 16px auto;
  }

  .checkList #formList dt {
    margin-bottom: 8px !important;
  }

  .checkList #formList dd {
    padding-bottom: 0;
    border: none;
  }

  .thank_msg h2 {
    margin: 0 0 32px 0;
    padding: 0 16px;
    font-size: 16px;
  }

  .thank_msg p {
    margin: 0;
    padding: 0 16px;
  }
}



/* ------------------------ zoom */
.js_zoom {
  position: relative;
}

.js_zoom .ico {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  padding: 8px;
  background: rgba(40, 185, 185, 0.8);
  color: #fff;
}

.js_zoom .ico i {
  font-size: 24px;
  vertical-align: middle;
}

.zoomBox {
  overflow: hidden;
  display: none;
  position: fixed;
  z-index: 9900;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.zoomBox:before {
  content: '';
  position: absolute;
  z-index: 9902;
  top: 16px;
  right: 24px;
  width: 2px;
  height: 24px;
  background: #28b9b9;
  -webkit-transform-origin: center;
  -webkit-transform: rotate(45deg);
  transform-origin: center;
  transform: rotate(45deg);
}

.zoomBox:after {
  content: '';
  position: absolute;
  z-index: 9902;
  top: 16px;
  right: 24px;
  width: 2px;
  height: 24px;
  background: #28b9b9;
  -webkit-transform-origin: center;
  -webkit-transform: rotate(-45deg);
  transform-origin: center;
  transform: rotate(-45deg);
}

.zoom {
  position: absolute;
  z-index: 9901;
  top: 0;
  left: 0;
  width: 160%;
}

.zoom img {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .js_zoom .ico {
    display: block;
  }
}

/* ------------------------ consulting */
.consulting {
  background: #fff;
}

.consulting .inner {
  background: url(/img/bg_consulting_01.jpg) no-repeat right top / cover;
}

.consulting p {
  font-weight: bold;
}

.consulting h1 {
  margin-bottom: 24px;
}

.consulting .btnArea {
  display: flex;
  gap: 24px;
}

.consulting .btn {
  margin-top: 32px;
  width: 280px;
  height: 60px;
  border-radius: 30px;
  overflow: hidden;
}

.consulting .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ff7300;
  color: #fff;
  width: 100%;
  height: 100%;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.consulting .btn a .ico {
  margin-right: 16px;
}

.consulting .btnArea .btn:last-of-type a {
  background: #28B9B9;
}

.consultingArea .example h2 {
  position: relative;
  padding: 40px 24px;
  background: #28b9b9;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.consultingArea .head {
  padding: 48px 0;
  text-align: center;
  color: #28b9b9;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
  position: relative;
}

.consultingArea .head:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.consultingArea .example ul li {
  position: relative;
  float: left;
  width: 220px;
  margin: 0 0 30px 30px;
  padding: 20px;
  box-sizing: border-box;
  background: #fff;
}

.consultingArea .example .bxWrap2 li {
  float: right;
  margin: 0 30px 30px 0;
}

.consultingArea .example .bxWrap1,
.consultingArea .example .bxWrap2,
.consultingArea .example .bxWrap3 {
  text-align: center;
}

.consultingArea .example ul li h3 {
  color: #007780;
  font-size: 15px;
  font-weight: bold;
}

.consultingArea .example .min p {
  margin: 0 auto 18px;
  width: 30px;
  height: 30px;
}

.consultingArea .example .bxWrap1 li:after,
.consultingArea .example .bxWrap3 li:after {
  content: "";
  position: absolute;
  top: 50px;
  right: -26px;
  width: 22px;
  height: 19px;
  background: url("/img/ico_consulting_09.png");
  background-size: contain;
}

.consultingArea .example .bxWrap1 li:last-child:after {
  content: "";
  position: absolute;
  top: 100%;
  right: 50%;
  margin-top: 5px;
  margin-right: -9px;
  width: 19px;
  height: 22px;
  background: url("/img/ico_consulting_10.png");
  background-size: contain;
}

.consultingArea .example .bxWrap2 li:after {
  content: "";
  position: absolute;
  top: 50px;
  left: -26px;
  width: 22px;
  height: 19px;
  background: url("/img/ico_consulting_11.png");
  background-size: contain;
}

.consultingArea .example .bxWrap2 li:last-child:after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-top: 5px;
  margin-left: -9px;
  width: 19px;
  height: 22px;
  background: url("/img/ico_consulting_10.png");
  background-size: contain;
}

.consultingArea .example .bxWrap3 li:last-child:after {
  content: none;
}

.consultingArea .example .layout .min {
  width: 720px;
  padding: 0;
}

.consultingArea .example .bxWrap1 li:first-child,
.consultingArea .example .bxWrap3 li:first-child {
  margin-left: 0;
}

.consultingArea .example .bxWrap2 li:first-child {
  margin-right: 0;
}

.consultingArea .cloudService {
  clear: both;
}

.consultingArea .cloudService .head:after {
  content: none;
}

.consultingArea .head h2 {
  color: #333;
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 0.1em;
}

.consultingArea .body {
  padding: 60px 0 80px 0;
  background: #f3f5f5;
}

.consultingArea .body p {
  font-size: 16px;
}

.consultingArea .leadSection {
  width: 81.25%;
  margin: 0 auto;
  padding: 0;
}

.consultingArea .leadSection p {
  margin-bottom: 60px;
  padding: 0 60px;
}

.consultingArea .boxWrap {
  display: flex;
  flex-wrap: wrap;
}

.consultingArea .box {
  width: 47.91%;
  margin-right: 4%;
  margin-bottom: 35px;
  background: #c2f2f2;
}

.consultingArea .body .bxTop {
  display: table-cell;
  width: 360px;
  height: 104px;
  padding-right: 20px;
  background-color: #007780;
  font-size: 20px;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.05em;
  vertical-align: middle;
}

.consultingArea .bxBottom {
  font-size: 16px;
  color: #333;
  padding: 20px 40px;
}

.consultingArea .box:nth-child(even) {
  margin-right: 0;
}

.consultingArea .bxTopLeft {
  display: table-cell;
  width: 100px;
  height: 104px;
  box-sizing: border-box;
  background-color: #007780;
  color: #fff;
  font-size: 14px;
  text-align: center;
  vertical-align: middle;
}

.consultingArea .column5 .layout {
  text-align: center;
  color: #007780;
}

.consultingArea .column5 .body {
  padding: 60px 0 35px 0;
}

.consultingArea .column5 .ico img {
  width: 100px;
  height: auto;
}

.consultingArea .column5 .column {
  display: inline-block;
  width: 260px;
  margin-bottom: 45px;
  font-weight: bold;
}

.consultingArea .column5 .column p {
  margin-top: 20px;
}

.consultingArea .cloudService .body {
  padding: 0 0 60px 0;
  background: #fff;
}

.consultingArea .bxTopLeft span {
  font-size: 36px;
  line-height: 1;
}

.consultingArea .cloudService .boxGroup {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  grid-gap: 12px;
}

.consultingArea .cloudService .box {
  width: 100%;
  position: relative;
  margin: 0;
  padding: 32px 32px 104px;
  box-sizing: border-box;
  color: #fff;
}

.consultingArea .cloudService .box h3 {
  /*display: table-cell;*/
  height: 64px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
  line-height: 1.3;
}

.consultingArea .cloudService .box h3 .logo {
  display: block;
  max-width: 248px;
  margin: 0 auto 8px;
}

.consultingArea .cloudService .box h3 .en {
  font-size: 18px;
}

.consultingArea .cloudService .blue {
  color: #1b41b3;
}

.consultingArea .cloudService .box a {
  display: block;
  width: calc(100% - 64px);
  max-width: 208px;
  position: absolute;
  bottom: 32px;
  left: 50%;
  border-radius: 3px;
  background: #fff;
  font-size: 14px;
  font-weight: bold;
  color: #28b9b9;
  text-align: center;
  line-height: 48px;
  transform: translateX(-50%);
}

.consultingArea .cloudService .box:first-child {
  background: #28b9b9;
  grid-column: 1/2;
  grid-row: 1/2;
}

.consultingArea .cloudService .box:nth-child(2) {
  background: #9D6DC4;
  grid-column: 2/3;
  grid-row: 1/2;
}

.consultingArea .cloudService .box:nth-child(3) {
  background: #007780;
  grid-column: 3/4;
  grid-row: 1/2;
}

.consultingArea .cloudService .box:nth-child(4) {
  background: #FF7A34;
  grid-column: 1/2;
  grid-row: 2/3;
}

.consultingArea .cloudService .box:nth-child(5) {
  background: #02AEFF;
  grid-column: 2/3;
  grid-row: 2/3;
}

.consultingArea .cloudService .box:nth-child(6) {
  background: #FF6666;
  grid-column: 3/4;
  grid-row: 2/3;
}

.consultingArea .bxFix1 a {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 2;
  width: 136px;
  margin-top: -65px;
  margin-right: -95px;
  padding: 20px 0 20px 20px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  border-radius: 4px 0 0 4px;
  background: #fe7a0c;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
}

.consultingArea .bxFix1 a:hover,
.consultingArea .bxFix2 a:hover {
  opacity: 1;
  margin-right: 0;
}

.consultingArea .bxFix2 a {
  position: fixed;
  top: 50%;
  right: 0;
  z-index: 2;
  width: 136px;
  margin-top: 5px;
  margin-right: -95px;
  padding: 20px 0 20px 20px;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
  border-radius: 4px 0 0 4px;
  background: #fe7a0c;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  line-height: 20px;
}

.consultingArea .bxFix1 i,
.consultingArea .bxFix2 i {
  margin-right: 23px;
  vertical-align: middle;
  line-height: 20px;
}

.consultingArea .flow {
  text-align: center;
}

@media only screen and (max-width: 980px) {

  .consultingArea .cloudService .box {
    /*	width: 50%;*/
    padding: 24px 24px 96px 24px;
  }

  .consultingArea .cloudService .box h3 {
    /*
	display: table-cell;
	margin-bottom: 16px;
*/
    font-size: 16px;
  }

  .consultingArea .cloudService .box a {
    bottom: 24px;
    padding: 0;
    font-size: 14px;
    line-height: 48px;
  }
}

@media only screen and (max-width: 767px) {
  .consulting .inner {
    padding: 42px 0 40px 0;
    background: url(/img/bg_consulting_sp.jpg) no-repeat right top !important;
    background-size: 320px !important;
  }

  .consulting h1 {
    margin-bottom: 40px;
    font-size: 18px
  }

  .consulting h1 br {
    display: block !important;
  }

  .consulting .inner p br {
    display: none;
  }

  .consulting .btnArea {
    flex-direction: column;
    gap: 0px;
  }

  .consulting .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .consulting .btn a {
    font-size: 16px;
  }

  .consulting .btn .ico {
    width: 21px;
    margin-right: 10px;
  }

  .consultingArea .body {
    padding: 40px 0 40px 0 !important;
  }

  .consultingArea .body p {
    font-size: 14px;
  }

  .consultingArea .leadSection {
    width: 100%;
  }

  .consultingArea .leadSection p {
    margin-bottom: 32px;
    padding: 0;
  }

  .consultingArea .service .leadSection p {
    margin-bottom: 16px;
  }

  .consultingArea .head {
    padding: 24px 0;
    font-size: 14px
  }

  .consultingArea .head h2 {
    font-size: 18px;
  }

  .consultingArea .example .layout .min {
    width: 100%;
  }

  .consultingArea .example h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .consultingArea .example ul {
    margin: 0 auto;
    width: 100%;
  }

  .consultingArea .example ul li {
    margin-left: 0;
    padding: 16px;
    width: 100%;
  }

  .consultingArea .example .bxWrap2 li {
    float: left;
  }

  .consultingArea .example .bxWrap1 li:after,
  .consultingArea .example .bxWrap1 li:last-child:after,
  .consultingArea .example .bxWrap3 li:after {
    content: "";
    position: absolute;
    top: 100%;
    right: 50%;
    width: 19px;
    height: 22px;
    margin: 5px -9px 0 0;
    background: url(/img/ico_consulting_10.png) no-repeat;
    background-size: contain;
  }

  .consultingArea .example .bxWrap2 li:after,
  .consultingArea .example .bxWrap2 li:last-child:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    width: 19px;
    height: 22px;
    margin: 5px 0 0 -9px;
    background: url(/img/ico_consulting_10.png) no-repeat;
    background-size: contain;
  }

  .consultingArea .example ul li h3 {
    display: table-cell;
    padding-left: 16px;
  }

  .consultingArea .example .min p {
    display: table-cell;
  }

  .consultingArea .boxWrap {
    flex-direction: column;
  }

  .consultingArea .boxWrap .box {
    margin: 24px auto 0;
    width: 100%;
    max-width: 460px;
  }

  .consultingArea .boxWrap .box:first-child {
    margin-top: 0;
  }

  .consultingArea .bxWrap3 ul li:last-child {
    margin: 0;
  }

  .consultingArea .bxTopLeft {
    height: 64px;
  }

  .consultingArea .body .bxTop {
    height: 64px;
    font-size: 16px;
  }

  .consultingArea .bxTopLeft span {
    font-size: 24px;
  }

  .consultingArea .bxBottom {
    padding: 16px 20px;
  }

  .consultingArea .cloudService .body {
    padding: 0 0 40px 0 !important;
  }

  .consultingArea .cloudService ul {
    flex-direction: column;
  }

  .consultingArea .cloudService .boxGroup {
    display: block;
  }

  .consultingArea .cloudService .box {
    width: 100%;
    padding: 24px 24px 96px 24px;
    margin-bottom: 16px;
  }

  .consultingArea .cloudService .box:last-of-type {
    margin-bottom: 0;
  }

  .consultingArea .cloudService .box h3 {
    display: block;
    height: auto;
    margin-bottom: 16px;
    font-size: 16px;
  }

  .consultingArea .cloudService .box a {
    bottom: 24px;
    padding: 0;
    font-size: 14px;
    line-height: 48px;
  }

  .consultingArea .column5 .column {
    display: block;
    width: auto;
    margin: 0 16px 24px 16px;
    text-align: left;
  }

  .consultingArea .column .ico {
    display: table-cell;
    width: 64px;
    padding-right: 16px;
  }

  .consultingArea .column5 .column p {
    display: table-cell;
    vertical-align: middle;
  }

  .consultingArea .column5 .column:last-child {
    margin-bottom: 0;
  }

  .consultingArea .flow {
    padding-top: 48px;
  }

  .topArea .cloudService ul {
    flex-direction: column;
  }

  .consultingArea .cloudService .box {
    width: 100%;
    padding: 24px 24px 96px 24px;
  }

  .consultingArea .cloudService .box h3 {
    display: block;
    height: auto;
    margin-bottom: 16px;
    font-size: 16px;
  }

  .consultingArea .cloudService .box a {
    bottom: 24px;
    padding: 0;
    font-size: 14px;
    line-height: 48px;
  }
}

@media only screen and (max-width: 1023px) {
  .consulting .inner {
    background: url(/img/bg_consulting_tb.jpg) no-repeat right top / cover;
  }

  .bxFix1,
  .bxFix2 {
    display: none;
  }
}

/*-----aws*/
.headArea.aws {
  background: linear-gradient(90deg, rgb(254, 134, 82) 0%, rgb(235, 88, 97) 15%, rgb(210, 75, 116) 40%, rgb(112, 48, 143) 70%, rgb(59, 35, 122) 100%);
  color: #fff;
}

.aws .inner {
  min-height: 306px;
  padding: 60px 0 64px;
  background: url(/img/bg_aws.png) no-repeat right center;
  box-sizing: border-box;
}

.aws h1 {
  margin-bottom: 30px;
}

.headArea.aws p {
  margin-bottom: 48px;
}

.aws .topAzBtn {
  position: absolute;
  top: 0;
  left: 263px;
  width: 158px;
}

.aws .btn {
  margin-top: 32px;
  width: 280px;
  height: 60px;
  border-radius: 30px;
  overflow: hidden;
}

.aws .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ff7300;
  color: #fff;
  width: 100%;
  height: 100%;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.aws .btn a .ico {
  margin-right: 16px;
}

.awsArea .caseSection {
  padding: 70px 0 80px;
}

.awsArea .caseSection .layout {
  max-width: 900px;
}

.awsArea .caseSection .h2 {
  text-align: center;
}

.awsArea .caseSection .h2 p {
  font-size: 24px;
  font-weight: bold;
  color: #963c84;
}

.awsArea .caseSection .itemGroup {
  display: flex;
  margin: 60px 0 70px;
}

.awsArea .caseSection .itemGroup .item {
  width: 100%;
  text-align: center;
}

.awsArea .caseSection .itemGroup .item p {
  margin-top: 15px;
  font-size: 15px;
  font-weight: bold;
}

.awsArea .featureSection .itemGroup {
  padding: 100px 0 80px 0;
  background: #f5e4eb;
}

.awsArea .featureSection .itemGroup .layout {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.awsArea .featureSection .itemGroup .item {
  display: block;
  width: calc((100% - 20px)/2);
  min-height: 280px;
  margin-bottom: 20px;
  box-sizing: border-box;
  color: #666;
  font-size: 14px;
  transition: all 0.4s ease;
  background: #fff;
  box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.08);
}

.awsArea .featureSection .itemGroup .item .head {
  display: flex;
  align-items: center;
  padding: 30px 20px;
  border-bottom: 2px solid #f5e4eb;
}

.awsArea .featureSection .itemGroup .item .img {
  margin-right: 20px;
}

.awsArea .featureSection .itemGroup .item .body {
  display: table-cell;
  vertical-align: top;
  padding: 20px;
  color: #333;
}

.awsArea .featureSection .itemGroup h3 {
  color: #963c84;
  font-size: 25px;
  font-weight: bold;
  letter-spacing: 0.075em;
  line-height: 1.33;
  flex: 1;
}

.awsArea .hGroup:after {
  display: none;
}

.hGroup.aws {
  padding: 64px 0;
}

.hGroup.aws h2 {
  color: #963c84;
}

.awsArea .flowSection {
  position: relative;
  padding: 56px 0 62px 0;
  border-bottom: 1px solid #e6e6e6;
  background: #f3f5f5;
  font-size: 16px;
  text-align: center;
}

.awsArea .flowSection p {
  margin-bottom: 48px;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
}

.awsArea .flowSection:before {
  content: '';
  position: absolute;
  bottom: -43px;
  left: 50%;
  margin-top: -1px;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #f3f5f5;
  z-index: 999;
}

.awsArea .flowSection:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #e6e6e6;
  z-index: 998;
}

.awsArea .hGroup.hG-2 {
  padding: 60px 0 100px;
}

@media only screen and (max-width: 1023px) {
  .aws .topAzBtn {
    left: 287px;
  }

  .awsArea .featureSection .itemGroup .item {
    width: 100%;
  }
}

@media only screen and (max-width: 767px) {
  .aws .inner {
    min-height: auto;
    padding: 40px 0 54px;
    background: url(/img/bg_aws.png) no-repeat right top;
    background-size: 112px;
  }

  .aws h1 {
    margin-bottom: 16px;
  }

  .aws .topAzBtn {
    position: static;
    margin-top: 20px;
    width: auto;
    text-align: center;
  }

  .aws .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .aws .btn a {
    font-size: 16px;
  }

  .aws .btn .ico {
    width: 21px;
    margin-right: 10px;
  }

  .headArea.aws br {
    display: none;
  }

  .awsArea .caseSection {
    padding: 40px 0 50px;
  }

  .awsArea .caseSection .h2 p {
    font-size: 16px;
  }

  .awsArea .caseSection .itemGroup {
    display: block;
    margin: 30px 0 40px;
  }

  .awsArea .caseSection .itemGroup .item {
    display: table;
    width: auto;
    margin-bottom: 16px;
    text-align: left;
  }

  .awsArea .caseSection .itemGroup .item .img {
    width: 72px;
    padding-right: 16px;
  }

  .awsArea .caseSection .itemGroup .item p {
    display: table-cell;
    vertical-align: middle;
  }

  .awsArea .caseSection .awsZoom .ico {
    top: -45px;
  }

  .awsArea .featureSection .itemGroup {
    padding: 50px 0;
  }

  .awsArea .featureSection .itemGroup .item {
    width: 100%;
    margin-bottom: 24px;
  }

  .awsArea .featureSection .itemGroup .item br {
    display: none;
  }

  .awsArea .featureSection .itemGroup .item .img {
    width: 72px;
    padding-right: 16px;
  }

  .awsArea .featureSection .itemGroup h3 {
    margin-bottom: 4px;
    font-size: 14px;
  }

  .awsArea .hGroup.hG-2 {
    padding: 40px 0 60px;
  }
}

/*-----pay tg*/
.headArea.paytg .paytgLogo img {
  width: 218px;
}

.headArea.paytg .inner {
  padding-bottom: 55px;
  background: url(/img/paytg_head_bg.png) no-repeat right top;
}

.headArea.paytg .shoulder {
  display: inline-block;
  position: relative;
  margin-bottom: 8px;
  font-size: 18px;
  line-height: 1.5;
}

.headArea.paytg .circle {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 16px;
  left: calc(100% + 8px);
  width: 96px;
  height: 96px;
  background-color: #66cc66;
  border-radius: 50%;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

.headArea.paytg h1 {
  margin-bottom: 16px;
  font-size: 43px;
  font-family: 'Roboto';
  letter-spacing: 0;
}

.headArea.paytg .txt {
  max-width: 500px;
  line-height: 2;
}

.paytgLogo img {
  width: 140px;
}

.paytgLogoWhite img {
  width: 57px;
}

.box .paytgLogoWhite img {
  margin-top: 5px;
}

.paytgArea .section {
  background: #f3f5f5;
}

.paytgArea .task h2 {
  position: relative;
  padding: 40px 24px;
  background: #484c4d;
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  letter-spacing: 0.05em;
}

.paytgArea .task h2:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #484c4d;
}

.paytgArea .task .layout {
  max-width: 900px;
  padding-top: 50px;
  padding-bottom: 72px;
}

.paytgArea .task .item {
  float: left;
  width: 30.22%;
  margin-left: 4.66%;
  color: #666;
  line-height: 1.5;
}

.paytgArea .task .item:first-child {
  margin-left: 0;
}

.paytgArea .task .item .box {
  margin-bottom: 25px;
}

.paytgArea .task .item .box .head {
  background: #ff6666;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
  line-height: 30px;
}

.paytgArea .task .item:nth-child(2) .box .head {
  background: #ffc107
}

.paytgArea .task .item:nth-child(3) .box .head {
  background: #66cc66
}

.paytgArea .task .item .box .body {
  display: table;
  width: 100%;
  padding: 26px 8px 26px 20px;
  background: #fff;
  text-align: center;
  box-sizing: border-box;
}

.paytgArea .task .item .box .body .ico {
  display: table-cell;
  width: 107px;
}

.paytgArea .task .item .box .body p {
  display: table-cell;
  width: 136px;
  padding-top: 20px;
  font-weight: bold;
  vertical-align: top;
  text-decoration: underline;
}

.paytgArea .task p.btm {
  margin-top: 50px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
}

.paytgArea .section .headArea {
  padding: 40px 0;
  background: #fff;
  text-align: center;
  color: #28b9b9;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 0.05em;
  position: relative;
}

.paytgArea .section .headArea h2 {
  color: #333;
  font-size: 28px;
  font-weight: bold;
}

.paytgArea .section .headArea:after {
  content: '';
  position: absolute;
  bottom: -44px;
  left: 50%;
  margin-left: -22px;
  border: 22px solid transparent;
  border-top: 22px solid #fff;
}

.paytgArea .detail .body .layout {
  max-width: 900px;
  padding-top: 80px;
  padding-bottom: 80px;
}

.paytgArea .feature .body .layout {
  max-width: 900px;
  padding-top: 95px;
  padding-bottom: 64px;
}

.paytgArea .company .body .layout {
  max-width: 900px;
  padding: 80px 0;
}

.paytgArea .feature .itemGroup {
  display: flex;
  justify-content: space-between;
}

.paytgArea .feature .item {
  width: 21.66%;
  color: #666;
  line-height: 1.5;
}

.paytgArea .feature .item .ico {
  text-align: center;
}

.paytgArea .feature .item .ico img {
  width: 217px;
}

.paytgArea .feature .item .h {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 84px;
  color: #333;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}

.paytgArea .company .clearfix:after {
  display: none;
}

.paytgArea .company .itemGroup {
  display: flex;

  flex-wrap: wrap;
  margin: 0 auto;

}

.paytgArea .company .item {
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin-right: 4.44%;
  margin-bottom: 4.44%;
  width: 21.667%;
}

.paytgArea .company .item img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;

}

.paytgArea .company .item:nth-of-type(4n) {
  margin-right: 0;
}

.paytgArea .company .item:nth-of-type(n+13) {
  margin-bottom: 0;
}

@media only screen and (max-width: 1023px) {
  .headArea.paytg .inner {
    background-color: #f7f5f2;
  }

  .paytgArea .company .body .layout {
    padding: 80px 24px;
  }
}

@media only screen and (max-width: 864px) {
  .paytgArea .feature .item .h {
    font-size: 16px;
  }
}

@media only screen and (max-width: 767px) {

  .headArea.paytg .paytgLogo img {
    width: 170px;
  }

  .headArea.paytg .inner {
    padding-top: 15px;
    padding-bottom: 24px;
    background-size: 140px;
    background-color: #f7f5f2;
    background-position: right -26px top 15px;
  }

  .headArea.paytg .shoulder {
    font-size: 14px;
  }

  .headArea.paytg .shoulder br {
    display: inline;
  }

  .headArea.paytg .circle {
    top: calc(100% - 16px);
    right: 10px;
    left: inherit;
    width: 60px;
    height: 60px;
    font-size: 10px;
  }

  .headArea.paytg h1 {
    margin-bottom: 25px;
    font-size: 28px;
  }

  .paytgArea .task h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .paytgArea .section .headArea {
    padding: 24px 0;
    font-size: 14px;
  }

  .paytgArea .section .headArea h2 {
    font-size: 18px;
  }

  .headArea.paytg .txt {
    max-width: 100%;
    line-height: 1.75;
  }

  .paytgArea .task .layout {
    padding-top: 40px;
    padding-bottom: 64px;
  }

  .paytgArea .task .item {
    float: none;
    width: 100%;
    max-width: 272px;
    /*		margin: 0 0 40px;*/
    margin: 0 auto 40px;
  }

  .paytgArea .task .item:first-child {
    margin-left: auto;
  }

  .paytgArea .task .item .box {
    margin-bottom: 16px;
  }

  .paytgArea .task p.btm {
    font-size: 16px;
  }

  .paytgArea .detail .body .layout {
    padding-top: 40px;
    padding-bottom: 64px;
  }

  .paytgArea .feature .body .layout {
    padding-top: 40px;
    padding-bottom: 64px;
  }

  .paytgArea .feature .itemGroup {
    display: block;
  }

  .paytgArea .feature .item {
    width: 100%;
    margin: 0 0 40px;
  }

  .paytgArea .feature .item:last-child {
    margin-bottom: 0;
  }

  .paytgArea .feature .item .ico {
    margin-bottom: 24px;
  }

  .paytgArea .feature .item .h {
    min-height: inherit;
    margin-bottom: 16px;
    font-size: 16px;
  }

  .paytgArea .company .body div.layout {
    padding: 40px 16px !important;
  }

  .paytgArea .company .itemGroup {
    justify-content: space-between;
  }

  .paytgArea .company .item {
    width: 50%;
    margin-right: 0;
    margin-bottom: 16px;
  }

  .paytgArea .company .item:nth-of-type(n+5) {
    margin-bottom: 16px;
  }

  .paytgArea .company .item:nth-of-type(odd) .logo {
    padding-right: 8px;
  }

  .paytgArea .company .item:nth-of-type(even) .logo {
    padding-left: 8px;
  }

  .paytgArea .company .item:last-of-type {
    margin-bottom: 0;
  }

  .paytgArea .company .item:nth-of-type(2n) {
    margin-right: 0;
  }

  .paytgArea .company .item:last-of-type {
    margin-bottom: 16px;
  }


}

/*case*/
#case .headArea .inner {
  padding: 88px 0;
  background: url(/img/bg_case.jpg) no-repeat center;
  background-size: cover;
  color: #fff;
}

#case .caseArea .body {
  padding: 80px 0 120px;
}

#case .itemGroup {
  display: flex;
  flex-wrap: wrap;
}

#case .itemGroup .item {
  width: calc((100% - 64px)/3);
  margin-right: 32px;
  margin-bottom: 64px;
  /*display: none;*/
  opacity: 0;
  transition: 0.4s ease;
  background: #fff;
}

#case .itemGroup .item a {
  display: block;
  color: #333;
}

#case .itemGroup .item.show {
  opacity: 1;
}

#case .itemGroup .item:nth-of-type(3n+1) {
  margin-right: 0;
}

#case .itemGroup .item.on {
  display: block;
}

#case .itemGroup .item.column_1 {
  width: 100%;
  margin-right: 0;
}

#case .itemGroup .item.column_1 {
  width: 100%;
  margin-right: 0;
}

#case .itemGroup .item.column_1:last-of-type {
  margin-bottom: 0;
}

#case .itemGroup .item.column_1 a {
  display: -ms-grid;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -ms-grid-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  -ms-grid-rows: 1fr;
}

#case .itemGroup .item .img {
  padding-top: 59.21%;
  background-position: top center;
  background-size: cover;
  margin: 0;
}

#case .itemGroup .item.column_1 .img {
  display: block;
  padding: 0;
  height: 100%;
  grid-column: 1/2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-row: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
}

#case .itemGroup .item .img img {
  display: none;
}

#case .itemGroup .item .txt {
  position: relative;
  padding: 0px 20px 16px;
}

#case .itemGroup .item .txt .h {
  display: inline-block;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  background: #32bcbc;
  padding: 4px 8px;
  color: #fff;
  margin-bottom: 4px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  font-weight: 600;
}

#case .itemGroup .item .txt .h.cat_1 {
  background: #9D6DC4;
}

#case .itemGroup .item .txt .h.cat_2 {
  background: #ff6666;
}

#case .itemGroup .item .txt .h.cat_3 {
  background: #26b7b7;
}

#case .itemGroup .item .txt .h.cat_4 {
  background: #00aeff;
}

#case .itemGroup .item .txt .h.cat_5 {
  background: #007f92;
}

#case .itemGroup .item .txt .h.cat_6 {
  background: #484c4d;
}

#case .itemGroup .item .txt .h.cat_7 {
  background: #ff7a34;
}

#case .itemGroup .item .txt .h.cat_8 {
  background: #ff6716;
}

#case .itemGroup .item .txt .h.cat_9 {
  background: #346BFF;
}

#case .itemGroup .item .txt .name {
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 12px;
}

#case .itemGroup .item .txt p {
  font-size: 13px;
  line-height: 1.84;
  letter-spacing: 0.1em;
  margin-bottom: 16px;
}

#case .itemGroup .item .txt .date {
  font-size: 10px;
  font-weight: bold;
  text-align: right;
}

#case .itemGroup .item.column_1 .txt {
  box-sizing: border-box;
  grid-column: 2/3;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-row: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  padding: 32px 32px 16px 32px;
  min-height: 256px;
}

#case .itemGroup .item.column_1 .txt .h {
  transform: translateY(0);
  margin-bottom: 16px;
}

#case .itemGroup .item.column_1 .txt .name {
  font-size: 22px;
}

#case .itemGroup .item.column_1 .txt p {
  font-size: 14px;
}

#case .itemGroup .item.column_1 .txt .date {
  font-size: 12px;
  margin: auto 0 0 0;
}

#case .system .body {
  background: #fff;
  padding: 80px 0;
}

#case .system .content {
  display: grid;
  display: -ms-grid;
  grid-template-columns: 1fr 1fr;
  -ms-grid-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  -ms-grid-rows: auto auto;
}

#case .system .content .img {
  grid-column: 1/2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-row: 1/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
}

#case .system .content .txt {
  grid-column: 2/3;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-row: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  box-sizing: border-box;
  padding: 40px 40px 0px;
}

#case .system .content .txt .h {
  font-size: 22px;
  font-weight: bold;
  letter-spacing: 0.05em;
  margin-bottom: 24px;
}

#case .system .content .txt p {
  letter-spacing: 0.05em;
  margin-bottom: 28px;
  font-size: 16px;
}

#case .system .content .btnArea {
  grid-column: 2/3;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-row: 2/3;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  text-align: right;
  padding-right: 40px;
  padding-bottom: 28px;
}

#case .system .content .btnArea .btn {
  display: inline-block;
  letter-spacing: 0.05em;
  font-size: 16px;
  font-weight: 600;
}

#case .system .content .btnArea .btn a {
  display: flex;
  color: #fff;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 48px;
  background: linear-gradient(#33bdbd, #26b6b6);
  border-radius: 3px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
}

#case .more_btn {
  display: flex;
  margin: 0 auto;
  width: 200px;
  height: 48px;
  font-size: 16px;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  border: 2px solid #28b9b9;
  border-radius: 3px;
  color: #28b9b9;
  cursor: pointer;
  transition: 0.4s ease;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
}

#case .more_btn:hover {
  opacity: 0.6;
}

#case .more_btn span:after {
  display: inline-block;
  position: relative;
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 3px #28b9b9;
  border-right: solid 3px #28b9b9;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  top: -2px;
  margin-left: 8px;
}

@media screen and (max-width:767px) {
  #case .layout {
    padding: 0 20px;
  }

  #case .headArea .inner {
    padding: 92px 0 123px;
  }

  #case .headArea h1 {
    font: 30px;
  }

  #case .caseArea .body {
    padding: 52px 0 68px;
  }

  #case .itemGroup {
    justify-content: space-between;
  }

  #case .itemGroup .item.column_1 a {
    display: block;
  }

  #case .itemGroup .item.column_1 .img {
    padding-top: 53.72%;
  }

  #case .itemGroup .item.column_1 .txt {
    padding: 18px 20px;
    min-height: auto;
  }

  #case .itemGroup .item.column_1 .txt .h {
    position: inherit;
    padding: 1px 7px;
    margin-bottom: 16px;
    left: 0;
  }

  #case .itemGroup .item.column_1 .txt .name {
    font-size: 20px;
    margin-bottom: 12px;
  }

  #case .itemGroup .item.column_1 .txt .date {
    font-size: 14px;
  }

  #case .itemGroup .item {
    width: calc((100% - 15px)/2);
    margin-right: 0;
    margin-bottom: 20px;
  }

  #case .itemGroup .item .img {
    padding-top: 75%;
  }

  #case .itemGroup .item .txt {
    padding: 32px 10px 12px;
  }

  #case .itemGroup .item .txt .h {
    position: absolute;
    box-sizing: border-box;
    max-width: 81.25%;
    top: 0;
    left: 10px;
    font-size: 10px;
  }

  #case .system .body {
    padding: 52px 0;
  }

  #case .system .content {
    display: block;
  }

  #case .system .content .txt {
    padding: 0 10px;
  }

  #case .system .content .txt .h {
    text-align: center;
  }

  #case .itemGroup .item .txt .name {
    font-size: 13px;
    margin-bottom: 8px;
  }

  #case .itemGroup .item .txt p {
    font-size: 11px;
    margin-bottom: 12px;
  }

  #case .system .content .btnArea {
    padding: 0;
    text-align: center;
  }

  #case .system .content .btnArea .btn,
  #case .system .content .btnArea .btn a {
    max-width: 280px;
    width: 100%;
  }
}

/*caseDetail*/
#caseDetail .headArea {
  padding-top: 100px;
  background: none;
}

#caseDetail .headArea .layout {
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 5px solid #dce0e0;
}

#caseDetail .headArea .name {
  font-size: 20px;
  letter-spacing: 0.05em;
  font-weight: 600;
  margin-bottom: 32px;
}

#caseDetail .headArea h1 {
  font-size: 29px;
  line-height: 1.44;
  letter-spacing: 0.05em;
  font-weight: 600;
  margin-bottom: 32px;
  color: #007780;
}

#caseDetail .headArea .tag {
  display: inline-block;
  background: #25afaf;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.05em;
  padding: 4px 10px;
  color: #fff;
}

#caseDetail .headArea .tag.cat_1 {
  background: #9D6DC4;
}

#caseDetail .headArea .tag.cat_2 {
  background: #ff6666;
}

#caseDetail .headArea .tag.cat_3 {
  background: #26b7b7;
}

#caseDetail .headArea .tag.cat_4 {
  background: #00aeff;
}

#caseDetail .headArea .tag.cat_5 {
  background: #007f92;
}

#caseDetail .headArea .tag.cat_6 {
  background: #484c4d;
}

#caseDetail .headArea .tag.cat_7 {
  background: #ff7a34;
}

#caseDetail .headArea .tag.cat_8 {
  background: #ff6716;
}

#caseDetail .headArea .tag.cat_9 {
  background: #346BFF;
}

.caseDetailArea {
  padding-bottom: 80px;
}

#caseDetail .introduction {
  margin-bottom: 36px;
}

#caseDetail .introduction .content {}

#caseDetail .introduction .img {
  box-sizing: border-box;
  margin-bottom: 28px;
}

#caseDetail .img .caption {
  font-size: 15px;
  margin-top: 12px;
  display: block;
}

#caseDetail .introduction .txt {
  box-sizing: border-box;
  font-size: 16px;
  line-height: 2.25;
  letter-spacing: 0.05em;
  font-weight: 600;
}

#caseDetail .point .content {
  box-sizing: border-box;
  position: relative;
  background: #e9f8f8;
  margin-bottom: 56px;
  padding-bottom: 44px;
}

#caseDetail .point .content .h {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  width: 168px;
  background: #25afaf;
  padding: 10px 10px 10px 20px;
  color: #fff;
  font-weight: 600;
  margin-bottom: 8px;
  font-size: 16px
}

#caseDetail .point .content .h:after {
  content: '';
  position: absolute;
  top: 0;
  left: 168px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 48px 48px 0 0;
  border-color: #25afaf transparent transparent transparent;
}

#caseDetail .point .content ul {
  box-sizing: border-box;
  max-width: 620px;
  margin: 0 auto;
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: 0.05em;
  font-weight: 600;
}

#caseDetail .point .content ul li {
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  position: relative;
}

#caseDetail .point .content ul li:before {
  display: block;
  content: '';
  width: 6px;
  height: 6px;
  background: #26b7b7;
  border-radius: 50%;
  margin-right: 20px;
  flex-shrink: 0;
}

#caseDetail .point .content dl {
  max-width: 620px;
  margin: 0 auto;
  padding: 0 24px;
  font-size: 18px;
  line-height: 1.55;
  letter-spacing: 0.05em;
}

#caseDetail .point .content dl dd+dt {
  margin-top: 24px;
}

#caseDetail .point .content dl dt+dd {
  margin-top: 4px;
}

#caseDetail .point .content dl dt {
  display: grid;
  grid-template-columns: 6px 1fr;
  gap: 20px;
  align-items: center;
  font-weight: 600;
}

#caseDetail .point .content dl dt:before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  background: #26b7b7;
  border-radius: 50%;
}

#caseDetail .point .content dl dd {
  margin-left: 26px;
}

#caseDetail .txtBlock {
  max-width: 800px;
  box-sizing: border-box;
  margin: 0 auto 56px;
}

#caseDetail .txtBlock h2 {
  font-size: 20px;
  font-weight: 600;
  color: #007780;
  clear: both;
  margin-bottom: 24px;
}

#caseDetail .txtBlock .txt+.txt {
  margin-top: 32px;
}

#caseDetail .txtBlock .txt {
  font-size: 16px;
  line-height: 2;
  letter-spacing: 0.05em;
}

#caseDetail .txtBlock .txt p {
  margin-bottom: 20px;
}

#caseDetail .txtBlock .txt p .underline {
  text-decoration: underline;
}

#caseDetail .txtBlock .txt .min {
  font-size: 12px;
}

#caseDetail .txtBlock .img {
  margin-bottom: 18px;

}

#caseDetail .txtBlock .img.vertical {
  width: 35%;
}

#caseDetail .txtBlock .img .name {
  display: block;
  text-align: right;
  margin-top: 10px;
}

#caseDetail .GrayBlock {
  background: #F3F4F5;
  padding: 56px 24px 64px;
}

#caseDetail .GrayBlock h2 {
  color: #333;
  border-bottom: solid 2px #ddd;
  padding-bottom: 20px;
}

#caseDetail .GrayBlock h2 {
  color: #333;
  border-bottom: solid 2px #ddd;
  padding-bottom: 20px;
  margin-bottom: 32px;
}

#caseDetail .GrayBlock .content {
  max-width: 608px;
  margin: 0 auto;
}

#caseDetail .GrayBlock .txt h3 {
  position: relative;
  margin: 0 48px 16px;
  padding: 8px 0;
  background-color: #25AFAF;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}

#caseDetail .GrayBlock .txt h3::before {
  content: "";
  position: absolute;
  top: 0;
  left: -48px;
  width: 48px;
  height: 100%;
  background: #25AFAF;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

#caseDetail .GrayBlock .txt h3::after {
  content: "";
  position: absolute;
  top: 0;
  right: -48px;
  width: 48px;
  height: 100%;
  background: #25AFAF;
  clip-path: polygon(0 0, 100% 0, 0 100%);
}

#caseDetail .GrayBlock .txt p {
  padding: 0 16px;
}

#caseDetail .company .content {
  box-sizing: border-box;
  position: relative;
  background: #e9f8f8;
  margin-bottom: 56px;
  padding-bottom: 44px;
  display: flex;
}

#caseDetail .company .content .h {
  position: absolute;
  top: 0;
  left: 0;
  box-sizing: border-box;
  display: inline-block;
  width: 168px;
  height: 48px;
  background: #25afaf;
  padding: 12px 64px 8px 36px;
  color: #fff;
  font-weight: 600;
  margin-bottom: 8px;
}

#caseDetail .company .content .h250821 {
  padding: 12px 0 0 48px;
}

#caseDetail .company .content .h:after {
  content: '';
  position: absolute;
  top: 0;
  left: 168px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 48px 48px 0 0;
  border-color: #25afaf transparent transparent transparent;
}

#caseDetail .company .content .txtGroup {
  width: 58%;
  order: 1;
  padding: 70px 0 20px 36px;
  flex: 1;
}

#caseDetail .company .content .t-250821 {
  padding: 70px 0 0 48px;
}

#caseDetail .company .content .imgGroup {
  width: 40%;
  order: 2;
  padding: 64px 48px 0 32px;
}

#caseDetail .company .content .imgGroup .img:first-of-type {
  margin-bottom: 24px;
}

#caseDetail .company .content .txtGroup table {
  font-size: 13px;
  line-height: 1.84;
  letter-spacing: 0.05em;
  border-bottom: 1px solid #fff;
  margin-bottom: 24px;
  padding-bottom: 24px;
}

#caseDetail .company .content .txtGroup table a {
  position: relative;
  text-decoration: underline;
}

#caseDetail .company .content .txtGroup table a:after {
  content: '';
  position: absolute;
  width: 12px;
  height: 12px;
  top: 50%;
  right: -18px;
  transform: translateY(-50%);
  background: url(/img/case_detail_ico_01.png);
  background-size: cover;
}

#caseDetail .company .content .txtGroup table th {
  position: relative;
  text-align-last: justify;
  white-space: nowrap;
  font-weight: 300;
}

#caseDetail .company .content .txtGroup .tb th {
  position: relative;
  text-align-last: auto;
  white-space: nowrap;
  font-weight: 300;
}

#caseDetail .company .content .txtGroup table th:after {
  position: absolute;
  content: ':';
  top: 50%;
  transform: translateY(-50%);
  right: -12px;
}

#caseDetail .company .content .txtGroup .tb th:after {
  position: absolute;
  content: '';
  top: 50%;
  transform: translateY(-50%);
  right: -12px;
}

#caseDetail .company .content .txtGroup table td {
  padding-left: 16px;
}

#caseDetail .company .content .txtGroup .txt {
  font-size: 13px;
  line-height: 1.84;
  letter-spacing: 0.05em;
}

#caseDetail .btnArea {
  display: flex;
  justify-content: center;
}

#caseDetail .btnArea .btn {
  width: 200px;
  height: 48px;
  font-size: 16px;
}

#caseDetail .btnArea .btn a {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  color: #fff;
  border-radius: 3px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
  font-weight: 600;
  line-height: 1;
}

#caseDetail .btnArea .btn:nth-of-type(1) {
  margin-right: 40px;
}

#caseDetail .btnArea .btn:nth-of-type(1) a {
  background: linear-gradient(90deg, #fe7a0c, #fc900f);
}

#caseDetail .btnArea .btn:nth-of-type(2) a {
  background: linear-gradient(90deg, #33bdbd, #26b6b6);
}

#caseDetail .btnArea .btn.large {
  margin: 0 auto !important;
  width: 410px;
}

#caseDetail .comparison {
  margin-top: 88px;
}

#caseDetail .comparison .itemGroup {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#caseDetail .comparison .itemGroup .item {
  width: calc((100% - 40px)/2);
  position: relative;
  display: flex;
  padding: 32px 20px 18px 16px;
  background: #e9f8f8;
  box-sizing: border-box;
  margin-bottom: 46px;
}

#caseDetail .comparison .itemGroup .item:first-of-type::after {
  position: absolute;
  top: 50%;
  right: -26px;
  transform: translateY(-50%);
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 0 10px 14px;
  border-color: transparent transparent transparent #28b9b9;
}

#caseDetail .comparison .itemGroup .item .tag {
  position: absolute;
  top: -8px;
  left: 16px;
  width: 80px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  background: #7f7f7f;
}

#caseDetail .comparison .itemGroup .item:last-of-type .tag {
  background: #ff7a34;
}

#caseDetail .comparison .itemGroup .item p {
  font-size: 16px;
  line-height: 1.5;
}

#caseDetail .comparison .itemGroup .item p .green {
  color: #28b9b9;
  font-weight: 600;
}

#caseDetail .comparison .itemGroup .item .img {
  position: relative;
  width: 80px;
  height: 80px;
  box-sizing: border-box;
  flex-shrink: 0;
  margin-right: 16px;
}

#caseDetail .comparison .itemGroup .item .img::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  border: 3px solid #e3e3e3;
  z-index: 2;
  box-sizing: border-box;
}

#caseDetail .imgArea {
  margin-top: 42px;
  padding-bottom: 72px;
}

#caseDetail .imgArea .img {
  margin: 0 auto;
  text-align: center;
}

#caseDetail .smartTG {
  background: #F3F5F5;
  padding: 72px 0;
  margin-bottom: 56px;
}

#caseDetail .smartTG .itemGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#caseDetail .smartTG .itemGroup .item {
  background: #fff;
  width: calc((100% - 100px)/3);
  margin-right: 50px;
  padding: 20px 0 26px;
}

#caseDetail .smartTG .itemGroup .item:last-of-type {
  margin-right: 0;
}

#caseDetail .smartTG .itemGroup .item .ico {
  width: 34px;
  min-height: 34px;
  margin: 0 auto 4px;
}

#caseDetail .smartTG .itemGroup .item .h {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 51px;
  font-size: 18px;
  line-height: 1.5;
  color: #FF6716;
  margin-bottom: 16px;
  font-weight: 600;
}

#caseDetail .smartTG .itemGroup .item p {
  padding: 0 24px;
}

#caseDetail .editorialNote {
  margin-top: 52px;
  padding: 20px 24px;
  border: 1px solid #25afaf;
  letter-spacing: 0.05em;
}

#caseDetail .editorialNote .h {
  position: relative;
  padding-left: 20px;
  padding-bottom: 6px;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #25afaf;
  border-bottom: 1px solid #dddddd;
}

#caseDetail .editorialNote .h .ico {
  position: absolute;
  width: 14px;
  height: 14px;
  margin-right: 6px;
  top: 4px;
  left: 0;
}

#caseDetail .editorialNote .h .ico img {
  display: block;
}

#caseDetail .editorialNote p {
  font-weight: 600;
  font-size: 13px;
  line-height: 2;
}

@media only screen and (max-width: 1023px) {
  #caseDetail .headArea .layout {
    margin: 0 20px 40px;
    padding: 0 0 40px;
  }
}

@media screen and (max-width:767px) {
  #caseDetail .headArea {
    padding-top: 50px;
  }

  #caseDetail .headArea .layout {
    margin: 0 20px 52px;
    padding: 0 0 32px;
  }

  #caseDetail .headArea .name {
    font-size: 14px;
    margin-bottom: 24px;
  }

  #caseDetail .headArea h1 {
    font-size: 20px;
    margin-bottom: 24px;
  }

  #caseDetail .headArea .tag {
    font-size: 10px;
  }

  #caseDetail .introduction {
    margin-bottom: 52px;
  }

  #caseDetail .introduction .content {
    display: inherit;
  }

  #caseDetail .introduction .img {
    width: 100%;
    text-align: center;
    margin-bottom: 16px;
  }

  #caseDetail .img .caption {
    display: block;
    font-size: 10px;
    margin-top: 8px;
  }

  #caseDetail .introduction .txt {
    width: 100%;
  }

  #caseDetail .point {
    background: #e9f8f8;
  }

  #caseDetail .point .layout {
    padding: 0;
  }

  #caseDetail .point .content {
    display: inherit;
  }

  #caseDetail .point .content .h {
    width: 100%;
    padding: 16px;
    text-align: center;
    margin-bottom: 40px;
  }

  #caseDetail .point .content .h:after {
    display: none;
  }

  #caseDetail .point .content ul {
    padding: 0 20px;
  }

  #caseDetail .txtBlock .img {
    float: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto 40px;
  }

  #caseDetail .txtBlock .img.vertical {
    width: 100%;
  }

  #caseDetail .company {
    background: #e9f8f8;
  }

  #caseDetail .company .layout {
    padding: 0;
  }

  #caseDetail .company .content {
    display: inherit;
    padding: 24px 20px 0;
  }

  #caseDetail .company .content .h {
    position: inherit;
    padding: 16px;
    text-align: center;
    margin-bottom: 40px;
  }

  #caseDetail .company .content .h {
    display: none;
  }

  #caseDetail .company .content .imgGroup {
    width: 100%;
    padding: 0;
    margin-bottom: 26px;
  }

  #caseDetail .company .content .txtGroup {
    width: 100%;
    padding: 0;
  }

  #caseDetail .company .content .txtGroup table {
    font-size: 11px;
  }

  #caseDetail .company .content .txtGroup .txt {
    font-size: 11px;
    padding-bottom: 60px;
  }

  .caseDetailArea {
    padding-bottom: 50px;
  }

  #caseDetail .btnArea {
    display: inherit;
  }

  #caseDetail .btnArea .btn {
    margin: 0 auto;
  }

  #caseDetail .btnArea .btn:nth-of-type(1) {
    margin: 0 auto 20px;
  }

  #caseDetail .comparison {
    margin-top: 44px;
  }

  #caseDetail .comparison .itemGroup {
    display: block;
  }

  #caseDetail .comparison .itemGroup .item {
    width: 100%;
  }

  #caseDetail .comparison .itemGroup .item:first-of-type::after {
    top: auto;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 10px 0 10px;
    border-color: #28b9b9 transparent transparent transparent;
  }

  #caseDetail .smartTG {
    padding-top: 36px;
    margin-bottom: 18px;
  }

  #caseDetail .smartTG .itemGroup {
    display: block;
  }

  #caseDetail .smartTG .itemGroup .item {
    width: 100%;
    margin: 0 auto 18px;
  }

  #caseDetail .btnArea .btn.large {
    width: calc(100% - 32px);
    font-size: 14px;
  }

  #caseDetail .editorialNote {
    margin-top: 28px;
  }

  #caseDetail .GrayBlock {
    padding: 28px 24px 28px 24px;
  }

  #caseDetail .GrayBlock .txt h3 {
    margin: 0 0 16px;
    padding: 8px 16px;
  }

  #caseDetail .GrayBlock .txt h3::before {
    content: none;
  }

  #caseDetail .GrayBlock .txt h3::after {
    content: none;
  }
}

/*sliderSection*/
.sliderSection {
  padding-top: 72px;
  background: #f4f5f5;
  text-align: center;
}

.sliderSection h2 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.05em;
  margin-bottom: 48px;
}

.sliderSection .itemGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: left;
}

.sliderSection .itemGroup .item {
  width: calc((100% - 48px)/3);
  margin-bottom: 64px;
  transition: 0.4s ease;
  background: #fff;
}

.sliderSection .itemGroup .item a {
  display: block;
  color: #333;
}

.sliderSection .itemGroup .item .img {
  padding-top: 59.21%;
  background-position: top center;
  background-size: cover;
  margin: 0;
}

.sliderSection .itemGroup .item .img img {
  display: none;
}

.sliderSection .itemGroup .item .txt {
  position: relative;
  padding: 0px 20px 16px;
}

.sliderSection .itemGroup .item .txt .h {
  display: inline-block;
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  background: #32bcbc;
  padding: 4px 8px;
  color: #fff;
  margin-bottom: 4px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  font-weight: 600;
}

.sliderSection .itemGroup .item .txt .h.cat_1 {
  background: #9D6DC4;
}

.sliderSection .itemGroup .item .txt .h.cat_2 {
  background: #ff6666;
}

.sliderSection .itemGroup .item .txt .h.cat_3 {
  background: #26b7b7;
}

.sliderSection .itemGroup .item .txt .h.cat_4 {
  background: #00aeff;
}

.sliderSection .itemGroup .item .txt .h.cat_5 {
  background: #007f92;
}

.sliderSection .itemGroup .item .txt .h.cat_6 {
  background: #484c4d;
}

.sliderSection .itemGroup .item .txt .h.cat_7 {
  background: #ff7a34;
}

.sliderSection .itemGroup .item .txt .h.cat_8 {
  background: #ff6716;
}

.sliderSection .itemGroup .item .txt .h.cat_9 {
  background: #346BFF;
}

.sliderSection .itemGroup .item .txt .name {
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 12px;
}

.sliderSection .itemGroup .item .txt p {
  font-size: 13px;
  line-height: 1.84;
  letter-spacing: 0.05em;
  margin-bottom: 16px;
}

.sliderSection .itemGroup .item .txt .date {
  font-size: 10px;
  font-weight: bold;
  text-align: right;
}

.sliderSection .itemGroup .column_1 {
  width: 100%;
}

.sliderSection .itemGroup .column_1 a {
  display: -ms-grid;
  display: grid;
  grid-template-columns: 1fr 1fr;
  -ms-grid-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  -ms-grid-rows: 1fr;
}

.sliderSection .itemGroup .column_1 a .img {
  display: block;
  padding: 0;
  height: 100%;
  grid-column: 1/2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-row: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
}

.sliderSection .itemGroup .column_1 a .txt {
  box-sizing: border-box;
  grid-column: 2/3;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-row: 1/2;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  padding: 32px 32px 16px 32px;
  min-height: 256px;
}

.sliderSection .itemGroup .column_1 a .txt .h {
  transform: translateY(0);
  margin-bottom: 16px;
}

.sliderSection .itemGroup .column_1 a .txt .name {
  font-size: 22px;
}

.sliderSection .itemGroup .column_1 a .txt p {
  font-size: 14px;
}

.sliderSection .itemGroup .column_1 a .txt .date {
  font-size: 12px;
  margin: auto 0 0 0;
}

.sliderArea {
  padding: 64px 0;
  background: #fff;
}

.js_slider {
  margin-bottom: 56px;
}

.js_slider li {
  width: 184px;
  margin: 0 10px;
}

.bottom_slider {
  margin-bottom: 80px;
}

.bottom_slider .slick-track {
  margin-left: 92px;
}

.sliderSection .btn {
  width: 200px;
  height: 48px;
}

.sliderSection .btnArea {
  display: flex;
  justify-content: center;
  font-size: 16px;
}

.sliderSection .btn a {
  box-sizing: border-box;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  color: #fff;
  border-radius: 3px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
  font-weight: 600;
  line-height: 1;
  background: linear-gradient(90deg, #33bdbd, #26b6b6);
}

@media screen and (max-width:767px) {
  .sliderSection {
    padding-top: 80px;
  }

  .sliderSection h2 {
    margin-bottom: 50px;
  }

  .sliderSection .itemGroup .item {
    width: 100%;
    margin-bottom: 20px;
  }

  .sliderSection .itemGroup .item .img,
  .sliderSection .itemGroup .column_1 a .img {
    padding-top: 53.72%;
  }

  .sliderSection .itemGroup .item .img .txt {
    padding: 18px 20px;
  }

  .sliderSection .itemGroup .item .img .txt .h {
    box-sizing: border-box;
    position: inherit;
    padding: 1px 7px;
    margin-bottom: 16px;
    left: 0;
  }

  .sliderSection .itemGroup .item .img .txt .name {
    font-size: 20px;
    margin-bottom: 12px;
  }

  .sliderSection .itemGroup .item .img .txt p {
    font-size: 14px;
    margin-bottom: 12px;
  }

  .sliderSection .itemGroup .item .txt .date {
    font-size: 14px;
  }

  .sliderSection .itemGroup .item a {
    display: block;
  }

  .sliderSection .itemGroup .item .txt {
    min-height: inherit;
  }

}

/* ------------------------ seminar */
.headArea.seminar .inner {
  padding: 80px 0;
  background: url(/img/bg_seminar.jpg) no-repeat center / cover;
  color: #fff;
}

.headArea .shoulder {
  font-size: 20px;
  letter-spacing: 0.05em;
}

.headArea.seminar h1 {
  font-size: 40px;
  letter-spacing: 0.05em;
}

.seminarArea {
  font-size: 16px;
  letter-spacing: 0.05em;
}

.seminarArea * {
  box-sizing: border-box;
}

.seminarArea .section:not(:last-of-type) {
  margin-bottom: 80px;
}

.seminarArea h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 28px 0;
  font-size: 24px;
  font-weight: 700;
}

.seminarArea h2:before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  vertical-align: middle;
}

.seminarArea .infoBlk {
  padding: 80px 0;
  background: #f3f5f5;
}

.seminarArea .infoTable {
  display: flex;
  flex-wrap: wrap;
  background: #fff;
}

.seminarArea .infoTable dt,
.seminarArea .infoTable dd {
  padding: 16px 40px;
}

.seminarArea .infoTable dt {
  display: flex;
  align-items: center;
  width: 184px;
  background: #28b9b9;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}

.seminarArea .infoTable dt:not(:first-of-type) {
  border-top: 1px solid #fff;
}

.seminarArea .infoTable dd {
  width: calc(100% - 184px);
}

.seminarArea .infoTable dd:not(:first-of-type) {
  border-top: 1px solid #f3f5f5;
}

.seminarArea .infoTable dd p:not(:last-of-type) {
  margin-bottom: 24px;
}

.seminarArea .infoTable dd .bold {
  display: block;
  font-weight: 700;
}

.seminarArea .howto h2:before {
  background: url(/img/ico_seminar_01.png) no-repeat left center / 32px;
}

.seminarArea .howto .wbox {
  display: flex;
  align-items: center;
  padding: 32px 40px;
  background: #fff;
}

.seminarArea .howto figure {
  width: 143px;
  margin: 0 40px 0 0;
}

.seminarArea .howto .text {
  flex: 1;
}

.seminarArea .howto .text p:not(:last-of-type) {
  margin-bottom: 24px;
}

.seminarArea .schedule h2:before {
  background: url(/img/ico_seminar_02.png) no-repeat left center / 32px;
}

.seminarArea .scheTable {
  display: flex;
  flex-wrap: wrap;
  background: #fff;
}

.seminarArea .scheTable dt,
.seminarArea .scheTable dd {
  padding: 28px 40px;
}

.seminarArea .scheTable dt:not(:first-of-type),
.seminarArea .scheTable dd:not(:first-of-type) {
  border-top: 1px solid #f3f5f5;
}

.seminarArea .scheTable dt {
  width: 184px;
  padding-right: 0;
}

.seminarArea .scheTable dd {
  width: calc(100% - 184px);
}

.seminarArea .scheTable h3 {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
}

.seminarArea .scheTable .name {
  margin-bottom: 10px;
  font-weight: 700;
  line-height: 1.375;
}

.seminarArea .instructor h2 {
  align-items: flex-start;
}

.seminarArea .instructor h2::before {
  background: url(/img/ico_seminar_04.png) no-repeat left center / 32px;
}

.seminarArea .instructor .item {
  display: flex;
  padding: 40px;
  gap: 40px;
  background: #fff;
}

.seminarArea .instructor .item .img,
.seminarArea .instructor .item .txt {
  width: calc((100% - 40px)/2);
}

.seminarArea .instructor .item .txt .tag {
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  background: #28b9b9;
  white-space: nowrap;
  padding: 8px;
  margin-bottom: 14px;
  color: #fff;
  width: fit-content;
}

.seminarArea .instructor .item .txt .h {
  font-size: 20px;
  font-weight: 600;
  line-height: 2;
  text-decoration: underline;
  text-decoration-color: rgba(40, 185, 185, 0.6);
  text-decoration-thickness: 4px;
  text-underline-offset: 6px;
  margin-bottom: 20px;

}

.seminarArea .instructor .item .txt .inner {
  padding: 16px 18px 10px;
  background: #dff4f4;
}

.seminarArea .instructor .item .txt .inner .position {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.8;
}

.seminarArea .instructor .item .txt .inner .name {
  font-size: 16px;
  font-weight: 600;
  line-height: 2;
}

.seminarArea .instructor .itemGroup {
  width: 100%;
  background: #fff;
  display: flex;
  justify-content: center;
  gap: 40px;
  padding: 40px 0px 36px;
}

.seminarArea .instructor .itemGroup .item {
  display: block;
  padding: 0;
  width: calc((100% - 160px)/3);
}

.seminarArea .instructor .itemGroup .item .img {
  width: 120px;
  margin: 0 auto 36px;
}

.seminarArea .instructor .itemGroup .item .txt {
  width: 100%;
}

.seminarArea .instructor .itemGroup .item .txt .inner {
  width: fit-content;
  margin: 0 auto;
  background: #fff;
  padding: 0;
}

.seminarArea .instructor .itemGroup .item .txt .inner .position {
  letter-spacing: 0;
  line-height: 1.5;
  margin-bottom: 3px;
}

.seminarArea .instructor .itemGroup .item .txt .inner .name {
  letter-spacing: 0;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .headArea .shoulder {
    font-size: 12px;
  }

  .headArea.seminar h1 {
    font-size: 22px;
  }

  .seminarArea {
    font-size: 14px;
  }

  .seminarArea .section:not(:last-of-type) {
    margin-bottom: 40px;
  }

  .seminarArea h2 {
    margin: 20px 0;
    font-size: 18px;
  }

  .seminarArea .howto h2:before {
    width: 24px;
    height: 24px;
    background-size: 24px;
  }

  .seminarArea .infoBlk {
    padding: 40px 0;
  }

  .seminarArea .infoTable dl {
    display: block;
  }

  .seminarArea .infoTable dt,
  .seminarArea .infoTable dd {
    width: 100%;
    padding: 10px 16px;
  }

  .seminarArea .infoTable dt {
    font-size: 16px;
  }

  .seminarArea .infoTable dd {
    padding-left: 14px;
    padding-bottom: 40px;
  }

  .seminarArea .howto .wbox {
    display: block;
    padding: 14px;
  }

  .seminarArea .howto figure {
    width: 100px;
    margin: 0 auto;
    padding: 40px 0;
  }

  .seminarArea .scheTable {
    display: block;
  }

  .seminarArea .scheTable dt,
  .seminarArea .scheTable dd {
    width: auto;
    padding: 10px 16px;
  }

  .seminarArea .scheTable dt {
    padding-top: 24px;
    padding-bottom: 0;
  }

  .seminarArea .scheTable dd {
    padding-top: 8px;
    padding-bottom: 24px;
  }

  .seminarArea .scheTable dd:not(:first-of-type) {
    border-top: 0;
  }

  .seminarArea .scheTable h3 {
    font-size: 16px;
  }

  .seminarArea .instructor .itemGroup {
    flex-direction: column;
  }

  .seminarArea .instructor .itemGroup .item {
    width: 100%;
  }

  .seminarArea .instructor .itemGroup .item .txt {
    text-align: center;
  }
}

/* ------------------------ formArea */
.formArea * {
  box-sizing: border-box;
}

.formArea {
  padding: 56px 0 80px;
  background: #dff4f4;
}

.formArea .head {
  margin: 24px 0 32px;
  text-align: center;
}

.formArea h2 {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 24px;
  font-weight: 700;
}

.formArea h2:before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  background: url(/img/ico_memo.svg) no-repeat left center / 32px;
  vertical-align: middle;
}

.formArea .lead {
  margin-top: 30px;
  font-size: 16px;
  font-weight: 700;
}

.formArea .confMessage {
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}

.formArea .formGroup {
  padding: 32px 20px;
  background: #fff;
  margin-bottom: 1px;
}

.formArea .formGroup dl {
  display: flex;
  flex-wrap: wrap;
  max-width: 768px;
  margin: 0 auto;
}

.formArea .formGroup dt {
  width: 206px;
  font-size: 16px;
  font-weight: 700;
}

.formArea .formGroup dd {
  width: calc(100% - 206px);
  padding-left: 24px;
}

.formArea .formGroup dt:not(:first-of-type),
.formArea .formGroup dd:not(:first-of-type) {
  margin-top: 20px;
}

.formArea .formGroup .required {
  display: inline-block;
  width: 50px;
  margin-left: 10px;
  background: #28b9b9;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-align: center;
  line-height: 28px;
}

.formArea .formGroup input[type="text"],
.formArea .formGroup input[type="email"],
.formArea .formGroup input[type="number"],
.formArea .formGroup textarea {
  width: 100%;
  padding: 10px;
  background: #f5fcfc;
  border: 1px solid #c4dfdf;
  font-size: 16px;
  outline: 0;
  -webkit-appearance: none;
}

.formArea .formGroup textarea {
  font-family: inherit;
}

.formArea .mw_wp_form_input .formGroup .expand {
  display: none;
}

.formArea .mw_wp_form_input .formGroup .expand.show {
  display: block;
}

.formArea .mw_wp_form_confirm .expandTitle {
  display: none;
}

.formArea .formGroup input[type="number"]::-webkit-outer-spin-button,
.formArea .formGroup input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.formArea .formGroup input[type="number"] {
  -moz-appearance: textfield;
}

.formArea .formGroup input.short {
  max-width: 332px;
}

.formArea .formGroup .eg {
  margin-top: 10px;
  font-size: 15px;
}

.formArea .formGroup .error {
  margin-top: 5px;
}

.formArea .formGroup .mwform-radio-field {
  display: block;
  margin-left: 0 !important;
}

.formArea .privacySec {
  padding: 48px 20px 56px;
  background: #fff;
}

.formArea .privacySec .inner {
  max-width: 768px;
  margin: 0 auto;
}

.formArea .privacySec h4 {
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: 700;
}

.formArea .privacySec p {
  margin-bottom: 24px;
  font-size: 15px;
}

.formArea .privacySec a.ora {
  color: #f8981c;
}

.formArea .agree-area {
  text-align: center;
}

.formArea .agree-check {
  margin: 32px 0;
}

.formArea .privacyText {
  margin: 36px 0 60px;
  text-align: center;
}

.formArea .submitBlk {
  display: flex;
  justify-content: center;
  margin-top: 32px;
}

.formArea input[type="submit"] {
  width: 240px;
  background: #fe7a0c;
  border-radius: 3px;
  outline: 0;
  border: 0;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 60px;
  cursor: pointer;
  transition: .4s ease;
}

.formArea input[type="submit"].green {
  background-color: #28b9b9;
}

.formArea input[type="submit"]:hover {
  opacity: .6;
}

.formArea input[type="submit"]:disabled {
  cursor: inherit;
}

.formArea input[type="submit"]:disabled:hover {
  opacity: inherit;
}

.formArea .backbtn input {
  background: #26b8b9;
}

.mw_wp_form_confirm .required,
.mw_wp_form_confirm .eg,
.mw_wp_form_confirm .privacySec,
.mw_wp_form_confirm .agree-area,
.mw_wp_form_confirm .privacyArea {
  display: none !important;
}

.mw_wp_form_confirm .backbtn {
  margin-right: 40px;
}

.formArea .privacyArea #head.align-right {
  margin-top: 10px;
  text-align: right;
}

.formArea .privacyArea {
  max-width: 768px;
  height: 257px;
  background: #fff;
  margin: 40px auto 0;
  padding: 8px 40px;
  overflow-y: scroll;
}

.formArea .privacyArea .body .section {
  margin-bottom: 50px;
}

.formArea .privacyArea .head {
  text-align: left;
}

.formArea .privacyArea h2 {
  justify-content: flex-start;
}

.formArea .privacyArea h2::before {
  display: none;
}

.formArea .privacyArea ul.level1 {
  list-style: decimal;
  list-style-position: outside;
  margin-left: 1.5em;
}

.formArea .privacyArea li.level1 {
  margin-bottom: 10px;
}

.formArea .privacyArea ul.level2 {
  list-style: none;
  list-style-position: outside;
  margin-left: 1.0em;
  margin-top: 10px;
}

.formArea .privacyArea li.level2 {
  padding-left: 1.0em;
  text-indent: -1.8em;
}

.formArea .privacyArea h3.caption {
  font-weight: normal;
}

.formArea .privacyArea h3.caption2 {
  margin-left: -1.5em;
  margin-top: 20px;
  font-weight: normal;
}

.formArea .formGroup .horizontal-item+.horizontal-item {
  margin-left: 0 !important;
}

.formArea .formGroup .mwform-checkbox-field-text::before {
  background: #f5fcfc;
  border: 1px solid #c4dfdf;
}

.formArea .formGroup .select {
  position: relative;
  width: fit-content;
}

.formArea .formGroup .select::after {
  content: "";
  position: absolute;
  display: block;
  top: 12px;
  right: 12px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #28B9B9;
  border-bottom: 2px solid #28B9B9;
  transform: rotate(45deg);
  pointer-events: none;
}

.formArea .formGroup .select select {
  appearance: none;
  width: 332px;
  height: 40px;
  border: 1px solid #C4DFDF;
  padding-left: 12px;
  color: #333;
  font-size: 15px;
}

@media screen and (max-width: 767px) {
  .formArea {
    padding: 24px 0 56px;
  }

  .formArea .head {
    margin: 20px 0;
  }

  .formArea h2 {
    font-size: 18px;
  }

  .formArea .confMessage {
    font-size: 16px;
  }

  .formArea .formGroup {
    padding: 24px 16px;
  }

  .formArea .formGroup dl {
    display: block;
  }

  .formArea .formGroup dt {
    width: auto;
  }

  .formArea .formGroup dd {
    width: auto;
    margin-top: 10px;
  }

  .formArea .formGroup dt:not(:first-of-type),
  .formArea .formGroup dd:not(:first-of-type) {
    margin-top: 10px;
  }

  .formArea .formGroup dt:not(:first-of-type) {
    margin-top: 16px;
  }

  .formArea .submitBlk {
    flex-direction: column-reverse;
    text-align: center;
  }

  .formArea.confirm .backbtn {
    margin-top: 40px;
    margin-right: 0;
  }

  .formArea .privacySec {
    padding: 40px 16px;
  }

  .formArea .privacySec h4 {
    font-size: 15px;
  }

  .formArea .privacySec p {
    font-size: 13px;
  }

  .mw_wp_form_confirm .backbtn {
    margin: 40px 0 0;
  }

  .formArea .privacyArea {
    padding: 8px 16px;
  }
}

/*----------seminarFormArea*/
.seminarFormArea .formGroup dt {
  display: flex;
  align-items: flex-start;
  margin-top: 4px;
  width: 178px;
}

.seminarFormArea .formGroup .flexCenter {
  margin-top: 0;
  align-items: center;
}

.seminarFormArea .formGroup .flexCenter dt {
  margin-top: 0;
  align-items: center;
}

.seminarFormArea .formGroup dt label {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;

}

.seminarFormArea .formGroup dd {
  padding-left: 30px;
}

.seminarFormArea .formGroup .required {
  flex-shrink: 0;
  margin-left: 14px;
}

.seminarFormArea .formGroup .chk .mwform-radio-field-text {
  align-items: center;
  margin-bottom: 6px;
  position: relative;
  padding-left: 36px;
  display: block;
  cursor: pointer;
}

.seminarFormArea .formGroup input[type="radio"] {
  display: none;
}

.seminarFormArea .formGroup .chk .mwform-radio-field-text::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 20px;
  height: 20px;
  background: #f5fcfc;
  border: 1px solid #c4dfdf;
  box-sizing: border-box;
  border-radius: 50%;
}

.seminarFormArea .formGroup .chk .mwform-radio-field-text::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 4px;
  width: 12px;
  height: 12px;
  background: #28b9b9;
  background-size: contain;
  opacity: 0;
  border-radius: 50%;
}

.seminarFormArea .formGroup input[type="radio"]:checked+.mwform-radio-field-text::after {
  opacity: 1;
}

.seminarFormArea input[type="checkbox"] {
  display: none !important;
}

.seminarFormArea .mwform-checkbox-field-text {
  align-items: center;
  position: relative;
  padding-left: 40px;
  display: inline-block;
  cursor: pointer;
}

.seminarFormArea .mwform-checkbox-field-text::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background: #fff;
  border: 1px solid #dcdcdc;
  box-sizing: border-box;
}

.seminarFormArea .mwform-checkbox-field-text::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  background: url("/img/ico_seminar_chk.png");
  background-size: contain;
  opacity: 0;
}

.seminarFormArea input[type="checkbox"]:checked+.mwform-checkbox-field-text::after {
  opacity: 1;
}

.seminarFormArea input[type="submit"] {
  background: #28b9b9;
}

.seminarFormArea input[type="submit"]:disabled {
  opacity: 0.6;
}

.seminarFormArea .mb0 {
  margin-bottom: 0 !important;
}

.seminarFormArea .privacy {
  margin-top: 32px;
}

@media screen and (max-width:767px) {
  .seminarArea .instructor h2 {
    align-items: center;
  }

  .seminarArea .instructor .item {
    display: block;
    padding: 24px 16px;
  }

  .seminarArea .instructor .item .img,
  .seminarArea .instructor .item .txt {
    width: 100%;
  }

  .seminarArea .instructor .item .img,
  .seminarArea .instructor .item .img {
    margin-bottom: 24px;
  }

  .seminarArea .instructor .item .txt .tag {
    font-size: 14px;
    margin-bottom: 7px;
  }

  .seminarArea .instructor .item .txt .h {
    font-size: 16px;
    margin-bottom: 16px;
  }

  .seminarFormArea .formGroup dt {
    width: 100%;
    margin-top: 0;
  }

  .seminarFormArea .formGroup dd {
    padding-left: 0;
  }
}

/* ------------------------ thanks */
.thanksArea {
  padding: 92px 20px 80px;
  background: #f3f5f5;
  text-align: center;
}

.thanksArea h1 {
  margin-bottom: 32px;
  font-size: 24px;
  font-weight: 700;
}

.thanksArea h1:before {
  content: "";
  display: inline-block;
  position: relative;
  top: 2px;
  width: 47px;
  height: 23px;
  margin-right: 10px;
  background: url(/img/ico_seminar_thanks.png) no-repeat center / 47px;
}

.thanksArea .message {
  margin-bottom: 52px;
  font-size: 16px;
  font-weight: 700;
}

.thanksArea .message p {
  margin-bottom: 1em;
}

.thanksArea .btn a {
  display: block;
  width: 192px;
  margin: 0 auto;
  background: #26b8b9;
  border-radius: 3px;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  text-align: center;
  line-height: 42px;
}

/* ------------------------ js_popupBnr */
@keyframes popup_init {
  0% {
    transform: translateY(0);
  }

  60% {
    transform: translateY(-5px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes popup_max {
  0% {
    transform: translateY(100%);
  }

  60% {
    transform: translateY(-5px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes popup_mini {
  0% {
    transform: translateY(-60%);
  }

  40% {
    transform: translateY(10px);
  }

  100% {
    transform: translateY(0);
  }
}

@keyframes popup_init_sp {
  0% {
    transform: translate(-50%, 0);
  }

  60% {
    transform: translate(-50%, -5px);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

@keyframes popup_max_sp {
  0% {
    transform: translate(-50%, 100%);
  }

  60% {
    transform: translate(-50%, -5px);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

@keyframes popup_mini_sp {
  0% {
    transform: translate(-50%, -60%);
  }

  40% {
    transform: translate(-50%, 10px);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

.js_popupBnr {
  position: fixed;
  top: calc(100% - 5px);
  left: 0;
  background: #fff;
  animation: popup_init .3s ease;
  z-index: 10;
}

.js_popupBnr a {
  display: block;
}

.js_popupBnr.max {
  top: auto;
  bottom: 0;
  animation: popup_max .4s ease;
}

.js_popupBnr.mini {
  animation: popup_mini .4s ease;
}

.js_popupBnr .closeBtn {
  position: absolute;
  top: -24px;
  left: 0;
  width: 24px;
  height: 24px;
  background: #033943;
  cursor: pointer;
  z-index: 20;
}

.js_popupBnr .closeBtn:before {
  content: "";
  display: block;
  position: absolute;
  top: 60%;
  left: 50%;
  width: 7px;
  height: 7px;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  transform: translate(-50%, -50%) rotate(45deg);
}

.js_popupBnr.max .closeBtn:before {
  top: 50%;
  width: 1px;
  height: 12px;
  background: #fff;
  border: none;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.js_popupBnr.max .closeBtn:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1px;
  height: 12px;
  background: #fff;
  transform: translate(-50%, -50%) rotate(45deg);
}

.js_popupBnr img.sp {
  display: none;
}

@media screen and (min-width:768px) {
  .js_popupBnr {
    max-width: 300px;
  }
}

@media screen and (max-width: 767px) {
  .js_popupBnr {
    width: 80%;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
  }

  .js_popupBnr img.pc {
    display: none;
  }

  .js_popupBnr img.sp {
    display: inline;
  }

  .js_popupBnr {
    animation: popup_init_sp .3s ease;
  }

  .js_popupBnr.max {
    animation: popup_max_sp .4s ease;
  }

  .js_popupBnr.mini {
    animation: popup_mini_sp .4s ease;
  }

  .js_popupBnr .closeBtn {
    background: #002a52;
  }
}

/*#seminar*/
#seminar #wrap {
  background: #f3f5f5;
}

#seminar .headArea {
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 80px 24px 72px;
}

#seminar .headArea img {
  width: 38px;
}

#seminar .headArea h1 {
  font-size: 36px;
  margin-left: 20px;
  padding-top: 8px;
}

#seminar .seminarArea .body {
  padding-bottom: 120px;
}

#seminar .itemGroup {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 44px;
}

#seminar .itemGroup .item {
  width: calc((100% - 60px)/3);
  margin-right: 30px;
  margin-bottom: 36px;
  /*display: none;*/
  opacity: 0;
  transition: 0.4s ease;
  background: #fff;
}

#seminar .itemGroup .item.show {
  opacity: 1;
}

#seminar .itemGroup .item.on {
  display: block;
}

#seminar .itemGroup .item:nth-of-type(3n) {
  margin-right: 0;
}

#seminar .itemGroup .item a {
  display: block;
  color: #333;
}

#seminar .itemGroup .item a:hover {
  opacity: 0.6;
}

#seminar .itemGroup .item .img {
  padding-top: 76.66%;
  background-position: top center;
  background-size: cover;
  margin: 0;
}

#seminar .itemGroup .item .img img {
  display: none;
}

#seminar .itemGroup .item .txt .title {
  font-size: 15px;
  font-weight: 600;
  padding: 16px 14px;
  border-bottom: 1px solid #ddd;
}

#seminar .itemGroup .item .txt .head {
  display: flex;
  align-items: center;
  padding: 14px 14px 8px;
}

#seminar .itemGroup .item .txt .head .h {
  font-size: 12px;
  font-weight: 600;
  margin-right: 8px;
}

#seminar .itemGroup .item .txt .head .cat {
  font-size: 10px;
  color: #9e9e9e;
  border-radius: 10px;
  border: 1px solid #9e9e9e;
  padding: 0 6px;
}

#seminar .itemGroup .item .txt .date {
  font-size: 12px;
  padding: 0 14px 16px;
}

#seminar .itemGroup .item .txt .tagGroup {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 0 14px 12px;
}

#seminar .itemGroup .item .txt .tagGroup .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 132px;
  height: 32px;
  margin-bottom: 8px;
  border-radius: 3px;
  font-size: 12px;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}

#seminar .itemGroup .item .txt .tagGroup .tag.tag01 {
  background: #ff6666;
}

#seminar .itemGroup .item .txt .tagGroup .tag.tag02 {
  background: #6d7071;
}

#seminar .itemGroup .item .txt .tagGroup .tag.tag03 {
  background: #28b9b9;
}

#seminar .itemGroup .item .txt .tagGroup .tag .ico {
  width: 18px;
  margin-right: 6px;
}

#seminar .more_btn {
  display: flex;
  margin: 0 auto;
  width: 200px;
  height: 48px;
  font-size: 16px;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  border: 2px solid #28b9b9;
  border-radius: 3px;
  color: #28b9b9;
  cursor: pointer;
  transition: 0.4s ease;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.1);
}

#seminar .more_btn:hover {
  opacity: 0.6;
}

#seminar .more_btn span:after {
  display: inline-block;
  position: relative;
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 3px #28b9b9;
  border-right: solid 3px #28b9b9;
  -ms-transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  top: -2px;
  margin-left: 8px;
}

#seminar .btnArea {
  margin-bottom: 36px;
}

#seminar .btnArea .linkBtn {
  width: 280px;
  height: 48px;
  margin: 0 auto;
  border-radius: 3px;
  overflow: hidden;
}

#seminar .btnArea .linkBtn a {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.05em;
  font-weight: 600;
  background: #28b9b9;
}

@media screen and (max-width:767px) {
  #seminar .headArea {
    padding: 40px 16px 36px;
  }

  #seminar .headArea img {
    width: 32px;
  }

  #seminar .headArea h1 {
    font-size: 22px;
    padding-top: 4px;
  }

  #seminar .itemGroup {
    justify-content: space-between;
  }

  #seminar .itemGroup .item {
    width: calc((100% - 15px)/2);
    margin-right: 0;
    margin-bottom: 20px;
  }

  #seminar .itemGroup .item .txt .title {
    font-size: 13px;
    padding: 8px 10px;
  }

  #seminar .itemGroup .item .txt .head {
    padding: 8px 10px;
  }

  #seminar .itemGroup .item .txt .head .h {
    font-size: 10px;
  }

  #seminar .itemGroup .item .txt .head .cat {
    display: inline-block;
  }

  #seminar .itemGroup .item .txt .date {
    font-size: 10px;
    padding: 0 10px 8px;
  }

  #seminar .itemGroup .item .txt .tagGroup .tag {
    font-size: 10px;
    height: 24px;
  }
}

/*seminar document*/
.seminarArea .documentArea {
  background: #fff;
}

.seminarArea .documentArea .container {
  display: flex;
  padding: 48px 40px;
}

.seminarArea .documentArea .container .img {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 264px;
  height: 264px;
  margin-right: 32px;
}

.seminarArea .documentArea .container .img img {
  border: 1px solid #f3f5f5;
}

.seminarArea .documentArea .container .txt {
  flex: 1;
  padding-top: 32px;
}

.seminarArea .documentArea .container .txt p {
  font-size: 16px;
  margin-bottom: 36px;
}

.seminarArea .documentArea .container .txt .btn {
  display: inline-block;
}

.seminarArea .documentArea .container .txt .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  background: #fe7a0c;
  color: #fff;
  padding: 16px;
  font-size: 18px;
  font-weight: 600;
}

.seminarArea .documentArea .container .txt .btn img {
  width: 25px;
  margin-right: 8px;
}

@media screen and (max-width:767px) {
  .seminarArea .documentArea .container {
    display: block;
    padding: 24px 0;
  }

  .seminarArea .documentArea .container .img {
    display: none;

  }

  .seminarArea .documentArea .container .txt {
    text-align: center;
  }

  .seminarArea .documentArea .container .txt p {
    text-align: left;
    font-size: 14px;
  }

  .seminarArea .documentArea .container .txt .btn a {
    text-align: left;
    font-size: 16px;
  }
}

/*contact_btn*/
.contact_btn {
  position: fixed;
  bottom: 30px;
  right: 20px;
  overflow: inherit !important;
  transition: 0.4s ease;
  z-index: 3;
}

.contact_btn.on {
  bottom: 30px;
}

.contact_btn a {
  display: block;
  box-sizing: border-box;
  width: 310px;
  height: 200px;
  border-radius: 6px;
  background: #fe7a0c;
  color: #fff;
  font-size: 12px;
  text-align: center;
  padding: 24px 15px 12px;
  cursor: pointer;
  box-shadow: 0 4px 0 #E56700;
}

.contact_btn a:hover {
  opacity: 1;
  transform: translateY(4px);
  box-shadow: 0 0 0 #E56700;
}

.contact_btn .shoulder {
  display: flex;
  width: 102px;
  height: 28px;
  justify-content: center;
  align-items: center;
  border-radius: 2px;
  font-size: 16px;
  font-weight: 600;
  background: #fff;
  color: #fe7a0c;
  margin: 0 auto 10px;
}

.contact_btn .head {
  display: flex;
  gap: 10px;
  margin-bottom: 8px;
  padding-bottom: 12px;
  border-bottom: 3px solid #fff;
}

.contact_btn .ico {
  flex-shrink: 0;
}

.contact_btn .ico img {
  width: 65px;
}

.contact_btn .head .title {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.33;
  text-align: left;
}

.contact_btn .txt {
  font-size: 12px;
  line-height: 1.83;
  text-align: center;
  white-space: nowrap;
}

@media screen and (max-width:767px) {
  .contact_btn {
    bottom: 20px;
    right: 16px;
  }

  .contact_btn.on {
    bottom: 20px;
  }

  .contact_btn a {
    display: flex;
    width: 232px;
    height: 64px;
    align-items: center;
    padding: 10px 12px;
    gap: 10px;
  }

  .contact_btn .shoulder {
    width: 66px;
    height: 36px;
    font-size: 12px;
    margin-bottom: 0;
  }

  .contact_btn .head {
    margin: 0;
    padding: 0;
    border: none;
  }

  .contact_btn .ico {
    display: none;
  }

  .contact_btn .head .title {
    font-size: 14px;
    line-height: 1.5;
    white-space: nowrap;
  }

  .contact_btn .txt {
    display: none;
  }

}

/* ------------------------ ondemand */
.homeOndemandSection {
  padding: 72px 0 80px;
  background: #e9f8f8;
}

.homeOndemandSection .btnArea {
  display: flex;
  justify-content: center;
  margin-top: 32px;
}

.homeOndemandSection .btn a {
  display: block;
  box-sizing: border-box;
  padding: 0 18px;
  color: #fff;
  border-radius: 3px;
  box-shadow: 0px 1px 2px rgb(0 0 0 / 10%);
  font-size: 16px;
  font-weight: 600;
  line-height: 48px;
  background: linear-gradient(90deg, #33bdbd, #26b6b6);
}

#ondemand #wrap {
  background-color: #f3f5f5;
}

.ondemandHead {
  padding: 80px 24px 72px;
  background: #f3f5f5;
  text-align: center;
}

.ondemandHead__title img {
  margin-right: 24px;
}

.ondemandHead__lead {
  margin-top: 12px;
  font-size: 20px;
  font-weight: 700;
}

.ondemandArea {
  padding-bottom: 80px;
  background-color: #f3f5f5;
}

.ondemandSection:not(:last-of-type) {
  margin-bottom: 64px;
}

.ondemandSection__head {
  margin-bottom: 32px;
  text-align: center;
}

.ondemandSection__heading {
  font-size: 24px;
  font-weight: 700;
}

.ondemandSection__lead {
  margin-top: 20px;
  font-size: 16px;
  font-weight: 700;
}

.ondemandList {
  display: flex;
  flex-wrap: wrap;
  margin-top: -40px;
}

.ondemandList__item {
  width: calc((100% - 48px) / 3);
  margin: 40px 24px 0 0;
  font-size: 15px;
}

.ondemandList__item:nth-child(3n) {
  margin-right: 0;
}

.ondemandList__item a {
  color: inherit;
}

.ondemandList__img {
  position: relative;
  margin: 0 0 20px;
}

.ondemandList__img img {
  width: 100%;
}

.ondemandList__time {
  position: absolute;
  right: 8px;
  bottom: 8px;
  padding: 4px 5px 3px;
  background-color: rgba(31, 31, 31, .9);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  font-family: 'Roboto';
  line-height: 1;
}

@media screen and (max-width:767px) {
  .homeOndemandSection {
    padding: 64px 0;
  }

  .homeOndemandSection .btn a {
    padding: 0 14px;
  }

  .ondemandHead {
    padding: 40px 16px 36px;
  }

  .ondemandHead__title img {
    width: 24px;
    margin-right: 10px;
  }

  .ondemandList__time {
    padding: 3px;
    font-size: 10px;
  }

  .ondemandHead__lead {
    margin-top: 10px;
    font-size: 14px;
  }

  .ondemandArea {
    padding-bottom: 56px;
  }

  .ondemandSection:not(:last-of-type) {
    margin-bottom: 48px;
  }

  .ondemandSection__head {
    margin-bottom: 24px;
  }

  .ondemandSection__heading {
    font-size: 18px;
  }

  .ondemandSection__lead {
    margin-top: 10px;
    font-size: 14px;
  }

  .ondemandList {
    justify-content: space-between;
    margin-top: -30px;
  }

  .ondemandList__item {
    width: calc((100% - 15px) / 2);
    margin: 30px 0 0 0;
    font-size: 13px;
  }

  .ondemandList__img {
    margin: 0 0 10px;
  }

  .ondemandForm .submitBlk {
    align-items: center;
  }

  .ondemandForm .formGroup dd {
    padding-left: 0;
  }
}

/*smarttg*/
#smarttg .headArea {
  background: url("/img/bg_smarttg_pc.jpg") no-repeat right center / cover;
}

#smarttg .headArea .inner {
  padding: 94px 0 64px;
  background: none;
}

#smarttg .headArea .txtBlock {
  position: relative;
  max-width: 354px;
  color: #fff;
}

#smarttg .headArea .txtBlock .shoulder {
  font-size: 18px;
  margin-bottom: 16px;
}

#smarttg .headArea .txtBlock .logo {
  width: 254px;
  margin-bottom: 24px;
}

#smarttg .headArea .txtBlock p:last-of-type {
  font-size: 14px;
  line-height: 2;
  margin-bottom: 0;
}

#smarttg .headArea .circle {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 100%;
  width: 96px;
  height: 96px;
  background-color: #FF6716;
  border-radius: 50%;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}

#smarttg .headArea .btnArea {
  margin-top: 24px;
}

#smarttg .headArea .btnArea.sp {
  display: none;
}

@media screen and (max-width:767px) {
  #smarttg .headArea {
    background: none;
  }

  #smarttg .headArea .inner {
    padding: 0;

  }

  #smarttg .headArea .txtBlock {
    max-width: 100%;
    color: #333;
    padding: 32px 0 40px;
  }

  #smarttg .headArea .txtBlock .logo {
    display: none;
  }

  #smarttg .headArea .circle {
    display: none;
  }

  #smarttg .headArea .contentSP {
    position: relative;
  }

  #smarttg .headArea .btnArea.sp {
    display: block;
    position: absolute;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    width: 240px;
  }

  #smarttg .headArea .btnArea.pc {
    display: none;
  }
}

.smarttgArea * {
  box-sizing: border-box;
}

.smarttgArea .layout {
  max-width: 900px;
}

.smarttgArea .section .body {
  padding: 72px 0 80px;
  background: #F3F5F5;
}

.smarttgArea .section .head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 132px;
  text-align: center;
  position: relative;
}

.smarttgArea .section .head:after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #fff transparent transparent transparent;
}

.smarttgArea .section .head h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.32;
}

.smarttgArea .section .head h2 .min {
  display: block;
  font-size: 22px;
  margin-bottom: 8px;
}

@media screen and (max-width:767px) {
  .smarttgArea .section .head {
    height: auto;
  }

  .smarttgArea .section .head h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .smarttgArea .section .head h2 .min {
    font-size: 14px;
  }

  .smarttgArea .section .body {
    padding: 40px 0 64px;
  }
}

.smarttgArea .service .head {
  background: #FF6716;
  color: #fff;
}

.smarttgArea .service .head:after {
  border-color: #FF6716 transparent transparent transparent;
}

.smarttgArea .service .lead {
  text-align: center;
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 29px;
}

.smarttgArea .service .sceneBlock .h {
  text-align: center;
  background: #FF6716;
  color: #fff;
  font-size: 22px;
  line-height: 1.27;
  padding: 18px;
}

.smarttgArea .service .sceneBlock .itemGroup {
  background: #fff;
  padding: 50px 90px 34px;
  display: flex;
  flex-wrap: wrap;
}

.smarttgArea .service .sceneBlock .itemGroup .item {
  max-width: 180px;
  width: calc(100%/4);
  margin-bottom: 16px;
}

.smarttgArea .service .sceneBlock .itemGroup .item .ico {
  width: 80px;
  margin: 0 auto 13px;
}

.smarttgArea .service .sceneBlock .itemGroup .item .title {
  height: 42px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  line-height: 1.4;
  text-align: center;
}

.smarttgArea .service .banner {
  max-width: 748px;
  width: fit-content;
  margin: 50px auto 0;
}

.smarttgArea .service .banner a {
  display: block;
  width: 100%;
  height: 100%;
}

.smarttgArea .service .banner .sp {
  display: none;
}

@media screen and (max-width:767px) {
  .smarttgArea .service .lead {
    font-size: 14px;
    margin-bottom: 20px;
  }

  .smarttgArea .service .sceneBlock .itemGroup {
    padding: 32px;
  }

  .smarttgArea .service .sceneBlock .itemGroup .item {
    width: calc(100%/2);
  }

  .smarttgArea .service .sceneBlock .itemGroup .item .title {
    font-size: 12px;
  }

  .smarttgArea .service .banner .sp {
    display: block;
  }

  .smarttgArea .service .banner .pc {
    display: none;
  }
}

.smarttgArea .solution .itemGroup {
  display: flex;
  justify-content: space-between;
}

.smarttgArea .solution .itemGroup .item {
  width: calc((100% - 60px)/2);
  background: #fff;
  padding: 32px;
}

.smarttgArea .solution .itemGroup .item .h {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  background: #FF6716;
  color: #fff;
  margin-bottom: 24px;
  font-size: 22px;
}

.smarttgArea .solution .itemGroup .item:first-of-type .h .ico {
  width: 26px;
  margin-right: 14px;
}

.smarttgArea .solution .itemGroup .item:last-of-type .h .ico {
  width: 25px;
  margin-right: 14px;
}

.smarttgArea .solution .itemGroup .item ul li {
  position: relative;
  font-size: 18px;
  line-height: 1.75;
  padding-left: 30px;
}

.smarttgArea .solution .itemGroup .item ul li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 20px;
  height: 20px;
  background-image: url("/img/smarttg_solution_ico_03.svg");
}

@media screen and (max-width:767px) {
  .smarttgArea .solution .itemGroup {
    display: block;
  }

  .smarttgArea .solution .itemGroup .item {
    width: 100%;
    margin-bottom: 18px;
  }

  .smarttgArea .solution .itemGroup .item ul li {
    font-size: 14px;
  }

  .smarttgArea .solution .itemGroup .item ul li::before {
    width: 16px;
    height: 16px;
  }
}

.smarttgArea .security .itemGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.smarttgArea .security .itemGroup .item {
  background: #fff;
  width: calc((100% - 36px)/3);
  margin-bottom: 18px;
  margin-right: 18px;
  padding: 20px 0 26px;
}

.smarttgArea .security .itemGroup .item:nth-of-type(3n),
.smarttgArea .security .itemGroup .item:last-of-type {
  margin-right: 0;
}

.smarttgArea .security .itemGroup .item .ico {
  width: 34px;
  min-height: 34px;
  margin: 0 auto 4px;
}

.smarttgArea .security .itemGroup .item .h {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 51px;
  font-size: 18px;
  line-height: 1.5;
  color: #FF6716;
  margin-bottom: 16px;
}

.smarttgArea .security .itemGroup .item p {
  padding: 0 24px;
}

@media screen and (max-width:767px) {
  .smarttgArea .security .itemGroup {
    display: block;
  }

  .smarttgArea .security .itemGroup .item {
    width: 100%;
  }
}

.smarttgArea .future .img {
  margin-bottom: 40px;
}

.smarttgArea .future .head {
  background: #1D1D1D;
  color: #fff;
}

.smarttgArea .future .head:after {
  border-color: #1D1D1D transparent transparent transparent;
}

.smarttgArea .future .itemGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.smarttgArea .future .itemGroup .item {
  background: #fff;
  width: calc((100% - 36px)/3);
  margin-bottom: 18px;
  margin-right: 18px;
  padding: 20px 0 26px;
}

.smarttgArea .future .itemGroup .item:nth-of-type(3n),
.smarttgArea .future .itemGroup .item:last-of-type {
  margin-right: 0;
}

.smarttgArea .future .itemGroup .item .ico {
  width: 34px;
  height: 34px;
  margin: 0 auto 4px;
}

.smarttgArea .future .itemGroup .item .h {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 51px;
  font-size: 18px;
  line-height: 1.5;
  color: #1D1D1D;
  margin-bottom: 16px;
}

.smarttgArea .future .itemGroup .item p {
  padding: 0 24px;
}

@media screen and (max-width:767px) {
  .smarttgArea .future .itemGroup {
    display: block;
  }

  .smarttgArea .future .itemGroup .item {
    width: 100%;
  }
}

/* release */
.release {
  width: 95%;
}

.release p {
  margin: 20px auto;
  line-height: 1.5em;
}

.release .right p {
  text-align: right;
}

.release .title {
  font-weight: bold;
  font-size: 1.5em;
  line-height: 1.5em;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 20px;
}

.release ul {
  margin: 1.0em 2.0em;
}

.release ol {
  margin: 1.0em 2.0em;
}


.release li {
  list-style: disc;
  line-height: 1.5em;
}

.release h3 {
  font-weight: bold;
  margin-top: 10px;
}

.release .boiler h3 {
  font-weight: bold;
  text-decoration: underline !important;
}

/*managed*/
.managedArea * {
  box-sizing: border-box;
}

.headArea.managed {
  background: url("/img/bg_managed.jpg") no-repeat center center / cover;

}

.headArea.managed .inner {
  background: none;
  padding: 97px 0 82px;
}

.headArea.managed h1 {
  margin-bottom: 40px;
}

.headArea.managed p {
  margin-bottom: 52px;
}

.managedArea .section .head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 132px;
  text-align: center;
  position: relative;
  background: #346BFF;
  color: #fff;
  padding: 0 24px;
}

.managedArea .section .head:after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #346BFF transparent transparent transparent;
}

.managedArea .section .head h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.32;
}

.managedArea .section .head h2 .min {
  display: block;
  font-size: 22px;
  margin-bottom: 8px;
}

.managedArea .section .body {
  padding: 70px 0 80px;
  background: #F3F4F5;
}

.managedArea .sp {
  display: none;
}

.managed .btn {
  margin-top: 32px;
  width: 280px;
  height: 60px;
  border-radius: 30px;
  overflow: hidden;
}

.managed .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ff7300;
  color: #fff;
  width: 100%;
  height: 100%;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.managed .btn a .ico {
  margin-right: 16px;
}

.managedArea .section .lead {
  text-align: center;
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 35px;
}

.managedArea .about .table01 {
  margin-bottom: 40px;
}

.managedArea .about .table01 table {
  width: 100%;
  font-weight: 600;
  border-collapse: collapse;
}

.managedArea .about .table01 table th {
  background: rgba(52, 107, 255, 0.7);
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  padding: 10px;
}

.managedArea .about .table01 table td {
  background: #fff;
  padding: 24px 10px;
  text-align: center;
  font-size: 16px;
}

.managedArea .about .table01 table td .large {
  font-size: 24px;
}

.managedArea .about .table01 table td .min {
  font-size: 14px;
}

.managedArea .about .gridArea .h {
  background: rgba(52, 107, 255, 0.7);
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  padding: 24px 10px;
  text-align: center;
}

.managedArea .about .itemGroup.grid {
  background: #fff;
  display: grid;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 16px;
  padding: 35px 20px;
}

.managedArea .about .itemGroup.grid .item {
  position: relative;
  background: #EAF0FF;
  display: flex;
  align-items: center;
  padding: 24px 12px 20px;
  font-size: 16px;
  font-weight: 600;
  gap: 10px;
}

.managedArea .about .itemGroup.grid .item .ico {
  flex-shrink: 0;
}

.managedArea .about .itemGroup.grid .item .tag {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  font-size: 13px;
  background: #FFDD50;
  border-radius: 17px;
  min-width: 134px;
  text-align: center;
  line-height: 30px;
  padding: 0 8px;
}

.managedArea .about .bannerArea {
  margin-top: 80px;
}

.managedArea .about .bannerArea .banner {
  width: fit-content;
  max-width: 748px;
  margin: 0 auto;
}

.managedArea .about .bannerArea .banner a {
  display: block;
  width: 100%;
}

.managedArea .feature .table02 {
  margin-bottom: 32px;
}

.managedArea .feature .table02:last-of-type {
  margin-bottom: 0;
}

.managedArea .feature .table02 table {
  border-collapse: collapse;
}

.managedArea .feature .table02 th {
  font-size: 16px;
  font-weight: 600;
  vertical-align: baseline;
  min-width: 204px;
  padding: 20px;
}

.managedArea .feature .table02 table tr:nth-of-type(1) th {
  background: rgba(11, 214, 180, 0.2);
}

.managedArea .feature .table02 table tr:nth-of-type(2) th {
  background: rgba(52, 107, 255, 0.2);
}

.managedArea .feature .table02 td {
  background: #fff;
  vertical-align: baseline;
  padding: 32px 32px 28px;
}

.managedArea .feature .table02 td p {
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 18px;
}

.managedArea .feature .table02 td p:last-of-type {
  margin-bottom: 0;
}

.managedArea .feature .table02 table tr:nth-of-type(1) td {
  border-bottom: 1px solid #DEE6EB;
}

.managedArea .feature .table02 .tag {
  width: 120px;
  text-align: center;
  line-height: 28px;
  color: #fff;
  white-space: nowrap;
  border-radius: 14px;
  margin: 0 auto 12px;
}

.managedArea .feature .table02 table tr:nth-of-type(1) th .tag {
  background: #0BD6B4;
}

.managedArea .feature .table02 table tr:nth-of-type(2) th .tag {
  background: #346BFF;
}

.managedArea .feature .table02 ul {
  margin-top: 18px;
}

.managedArea .feature .table02 ul li {
  position: relative;
  padding-left: 12px;
  font-size: 14px;
  margin-bottom: 12px;
}

.managedArea .feature .table02 ul li::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 4px;
  background: #0BD6B4;
  border-radius: 50%;
  top: 9px;
  left: 0;
}

.managedArea .feature .table02 .note {
  font-size: 12px;
}

.managedArea .feature .table02 .min {
  font-size: 14px;
}

.managedArea .feature .itemGroup {
  display: flex;
  gap: 48px 40px;
  flex-wrap: wrap;
}

.managedArea .feature .itemGroup .item {
  position: relative;
  background: #fff;
  font-weight: 600;
}

.managedArea .feature .itemGroup .item::before {
  content: "";
  position: absolute;
  top: 32px;
  left: 32px;
  width: 38px;
  height: 30px;
  background: url("/img/managed_feature_ico_01.svg");
  background-size: contain;
  transform: rotate(180deg);
  background-repeat: no-repeat;
}

.managedArea .feature .itemGroup .item::after {
  content: "";
  position: absolute;
  bottom: 32px;
  right: 32px;
  width: 38px;
  height: 30px;
  background: url("/img/managed_feature_ico_01.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.managedArea .feature .itemGroup .item.col1 {
  width: 100%;
  padding: 80px 32px 72px;
  text-align: center;
}

.managedArea .feature .itemGroup .item.col2 {
  width: calc((100% - 40px)/2);
  padding: 70px 40px;
  display: flex;
  flex-direction: column;
}

.managedArea .feature .itemGroup .item.col2 p {
  margin-bottom: 36px;
}

.managedArea .feature .itemGroup .item.col2 .img {
  margin: auto auto 0;
}

.managedArea .feature .itemGroup .item.col2::before {
  top: 20px;
  left: 20px;
}

.managedArea .feature .itemGroup .item.col2::after {
  bottom: 20px;
  right: 20px;
}

.managedArea .feature .itemGroup .item .h {
  font-size: 23px;
  color: #346BFF;
  margin-bottom: 32px;
  text-align: center;
}

.managedArea .feature .itemGroup .item.col1 .inner {
  display: flex;
  gap: 64px;
}

.managedArea .feature .itemGroup .item.col1 .inner .box {
  position: relative;
  width: calc((100% - 64px)/2);
  background: #DEE6EB;
}

.managedArea .feature .itemGroup .item.col1 .inner .box:nth-of-type(1)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -44px;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 20px 0 20px 24px;
  border-color: transparent transparent transparent #346aff;
}

.managedArea .feature .itemGroup .item.col1 .inner .box:nth-of-type(2) {
  background: #E8EFFF;
}

.managedArea .feature .itemGroup .item.col1 .inner .box .h {
  padding: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  gap: 20px;
  background: #78909C;
  color: #fff;
  margin-bottom: 0;
}

.managedArea .feature .itemGroup .item.col1 .inner .box:nth-of-type(2) .h {
  background: #346BFF;
}

.managedArea .feature .itemGroup .item.col1 .inner .box .txtArea {
  padding: 28px 56px;
}

.managedArea .feature .itemGroup .item.col1 .inner .box .txtArea .txt {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: 28px;
}

.managedArea .feature .itemGroup .item.col1 .inner .box .txtArea .txt:last-of-type {
  margin-bottom: 0;
}

.managedArea .feature .itemGroup .item.col1 .inner .box .txtArea .txt .tag {
  font-size: 16px;
  width: 95px;
  line-height: 26px;
  white-space: nowrap;
  background: #90A4AE;
  color: #fff;
  font-weight: 300;
}

.managedArea .feature .itemGroup .item.col1 .inner .box:nth-of-type(2) .txtArea .txt .tag {
  background: #85A6FF;
}

.managedArea .feature .itemGroup .item .marker {
  background: rgba(52, 107, 255, 0.1);
  padding: 0 4px;
}

.managedArea .section.support {
  background: #E8EFFF;
}

.managedArea .section.support .body {
  background: #E8EFFF;
}

.managedArea .section.support .head {
  background: #fff;
  font-size: 25px;
  color: #333333;
}

.managedArea .section.support .head:after {
  border-color: #fff transparent transparent transparent;
}

.managedArea .support .gridGroup {
  display: grid;
  grid-template-rows: auto 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-row-gap: 10px;
  margin-bottom: 32px;
}

.managedArea .support .gridGroup .item {
  display: flex;
  justify-content: center;
  align-items: center;
}

.managedArea .support .gridGroup .item.h {
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  padding: 24px;
  line-height: 1.33;
  background: #346BFF;
}

.managedArea .support .gridGroup .item.content {
  position: relative;
  background: #fff;
  margin: 0 5px;
  padding: 20px;
  text-align: center;
  font-size: 14px;
}

.managedArea .support .gridGroup .item.h:nth-of-type(1) {
  grid-column: 1/2;
  grid-row: 1/2;
}

.managedArea .support .gridGroup .item.h:nth-of-type(2) {
  grid-column: 2/3;
  grid-row: 1/2;
  background: rgba(52, 107, 255, 0.8);
}

.managedArea .support .gridGroup .item.h:nth-of-type(3) {
  grid-column: 3/4;
  grid-row: 1/2;
  background: rgba(52, 107, 255, 0.6);
}

.managedArea .support .gridGroup .item.h:nth-of-type(4) {
  grid-column: 4/5;
  grid-row: 1/2;
  background: rgba(52, 107, 255, 0.4);
}

.managedArea .support .gridGroup .item.h:nth-of-type(5) {
  grid-column: 5/6;
  grid-row: 1/2;
  background: rgba(52, 107, 255, 0.3);
}

.managedArea .support .gridGroup .item.content:nth-of-type(6) {
  grid-column: 1/2;
  grid-row: 2/3;
}

.managedArea .support .gridGroup .item.content:nth-of-type(7) {
  grid-column: 1/2;
  grid-row: 3/4;
}

.managedArea .support .gridGroup .item.content:nth-of-type(8) {
  grid-column: 2/3;
  grid-row: 2/3;
}

.managedArea .support .gridGroup .item.content:nth-of-type(9) {
  grid-column: 2/3;
  grid-row: 3/4;
}

.managedArea .support .gridGroup .item.content:nth-of-type(10) {
  grid-column: 3/4;
  grid-row: 2/3;
}

.managedArea .support .gridGroup .item.content:nth-of-type(11) {
  grid-column: 3/4;
  grid-row: 3/4;
}

.managedArea .support .gridGroup .item.content:nth-of-type(12) {
  grid-column: 4/5;
  grid-row: 2/3;
}

.managedArea .support .gridGroup .item.content:nth-of-type(13) {
  grid-column: 4/5;
  grid-row: 3/4;
}

.managedArea .support .gridGroup .item.content:nth-of-type(14) {
  grid-column: 5/6;
  grid-row: 2/3;
}

.managedArea .support .gridGroup .item.content .tagGroup {
  position: absolute;
  top: 8px;
  left: 8px;
  display: flex;
  gap: 4px;
}

.managedArea .support .gridGroup .item.content .tagGroup .tagA,
.managedArea .support .txtArea .tagA {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #346BFF;
}

.managedArea .support .gridGroup .item.content .tagGroup .tagB,
.managedArea .support .txtArea .tagB {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #0BD6B4;
}

.managedArea .section.support .txtArea {
  margin-left: 5px;
}

.managedArea .section.support .txtArea .txt {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
  font-size: 14px;
}

.managedArea .section.support .txtArea .tagA,
.managedArea .section.support .txtArea .tagB {
  margin-top: 5px;
}

.managedArea .case .itemGroup {
  display: flex;
  gap: 30px;
}

.managedArea .case .itemGroup .item {
  width: calc((100% - 60px)/3);
  transition: 0.4s ease;
  background: #fff;
}

.managedArea .case .itemGroup .item a {
  display: block;
  color: #333;
}

.managedArea .case .itemGroup .item .img {
  padding-top: 54%;
  background-position: top center;
  background-size: cover;
  margin: 0;
}

.managedArea .case .itemGroup .item .img img {
  display: none;
}

.managedArea .case .itemGroup .item .txt {
  position: relative;
  padding: 60px 20px 72px;
}

.managedArea .case .itemGroup .item .txt::before {
  content: "";
  position: absolute;
  top: 20px;
  left: 20px;
  width: 26px;
  height: 20px;
  background: url("/img/managed_feature_ico_01.svg");
  background-size: contain;
  transform: rotate(180deg);
  background-repeat: no-repeat;
}

.managedArea .case .itemGroup .item .txt::after {
  content: "";
  position: absolute;
  bottom: 20px;
  right: 20px;
  width: 26px;
  height: 20px;
  background: url("/img/managed_feature_ico_01.svg");
  background-size: contain;
  background-repeat: no-repeat;

}

.managedArea .case .itemGroup .item .txt .name {
  font-size: 18px;
  font-weight: 600;
  color: #346BFF;
  text-align: center;
  margin-bottom: 34px;
}

.managedArea .case .itemGroup .item .txt p {
  font-size: 14px;
}

@media screen and (min-width:768px) {
  .managedArea .about .table01 table th {
    width: calc(100%/4);
    border-right: 2px solid #EAF0FF;
  }

  .managedArea .about .table01 table th:last-of-type {
    background: #78909C;
    border: none;
  }

  .managedArea .about .table01 table td {
    border-right: 2px solid #EAF0FF;
  }

  .managedArea .about .table01 table td:last-of-type {
    border: none;
    background: #DEE6EB;
  }
}

@media screen and (max-width:1024px) {
  .managedArea .section .head {
    padding: 0 16px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box .txtArea {
    padding: 16px;
  }
}

@media screen and (max-width:767px) {
  .headArea.managed {
    background: url("/img/bg_managed_sp.jpg") no-repeat center center / cover;

  }

  .headArea.managed .inner {
    padding: 35px 0 54px;
  }

  .headArea.managed h1 {
    margin-bottom: 24px;
  }

  .headArea.managed h1 img {
    width: 289px;
  }

  .managed .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .managed .btn a {
    font-size: 16px;
  }

  .managed .btn .ico {
    width: 21px;
  }

  .managedArea .section .head {
    height: auto;
  }

  .managedArea .section .head h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .managedArea .section .head h2 .min {
    font-size: 14px;
  }

  .managedArea .section .body {
    padding: 40px 0 64px;
  }

  .managedArea .sp {
    display: block;
  }

  .managedArea .pc {
    display: none;
  }

  .managedArea .section .lead {
    font-size: 14px;
    margin-bottom: 20px;
    text-align: left;
  }

  .managedArea .about .table01 table th {
    font-size: 15px;
  }

  .managedArea .about .table01 table td {
    font-size: 14px;
    padding: 10px;
  }

  .managedArea .about .table01 table tr:nth-last-of-type(2) th {
    background: #78909C;
  }

  .managedArea .about .table01 table tr:last-of-type td {
    background: #DEE6EB;
  }

  .managedArea .about .itemGroup.grid {
    display: block;
    padding: 24px;
  }

  .managedArea .about .gridArea .h {
    font-size: 15px;
    padding: 10px;
  }

  .managedArea .about .itemGroup.grid .item {
    font-size: 14px;
    margin-bottom: 16px;
  }

  .managedArea .about .itemGroup.grid .item:last-of-type {
    margin-bottom: 0;
  }

  .managedArea .about .itemGroup.grid .item .tag {
    line-height: 24px;
    top: -8px;
    left: 12px;
    transform: none;
  }

  .managedArea .feature .table02 th {
    min-width: auto;
    display: block;
    padding: 16px;
    font-size: 15px;
  }

  .managedArea .feature .table02 .tag {
    padding-top: 1px;
    line-height: 23px;
    margin-bottom: 8px;
  }

  .managedArea .feature .table02 td {
    display: block;
    padding: 16px 24px;
  }

  .managedArea .feature .table02 td p {
    font-size: 14px;
  }

  .managedArea .feature .table02 ul li {
    font-size: 12px;
  }

  .managedArea .feature .table02 .min {
    font-size: 12px;
  }

  .managedArea .feature .table02 .note {
    font-size: 10px;
  }

  .managedArea .feature .itemGroup {
    display: block;
  }

  .managedArea .feature .itemGroup .item {
    font-size: 14px;
    margin-bottom: 20px;
    padding: 52px 24px !important;
  }

  .managedArea .feature .itemGroup .item::before {
    top: 16px;
    left: 16px;
    width: 26px;
    height: 20px;
  }

  .managedArea .feature .itemGroup .item::after {
    bottom: 16px;
    right: 16px;
    width: 26px;
    height: 20px;
  }

  .managedArea .feature .itemGroup .item:last-of-type {
    margin-bottom: 0;
  }

  .managedArea .feature .itemGroup .item.col1 {
    text-align: left;
  }

  .managedArea .feature .itemGroup .item.col2 {
    width: 100%;
  }

  .managedArea .feature .itemGroup .item.col2 p {
    margin-bottom: 16px;
  }

  .managedArea .feature .itemGroup .item .h {
    font-size: 15px;
    margin-bottom: 16px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner {
    display: block;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box {
    width: 100%;
    margin-bottom: 64px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box .h {
    font-size: 15px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box .txtArea .txt {
    gap: 16px;
    margin-bottom: 16px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box .txtArea .txt .tag {
    text-align: center;
    font-size: 14px;
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box:first-of-type::after {
    top: auto;
    right: auto;
    bottom: -56px;
    left: 50%;
    transform: translateX(-50%) rotate(90deg);
  }

  .managedArea .feature .itemGroup .item.col1 .inner .box:last-of-type {
    margin-bottom: 0;
  }

  .managedArea .support .gridGroup {
    grid-template-columns: auto auto;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-row-gap: 0;
    grid-column-gap: 10px;
  }

  .managedArea .support .gridGroup .item.h {
    font-size: 15px;
  }

  .managedArea .support .gridGroup .item.content {
    margin: 5px 0;
    padding: 16px 20px;
  }

  .managedArea .support .gridGroup .item.h:nth-of-type(1) {
    grid-column: 1/2;
    grid-row: 1/3;
  }

  .managedArea .support .gridGroup .item.h:nth-of-type(2) {
    grid-column: 1/2;
    grid-row: 3/5;
  }

  .managedArea .support .gridGroup .item.h:nth-of-type(3) {
    grid-column: 1/2;
    grid-row: 5/7;
  }

  .managedArea .support .gridGroup .item.h:nth-of-type(4) {
    grid-column: 1/2;
    grid-row: 7/9;
  }

  .managedArea .support .gridGroup .item.h:nth-of-type(5) {
    grid-column: 1/2;
    grid-row: 9/11;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(6) {
    grid-column: 2/3;
    grid-row: 1/2;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(7) {
    grid-column: 2/3;
    grid-row: 2/3;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(8) {
    grid-column: 2/3;
    grid-row: 3/4;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(9) {
    grid-column: 2/3;
    grid-row: 4/5;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(10) {
    grid-column: 2/3;
    grid-row: 5/6;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(11) {
    grid-column: 2/3;
    grid-row: 6/7;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(12) {
    grid-column: 2/3;
    grid-row: 7/8;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(13) {
    grid-column: 2/3;
    grid-row: 8/9;
  }

  .managedArea .support .gridGroup .item.content:nth-of-type(14) {
    grid-column: 2/3;
    grid-row: 9/10;
  }

  .managedArea .section.support .txtArea .txt {
    margin-bottom: 0;
  }

  .managedArea .case .itemGroup {
    display: block;
  }

  .managedArea .case .itemGroup .item {
    width: 100%;
    margin-bottom: 20px;
  }

  .managedArea .case .itemGroup .item:last-of-type {
    margin-bottom: 0;
  }

  .managedArea .case .itemGroup .item .img {
    padding-top: 53.72%;
  }

  .managedArea .case .itemGroup .item .txt {
    padding: 52px 24px;
  }

  .managedArea .case .itemGroup .item .txt .name {
    font-size: 15px;
    margin-bottom: 16px;
  }
}

/*managedLp*/
.lato {
  font-family: 'Lato', sans-serif;
}

.managedLp {
  position: relative;
}

.managedLp .sp {
  display: none;
}

.managedLp #wrap {
  padding-top: 0;
}

.managedLp header {
  background: #F3F4F5;
}

.managedLp #header {
  position: relative;
  justify-content: space-between;
  height: 80px;
  max-width: 1366px;
  padding-right: 62px;
  margin: 0 auto;
  background: #F3F4F5;
}

.managedLp #header .logo {
  width: 205px;
  padding: 0;
}

.managedLp #header .btnNav {
  display: none;
}

.managedLp #header .navGroup {
  display: flex;
  align-items: center;
}

.managedLp #header .linkGroup ul {
  display: flex;
  gap: 44px;
  margin-right: 72px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.managedLp #header .phone {
  width: 198px;
}

.managedLp #header .phone a {
  width: 100%;
  height: 38px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #346BFF;
  border-radius: 19px;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  gap: 8px;
}

.managedLp .formArea {
  width: 460px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  padding: 0;
  flex-shrink: 0;
  z-index: 2;
}

.managedLp .formHead {
  background: #346BFF;
  text-align: center;
  padding: 16px;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  line-height: 1.33;
}

.managedLp .formBody {
  padding: 18px 32px 27px;
  background: #fff;
}

.managedLp .formArea .formGroup {
  padding: 5px 0px;
}

.managedLp .formArea .formGroup dl {
  display: block;
}

.managedLp .formArea .formGroup dt {
  width: 100%;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  line-height: 1.285;
}

.managedLp .formArea .required {
  display: inline-block;
  width: 40px;
  line-height: 18px;
  font-size: 10px;
  font-weight: 600;
  border-radius: 2px;
  background: #346BFF;
  margin-left: 16px;
  vertical-align: top;
  color: #fff;
  letter-spacing: 0.1em;
  text-align: center;
}

.managedLp .formArea .formGroup dd {
  width: 100%;
  padding: 0;
}

.managedLp .formArea .formGroup input[type="text"],
.managedLp .formArea .formGroup input[type="email"],
.managedLp .formArea .formGroup input[type="number"],
.managedLp .formArea .formGroup textarea {
  width: 100%;
  padding: 6px;
  background: #fff;
  border: 1px solid #CFD8DC;
  font-size: 16px;
  outline: 0;
  -webkit-appearance: none;
}

.managedLp .formArea .formGroup input[type="text"],
.managedLp .formArea .formGroup input[type="email"],
.managedLp .formArea .formGroup input[type="number"] {
  height: 34px;
}

.managedLp .formArea input[type="submit"] {
  width: 286px;
  border-radius: 28px;
  font-weight: 600;
  line-height: 56px;
  padding-left: 103px;
  text-align: left;
}

.managedLp .formArea .privacyText {
  text-align: left;
  margin: 15px 0 20px;
}

.managedLp .formArea .submitBlk {
  margin-top: 0;
}

.managedLp .formArea .submitBlk .btn {
  position: relative;
}

.managedLp .formArea .submitBlk .btn::after {
  position: absolute;
  top: 17px;
  left: 68px;
  content: "";
  width: 20px;
  height: 22px;
  background-image: url("/img/kv_ico_download.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.managedLp .kvArea * {
  box-sizing: border-box;
}

.managedLp .kvArea {
  position: relative;
}

.managedLp .kvArea .layout {
  position: relative;
  max-width: 1366px;
  padding-left: 62px;
  padding-right: 62px;
  margin: 0 auto;
}

.managedLp .kvArea .headBlock {
  background: #F3F4F5;
}

.managedLp .kvArea .headBlock h1 {
  position: relative;
  z-index: 1;
  font-size: 56px;
  line-height: 1.48;
  font-weight: 600;
}

.managedLp .kvArea .headBlock .min {
  font-size: 30px;
  line-height: 1.33;
}

.managedLp .kvArea .headBlock .marker {
  position: relative;
  font-size: 36px;
  margin-right: 4px;
  background: linear-gradient(transparent, transparent 60%, #FFEB00 60%, #FFEB00);
  transform: translateX(-4px);
  padding: 0 4px;
  display: inline-block;
  line-height: 1;
}

.managedLp .kvArea .headBlock .marker .txt {
  position: relative;
  z-index: 2;
}

.managedLp .kvArea .headBlock .large {
  font-size: 72px;
  line-height: 1.15;
}

.managedLp .kvArea .headBlock .large.color {
  color: #346BFF;
  margin-right: 8px;
}

.managedLp .kvArea .headBlock .inner {
  position: relative;
  min-height: 304px;
  padding-top: 40px;
  padding-bottom: 28px;
}

.managedLp .kvArea .headBlock .inner::after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 183px;
  width: 360px;
  height: 302px;
  background: url(/img/managed_lp_deco_01.svg) no-repeat center center / contain;
}

.managedLp .kvArea .bodyBlock {
  padding: 32px 0;
  background: #114ACC;
}

.managedLp .kvArea .bodyBlock .inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 40px 24px;
}

.managedLp .kvArea .bodyBlock .inner .txt {
  font-weight: 600;
  color: #fff;
  position: relative;
  z-index: 3;
}

.managedLp .kvArea .bodyBlock .inner .txt .h {
  font-size: 20px;
  line-height: 1.35;
  background: #FFEB00;
  padding: 2px 6px 0;
  margin-bottom: 10px;
  display: inline-block;
  color: #114ACC;
}

.managedLp .kvArea .bodyBlock .inner .txt p {
  font-size: 15px;
  line-height: 1.33;
  margin-bottom: 20px;
}

.managedLp .kvArea .bodyBlock .btn-group {
  display: grid;
  grid-template-columns: repeat(2, 286px);
  gap: 24px;
}

.managedLp .kvArea .bodyBlock .btn-group .head {
  position: relative;
  width: fit-content;
  min-width: 180px;
  margin: 0 auto 16px;
  padding: 0 16px;
  background: #fff;
  border-radius: 4px;
  color: #FE7A0C;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  line-height: 40px;
}

.managedLp .kvArea .bodyBlock .btn-group .ondemand .head {
  color: #28B9B9;
}

.managedLp .kvArea .bodyBlock .btn-group .head::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  width: 10px;
  height: 5px;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  background: #fff;
  translate: -50% 0;
}

.managedLp .kvArea .bodyBlock .btn-group .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  width: 100%;
  background: #FE7A0C;
  border-radius: 32px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 56px;
}

.managedLp .kvArea .bodyBlock .btn-group .btn a::before {
  content: '';
  display: block;
  width: 20px;
  height: 22px;
  background: url(/img/shiftvmware/hero_ico_01.svg) no-repeat center center / contain;
}

.managedLp .kvArea .bodyBlock .btn-group .ondemand .btn a {
  background: #28B9B9;
}

.managedLp .kvArea .bodyBlock .btn-group .ondemand .btn a::before {
  background-image: url(/img/shiftvmware/hero_ico_02.svg);
}

.managedLp .kvArea .bodyBlock .inner .img {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 31.29%;
}

.managedLp .kvArea .inner {
  position: relative;
  display: flex;
}

.managedLp .kvArea .formArea {
  position: absolute;
  right: 62px;
  top: 0;
}

.managedLp .introduction .lead {
  font-size: 26px;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 36px;
}

.managedLp .introduction .lead .color {
  color: #346BFF;
}

.managedLp .introduction .lead .large {
  margin-right: 4px;
  font-family: 'Lato', sans-serif;
  font-size: 48px;
  vertical-align: baseline;
}

.managedLp .introduction .leadArea {
  height: 384px;
  padding: 80px 0 0;
  background-image: url("/img/managed_lp_bg_01.jpg");
  background-position: left;
  background-repeat: no-repeat;
  background-color: #00275D;
}

.managedLp .introduction .leadArea .txtBlock {
  width: 50%;
  margin-left: auto;
  margin-right: 0;
  color: #fff;
  font-size: 16px;
}

.managedLp .introduction .leadArea .txtBlock .logo {
  margin-bottom: 40px;
}

.managedLp .introduction .box {
  position: relative;
  margin: 80px auto;
  padding: 56px 160px 64px;
  background: #fff;
  border-radius: 40px;
}

.managedLp .introduction .box:after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #FFF transparent transparent transparent;
}

.managedLp .introduction .box .color {
  color: #346BFF
}

.managedLp .introduction .box .h {
  text-align: center;
  font-size: 40px;
  line-height: 1.5;
  font-weight: 600;
  margin-bottom: 24px;
}

.managedLp .introduction .box p {
  border-bottom: 1px solid #DDE7E9;
  font-size: 20px;
  line-height: 1.35;
  padding: 16px;
  text-align: center;
  font-weight: 600;
}

.managedLp .introduction .box p .large {
  font-size: 26px;
  margin-left: 14px;
}

.managedLp .introduction .box .img:nth-last-of-type(2) {
  position: absolute;
  bottom: 0;
  left: 20px;
}

.managedLp .introduction .box .img:nth-last-of-type(1) {
  position: absolute;
  bottom: 0;
  right: 20px;
}

.managedLp .introduction .itemGroupArea .line {
  position: relative;
  font-size: 30px;
  font-weight: 600;
  text-align: center;
  line-height: 1.33;
  padding-bottom: 14px;
  margin-bottom: 35px;
  border-bottom: 6px solid #346BFF;
  display: flex;
  align-items: center;
  gap: 24px;
}

.managedLp .introduction .itemGroupArea .line .ico {
  flex-shrink: 0;
}

.managedLp .introduction .itemGroupArea .lead {
  font-size: 22px;
}

.managedLp .introduction .itemGroup {
  display: flex;
  gap: 30px;
}

.managedLp .introduction .itemGroup .item {
  width: calc((100% - 60px)/3);
}

.managedLp .introduction .itemGroup .item .h {
  padding: 20px;
  text-align: center;
  background: #6E93FD;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.5;
}

.managedLp .introduction .itemGroup .item .txt {
  padding: 20px;
  background: #fff;
  font-size: 16px;
  line-height: 1.75;
}

.managedLp .introduction .itemGroup .item .txt p {
  margin-bottom: 20px;
}

.managedLp .introduction .itemGroup .item .txt p:last-of-type {
  margin-bottom: 0;
}

.managedLp .case {
  margin-bottom: 0;
}

.managedLp .download .body {
  background: #FFF0E4;
}

.managedLp .download .head {
  background: #FF7300;
}

.managedLp .download .head:after {
  border-color: #FF7300 transparent transparent transparent;
}

.managedLp .download .txtArea {
  padding: 40px 20px 0 0;
}

.managedLp .download .txtArea p {
  font-size: 18px;
  line-height: 1.5;
  margin-bottom: 26px;
}

.managedLp .download .txtArea .img {
  text-align: center;
  margin-bottom: 32px;
}

.managedLp .download .txtArea .txt {
  padding: 24px 0 18px;
  border-top: 1px solid #FFC697;
  border-bottom: 1px solid #FFC697;
  font-size: 15px;
  line-height: 1.33;
}

.managedLp .download .txtArea .txt .num {
  margin: 0 4px;
}

.managedLp .download .txtArea .txt .num a {
  font-size: 24px;
  color: #346BFF;
  vertical-align: middle;
}

.managedLp .download .txtArea .txt .lato {
  font-size: 17px;
  font-weight: 600;
}

.managedLp .company .body {
  background: #E8EFFF;
}

.managedLp .company table {
  width: 100%;
  font-size: 14px;
  border-collapse: collapse;
  background: #fff;
}

.managedLp .company table th {
  width: 204px;
  padding: 16px 22px;
  border: 1px solid #DEE6EB;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  background: #85A6FF;
  color: #fff;
  font-size: 16px;
}

.managedLp .company table td {
  padding: 16px 22px;
  border: 1px solid #DEE6EB;
  text-align: left;
  vertical-align: middle;
  font-size: 15px;
}

.managedLp .company table td a {
  color: #346BFF;
}

.managedLp .company table td a .ico {
  display: inline-block;
  margin-left: 10px;
  width: 16px;
  height: 16px;
  background-image: url("/img/managed_lp_ico_03.svg");
  background-repeat: no-repeat;
  transform: translateY(2px);
}

.managedLp .sideBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 40px;
  right: -72px;
  width: 72px;
  height: 261px;
  background-color: #FF7300;
  border-radius: 20px 0 0 20px;
  color: #fff !important;
  font-size: 18px;
  font-weight: 600;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  letter-spacing: .1em;
  transition: .4s;
  gap: 16px;
  z-index: 777;
}

.managedLp .sideBtn .ico {
  width: 20px;
}

.managedLp .sideBtn .ico img {
  display: block;
}

.managedLp.scrollOn .sideBtn {
  right: 0;
}

.managedLp .btTop {
  position: relative;
  text-align: center;
  padding: 42px 20px 17px;
  background: #346BFF;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
}

.managedLp .btTop::after {
  position: absolute;
  content: "";
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 29px;
  height: 17px;
  background-image: url("/img/managed_lp_ico_04.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.managedLp footer .bottom {
  background: #FFFFFF;
  text-align: center;
  padding: 64px 0 32px;
}

.managedLp footer .bottom .logo {
  width: 218px;
  margin: 0 auto 36px;
}

.managedLp footer .bottom .link {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-bottom: 36px;
}

.managedLp footer .bottom .link a {
  font-size: 16px;
  font-weight: 600;
  color: #333333;
}

.managedLp footer .bottom .link a .ico {
  display: inline-block;
  margin-left: 10px;
  width: 16px;
  height: 16px;
  background-image: url("/img/managed_lp_ico_05.svg");
  background-repeat: no-repeat;
  transform: translateY(2px);
}

.managedLp .bottom_slider {
  margin-bottom: 0;
}

@media (max-width:1365px) {
  .managedLp #header {
    display: flex;
    padding: 0 62px 0 24px;
  }

  .managedLp .kvArea .headBlock .marker {
    font-size: 30px;
  }
}

@media (max-width:1279px) {
  .managedLp .kvArea .layout {
    padding-right: 62px;
  }

  .managedLp .kvArea .formArea {
    display: none;
  }

  .managedLp .kvArea .bodyBlock .inner .img {
    bottom: 20px;
  }

  .managedLp .kvArea .btnArea {
    display: block;
    text-align: center;
    padding: 8px 20px 50px;
    background: #114ACC;
  }

  .managedLp .kvArea .btnArea .a {
    display: flex;
    width: 295px;
    height: 60px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    gap: 12px;
    border-radius: 30px;
    background: #FC7326;
    margin: 0 auto;
  }
}

@media (max-width:1079px) {
  .managedLp #header {
    padding: 0 24px;
  }

  .managedLp #header .linkGroup ul {
    gap: 24px;
    margin-right: 32px;
  }
}

@media (max-width:1023px) {
  .managedLp header {
    height: 80px;
  }

  .managedLp #header {
    position: relative;
    padding: 24px 20px;
  }

  .managedLp #header .logo {
    position: relative;
    z-index: 999;
    width: 231px;
  }

  .managedLp #header .logo.on {
    position: fixed;
    top: 24px;
    left: 20px;
  }

  .managedLp #header .btnNav {
    display: block;
    position: absolute;
    top: 27px;
    right: 20px;
    width: 40px;
    height: 29px;
    z-index: 999;
  }

  .managedLp #header .btnNav span {
    position: absolute;
    top: 50%;
    right: 0;
    width: 40px;
    height: 3px;
    margin-top: -1px;
    border-radius: 2px;
    background: #346BF9;
    transition: all 0.4s ease;
  }

  .managedLp #header .btnNav span:first-child {
    top: 0;
  }

  .managedLp #header .btnNav span:nth-child(2) {
    transform: translateY(-50%);
  }

  .managedLp #header .btnNav span:last-child {
    top: auto;
    bottom: 0;
  }

  .managedLp #header .btnNav.on span:first-child {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
  }

  .managedLp #header .btnNav.on span:nth-child(2) {
    opacity: 0;
  }

  .managedLp #header .btnNav.on span:last-child {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%) rotate(-45deg);
  }

  .managedLp #header .btnNav.on {
    position: fixed;
    top: 27px;
    transform: none;
  }

  .managedLp #header .navGroup {
    box-sizing: border-box;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #fff;
    padding: 126px 20px 20px 20px;
    z-index: 888;
  }

  .managedLp #header .linkGroup ul {
    display: block;
    text-align: center;
    margin-right: 0;
  }

  .managedLp #header .linkGroup ul li {
    margin: 0 auto 28px;
    font-size: 18px;
  }

  .managedLp #header .phone {
    width: 295px;
    margin: 0 auto 32px;
  }

  .managedLp #header .phone a {

    height: 60px;
    border-radius: 30px;
    margin: 0 auto;
  }

  .managedLp #header .navGroup .sp {
    display: block;
  }

  .managedLp #header .navGroup .btn .a {
    display: flex;
    width: 295px;
    height: 60px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    gap: 12px;
    border-radius: 30px;
    background: #FC7326;
    margin: 0 auto;
  }

  .managedLp .kvArea .formArea {
    display: none;
  }

  .managedLp .kvArea .layout {
    padding: 0 20px;
  }

  .managedLp .kvArea .bodyBlock .inner .img {
    right: 0;
  }

  .managedLp .kvArea .headBlock .inner {
    width: 100%;
    min-height: auto;
    display: block;
    padding-top: 16px;
  }

  .managedLp .kvArea .headBlock .inner::after {
    display: none;
  }

  .managedLp .kvArea .headBlock h1 {
    font-size: 28px;
    text-align: center;
  }

  .managedLp .kvArea .headBlock .marker {
    font-size: 18px;
  }

  .managedLp .kvArea .headBlock .min {
    font-size: 18px;
  }

  .managedLp .kvArea .headBlock .large {
    font-size: 36px;
  }

  .managedLp .kvArea .sp {
    display: block;
  }

  .managedArea .introduction .body {
    padding-top: 62px;
  }

  .managedLp .introduction .leadArea {
    padding: 60px 0 56px;
  }

  .managedLp .introduction .box p .large {
    display: block;
    margin-left: 0;
  }

  .managedLp .sideBtn {
    display: flex;
    width: 295px;
    height: 60px;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    gap: 12px;
    border-radius: 30px;
    background: #FC7326;
    margin: 0 auto;
    -ms-writing-mode: inherit;
    writing-mode: inherit;
    top: auto;
    right: 50%;
    transform: translateX(50%);
    bottom: -295px;
  }

  .managedLp.scrollOn .sideBtn {
    right: 50%;
    bottom: 18px;
  }
}

@media (max-width:767px) {
  .managedLp br.sp {
    display: block;
  }

  .managedLp .kvArea .bodyBlock .inner {
    gap: 8px;
  }

  .managedLp .kvArea .bodyBlock .inner .txt .h {
    font-size: 16px;
  }

  .managedLp .kvArea .bodyBlock .inner .txt .p {
    font-size: 14px;
  }

  .managedLp .kvArea .bodyBlock .btn-group {
    grid-template-columns: 286px;
    margin: 0 auto;
  }

  .managedLp .kvArea .bodyBlock .inner .img {
    top: 115px;
    bottom: auto;
    width: 118px;
  }

  .managedLp .introduction .lead {
    font-size: 18px;
    text-align: center;
    line-height: 1.75;
  }

  .managedLp .introduction .lead .large {
    font-size: 40px;
    line-height: 1;
  }

  .managedLp .introduction .leadArea {
    height: auto;
    padding: 50px 0 72px;
    background-image: url("/img/managed_lp_bg_01_sp.jpg");
    background-position: center top;
    background-size: cover;
  }

  .managedLp .introduction .leadArea .txtBlock {
    width: 100%;
  }

  .managedLp .introduction .leadArea .txtBlock .logo {
    max-width: 295px;
    margin: 0 auto 40px;
  }

  .managedLp .introduction .box {
    margin-top: 40px;
    padding: 40px 20px 70px;
  }

  .managedLp .introduction .box .h {
    font-size: 24px;
    margin-bottom: 16px;
  }

  .managedLp .introduction .box p {
    font-size: 14px;
  }

  .managedLp .introduction .box p .large {
    display: block;
    font-size: 16px;
  }

  .managedLp .introduction .box .img:nth-last-of-type(2) {
    width: 82px;
    height: auto;
    left: 15px;
  }

  .managedLp .introduction .box .img:nth-last-of-type(1) {
    width: 58px;
    height: auto;
    right: 15px;
  }

  .managedLp .introduction .itemGroupArea .line {
    font-size: 18px;
    text-align: left;
    gap: 10px;
  }

  .managedLp .introduction .itemGroupArea .line .ico {
    width: 32px;
  }

  .managedLp .introduction .itemGroupArea .lead {
    font-size: 16px;
    text-align: left;
  }

  .managedLp .introduction .itemGroupArea .itemGroup {
    display: block;
  }

  .managedLp .introduction .itemGroupArea .itemGroup .item {
    width: 100%;
  }

  .managedLp .introduction .itemGroup .item .h {
    padding: 18px;
    font-size: 15px;
  }

  .managedLp .introduction .itemGroup .item .txt {
    font-size: 14px;
  }

  .managedLp .download .layout {
    display: block;
  }

  .managedLp .download .txtArea {
    padding: 0;
    margin-bottom: 40px;
  }

  .managedLp .download .formArea {
    width: 100%;
  }

  .managedLp .formArea .formGroup dl {
    padding: 10px 0;
  }

  .managedLp .formArea .formGroup input[type="text"],
  .managedLp .formArea .formGroup input[type="email"],
  .managedLp .formArea .formGroup input[type="number"] {
    height: 56px;
  }

  .managedLp .download .txtArea .img {
    max-width: 240px;
    margin: 0 auto 32px;
  }

  .managedLp .download .txtArea .txt {
    font-size: 14px;
  }

  .managedLp .download .txtArea .txt .lato {
    font-size: 14px;
  }

  .managedLp .download .txtArea .txt .num a {
    font-size: 19px;
  }

  .managedLp .company table th {
    padding: 8px 10px;
    font-size: 15px;
    width: 100%;
  }

  .managedLp .company table td {
    padding: 8px 10px;
    font-size: 14px;
  }
}

.managedLp .sliderArea {
  padding: 61px 0;
}

.managedLp .sliderArea li {
  width: 176px;
}

.managedLp .sliderArea .upper_slider {
  margin-bottom: 54px;
}

@media (max-width:767px) {
  .managedLp .sliderArea {
    padding: 30px 0;
  }

  .managedLp .sliderArea li {
    width: 88px;
  }

  .managedLp .sliderArea .upper_slider {
    margin-bottom: 27px;
  }
}

/*catHead*/
.catHead {
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: #fff;
  background: #28b9b9;
  padding: 32px 24px;
}

@media (max-width:767px) {
  .catHead {
    padding: 20px 16px;
    font-size: 20px;
  }
}

/*formPageBody*/
.formPageBody {
  background: #fff;
  position: relative;
  height: 100vh;
  display: flex;
  align-items: center;
}

.formPageBody::after {
  content: "";
  position: absolute;
  background: #F5FCFC;
  width: calc(50% + 40px);
  height: 100%;
  top: 0;
  right: 0;
}

.form_layout {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}

.form_layout * {
  box-sizing: border-box;
}

.form_layout header {
  margin-bottom: 50px;
}

.form_layout header .logo {
  padding: 0;
}

.form_layout .inner {
  position: relative;
  display: flex;
  padding-top: 20px;
  z-index: 3;
}

.form_layout .txtContent {
  width: 50%;
  padding-right: 80px;
}

.form_layout .txtContent.inquiry h2 {
  font-size: 24px;
  font-weight: 600;
  color: #28B9B9;
  margin-bottom: 28px;
}

.form_layout .txtContent.inquiry .lead {
  margin-bottom: 40px;
}

.form_layout .txtContent.inquiry .img {
  text-align: center;
}

.form_layout .txtContent .phone {
  padding: 20px 0 16px;
  border-top: 2px solid #28B9B9;
  border-bottom: 2px solid #28B9B9;
}

.form_layout .txtContent .phone .h {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 13px;
  line-height: 1.3;
}

.form_layout .txtContent .phone .txtBlock {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}

.form_layout .txtContent .phone .txtBlock .number {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 28px;
  line-height: 1.07;
}

.form_layout .formContent {
  width: 50%;
  background: #F5FCFC;
}

.form_layout .formContent #formList {
  width: 100%;
  margin-bottom: 10px;
}

.form_layout .formContent #formList dt {
  width: 150px;
}

.form_layout .formContent #formList dt .title {

  margin: 0 !important;
  padding: 0 !important;

}

.form_layout .formContent #formList dt .title label .h {
  display: flex;
  font-weight: 600;
  gap: 10px;
  align-items: center;
}

.form_layout .formContent #formList dt .title .requisite {
  display: flex;
  width: 36px;
  height: 18px;
  font-size: 10px;
  color: #fff;
  border-radius: 2px;
  background: #28B9B9;
  justify-content: center;
  align-items: center;
}

.form_layout .formContent #formList dt:after {
  display: none !important;
}

.form_layout .formContent #formList .act {
  font-size: 10px !important;
  line-height: 1;
}

.form_layout .formContent #formList dd {
  padding: 0 0 0 174px;
  margin-bottom: 12px;
}

.form_layout .formContent label.chk {
  font-size: 12px;
  align-items: center;
  margin-bottom: 8px;
  position: relative;
  padding-left: 24px;
  display: block;
  cursor: pointer;
}

.form_layout .formContent #formList input {
  margin-right: 0;
}

.form_layout .formContent #formList input[type="checkbox"] {
  display: none;
}

.form_layout .formContent label.chk::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #C4DFDF;
  box-sizing: border-box;
}

.form_layout .formContent label.chk::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 16px;
  height: 16px;
  background: url("/img/form_checkbox_on.svg");
  background-size: contain;
  opacity: 0;
}

.form_layout .formContent #formList input[type="checkbox"]:checked+label.chk::after {
  opacity: 1;
}

.form_layout .formContent #formList input[type="text"] {
  width: 100%;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #C4DFDF;
}

.form_layout .formContent #formList input[type="text"]::placeholder {
  opacity: 0.6;
}

.form_layout .formContent #formList textarea {
  width: 100%;
  height: 90px;
  background: #fff;
  border-radius: 4px;
  border: 1px solid #C4DFDF;
}

.form_layout .formContent .privacy {
  font-size: 12px;
  margin-bottom: 8px;
}

.form_layout .formContent .privacy_agree {
  text-align: center;
  margin-bottom: 24px;
}

.form_layout .formContent .privacy_agree input[type="checkbox"] {
  display: none;
}

.form_layout .formContent .privacy_agree label {
  position: relative;
  box-sizing: border-box;
  padding-left: 20px;
  font-size: 12px;
}

.form_layout .formContent .privacy_agree label::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #C4DFDF;
  box-sizing: border-box;
}

.form_layout .formContent .privacy_agree label::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 14px;
  height: 14px;
  background: url("/img/form_checkbox_on.svg");
  background-size: contain;
  opacity: 0;
}

.form_layout .formContent .privacy_agree input[type="checkbox"]:checked+label::after {
  opacity: 1;
}

.form_layout .formContent button[disabled] {
  cursor: default;
  background: rgba(51, 189, 189, 0.5);
  color: #fff;
}

.form_layout .formContent button {
  display: block;
  width: 286px;
  height: 56px;
  border: none;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.4s ease;
  border-radius: 3px;
  margin: 0 auto;
}

.form_layout .formContent .err_msg {
  padding: 0 0 0 174px !important;
  margin: 0 0 12px 0 !important;
}

.form_layout .txtContent.request header {
  margin-bottom: 36px;
}

.form_layout .txtContent.request h2 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 22px;
  color: #28B9B9;
}

.form_layout .txtContent.request h2 br {
  display: none;
}

.form_layout .txtContent.request .leadArea {
  display: flex;
  margin-bottom: 20px;
  align-items: flex-end;
}

.form_layout .txtContent.request .leadArea .img {
  flex-shrink: 0;
}

.form_layout .txtContent.request .itemArea {
  padding: 17px 15px 19px;
  background: #E9F8F8;
  border-radius: 10px;
  margin-bottom: 24px;
}

.form_layout .txtContent.request .itemArea .h {
  display: block;
  margin: 0 auto 14px;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  color: #28B9B9;
  font-weight: 600;
  line-height: 1.357;
}

.form_layout .txtContent.request .itemArea .h::after {
  content: "";
  position: absolute;
  width: 14px;
  height: 12px;
  top: -7px;
  right: -23px;
  background: url("/img/form_request_deco_01.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.form_layout .txtContent.request .itemArea .itemGroup {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.form_layout .txtContent.request .itemArea .itemGroup .item {
  width: 180px;
  position: relative;
  padding-top: 38px;
}

.form_layout .txtContent.request .itemArea .itemGroup .item .baloon {
  position: absolute;
  width: 150px;
  height: 60px;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  background: url("/img/form_request_deco_02.svg");
  background-size: contain;
  font-size: 10px;
  color: #28B9B9;
  font-weight: 600;
  padding: 8px;
  text-align: center;
  background-repeat: no-repeat;
  background-position: center;
  line-height: 1.5;
}

.form_layout .txtContent.request .itemArea .itemGroup .item:nth-of-type(2) .baloon {
  background-image: url("/img/form_request_deco_03.svg")
}

.form_layout .txtContent.request .itemArea .itemGroup .item .img {
  border-radius: 8px;
  border: 1px solid #C4DFDF;
  margin-bottom: 8px;
  overflow: hidden;
}

.form_layout .txtContent.request .itemArea .itemGroup .item .company {
  font-size: 10px;
  font-weight: 600;
  white-space: nowrap;
  text-align: center;
}

.form_layout .txtContent.request .phone {
  padding: 12px 0 9px;
}

.form_layout .txtContent.request .phone .h {
  font-size: 14px;
}

.form_layout .txtContent.request .phone .txtBlock .number {
  font-size: 22px;
}

.form_layout footer {
  font-size: 10px;
  padding: 14px 0;
}

.form_layout .btnArea {
  display: flex;
  gap: 16px;
}

.form_layout .btnArea a {
  display: flex;
  width: calc((100% - 16px)/2);
  height: 56px;
  border: none;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.4s ease;
  border-radius: 3px;
  margin: 0 auto;
  box-shadow: 0px 1px 2px rgb(0 0 0 / 10%);
  justify-content: center;
  align-items: center;
  background-color: buttonface;
  color: #333;
}

.form_layout .formContent .btnArea button {
  width: calc((100% - 16px)/2);
}

@media (min-width: 1000px) {
  .form_layout .formContent.request {
    padding-top: 40px;
  }
}

@media (max-width:1000px) {
  .formPageBody {
    display: block;
  }

  .formPageBody::after {
    display: none;
  }

  .form_layout {
    padding: 0;
  }

  .form_layout .inner {
    display: block;
  }

  .form_layout .txtContent {
    width: 100%;
    padding: 0 25px;
  }

  .form_layout .formContent {
    width: 100%;
    padding: 50px 25px;
  }

  .form_layout .txtContent .phone {
    margin-bottom: 50px;
  }
}

@media (max-width:767px) {
  .form_layout .inner {
    padding-top: 0;
  }

  .form_layout header {
    margin-bottom: 30px;
  }

  .form_layout .txtContent.request header {
    margin-bottom: 26px;
  }

  .form_layout .txtContent.request header .logo {
    padding: 24px;
    margin: 0;
    text-align: center;
  }

  .form_layout .txtContent.request header .logo img {
    height: 40px;
  }

  .form_layout .formContent #formList {
    width: 100%;
    margin: 0 auto 40px;
  }

  .form_layout .formContent #formList dt {
    border: none;
    width: auto;
    margin-bottom: 10px;
  }

  .form_layout .formContent #formList dd {
    padding-left: 0;
  }

  .form_layout .formContent #formList dt .title label .h {
    font-size: 16px;
  }

  .form_layout .formContent #formList dt .title .requisite {
    width: 49px;
    height: 24px;
    font-size: 12px;
  }

  .form_layout .formContent label.chk {
    font-size: 16px;
    padding-left: 30px;
    margin-bottom: 20px;
  }

  .form_layout .formContent label.chk::before,
  .form_layout .formContent label.chk::after {
    top: 3px;
    width: 20px;
    height: 20px;
  }

  .form_layout .formContent #formList input[type="text"] {
    font-size: 16px;
    padding: 20px 15px;
  }

  .form_layout .formContent #formList textarea {
    height: 180px;
    padding: 20px 15px;
    font-size: 16px;
  }

  .form_layout .formContent .privacy {
    font-size: 16px;
    margin-bottom: 32px;
    text-align: left;
    padding: 0;
  }

  .form_layout .formContent #formList dd {
    padding-left: 0 !important;
  }

  .form_layout .formContent .privacy_agree label {
    font-size: 16px;
    padding-left: 30px;
  }

  .form_layout .formContent .privacy_agree label::before,
  .form_layout .formContent .privacy_agree label::after {
    top: 1px;
    width: 20px;
    height: 20px;
  }

  .form_layout footer {
    padding: 50px 0 40px;
    text-align: center;
    font-size: 10px;
    background: #F5FCFC;
  }

  .form_layout .txtContent.inquiry h2 {
    font-size: 20px;
    margin-bottom: 22px;
  }

  .form_layout .txtContent.inquiry .lead {
    text-align: center;
    font-size: 15px;
    margin-bottom: 22px;
  }

  .form_layout .txtContent.request h2 {
    font-size: 20px;
    text-align: center;
    margin-bottom: 30px;
  }

  .form_layout .txtContent.request h2 br {
    display: block;
  }

  .form_layout .txtContent.request .leadArea {
    display: block;
    margin-bottom: 32px;
  }

  .form_layout .txtContent.request .leadArea .lead {
    padding-top: 0;
    text-align: center;
    font-size: 15px;
    margin-bottom: 22px;
  }

  .form_layout .txtContent.request .leadArea .img {
    text-align: center;
  }

  .form_layout .txtContent.request .leadArea .img img {
    width: 210px;
  }

  .form_layout .txtContent.request .itemArea {
    padding: 35px 30px 38px;
    margin-bottom: 40px;
  }

  .form_layout .txtContent.request .itemArea .h {
    font-size: 20px;
    margin-bottom: 30px;
  }

  .form_layout .txtContent.request .itemArea .h::after {
    width: 24px;
    height: 20px;
    top: -10px;
    right: -32px;
  }

  .form_layout .txtContent.request .itemArea .itemGroup {
    display: block;
  }

  .form_layout .txtContent.request .itemArea .itemGroup .item {
    width: 270px;
    margin: 0 auto 30px;
    padding-top: 64px;
  }

  .form_layout .txtContent.request .itemArea .itemGroup .item:last-of-type {
    margin-bottom: 0;
  }

  .form_layout .txtContent.request .itemArea .itemGroup .item .baloon {
    width: 250px;
    height: 98px;
    padding: 14px 16px;
    font-size: 14px;
  }

  .form_layout .txtContent.request .itemArea .itemGroup .item .company {
    font-size: 14px;
    text-align: center;
  }

  .form_layout .txtContent .phone {
    margin: 0 15px 50px;
  }

  .form_layout .txtContent .phone .h {
    font-size: 15px;
    margin-bottom: 20px;
  }

  .form_layout .txtContent .phone .txtBlock .number {
    font-size: 20px;
  }

  .form_layout .txtContent .phone .txtBlock .number img {
    width: 16px;
    height: 16px;
  }

  .form_layout .txtContent .phone .txtBlock .time {
    font-size: 10px;
  }

  .form_layout .btnArea {
    gap: 10px;
  }

  .form_layout .btnArea a,
  .form_layout .btnArea button {
    font-size: 12px;
  }
}

/*downloadBody*/
.downloadBody {
  background: #fff;
}

.downloadBody header .logo {
  padding: 20px 0;
}

.downloadBody header .logo img {
  height: 32px;
}

.downloadBody .downloadHead {
  background: #fff;
  padding-top: 20px;
}

.downloadBody .downloadHead h1 {
  text-align: center;
  font-size: 32px;
  font-weight: 600;
  color: #28B9B9;
  line-height: 1.125;
  margin-bottom: 36px;
}

.downloadBody .downloadHead .lead {
  text-align: center;
  margin-bottom: 36px;
}

.downloadBody .downloadSection h2 {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  font-size: 24px;
  font-weight: 600;
  margin: 0 auto 46px;
}

.downloadBody .downloadSection h2 .color {
  color: #29B9BA;
}

.downloadBody .downloadSection h2::after {
  content: "";
  position: absolute;
  width: 116px;
  height: 82px;
  top: -62px;
  left: -123px;
  background: url("/img/download_deco.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.downloadBody .downloadList {
  display: flex;
  gap: 24px;
  margin-bottom: 48px;
}

.downloadBody .downloadList .item {
  width: calc((100% - 48px)/3);
  position: relative;
}

.downloadBody .downloadList .item::before {
  content: "";
  width: 50px;
  height: 50px;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.downloadBody .downloadList .item:nth-of-type(1)::before {
  background-image: url("/img/download_ico_01.svg");
}

.downloadBody .downloadList .item:nth-of-type(2)::before {
  background-image: url("/img/download_ico_02.svg");
}

.downloadBody .downloadList .item:nth-of-type(3)::before {
  background-image: url("/img/download_ico_03.svg");
}

.downloadBody .formArea {
  background: #F5FCFC;
  padding-bottom: 46px;
}

.downloadBody .formArea .layout {
  max-width: 480px;
}

.downloadBody .formArea .formGroup {
  padding: 0;
  background: none;
  margin-bottom: 12px;
}

.downloadBody .formArea .formGroup dt {
  font-size: 14px;
  width: 144px;
}

.downloadBody .formArea .formGroup dt label {
  display: flex;
  align-items: center;
}

.downloadBody .formArea .formGroup .required {
  width: 36px;
  line-height: 18px;
  font-size: 10px;
  border-radius: 2px;
  margin-left: 10px;
}

.downloadBody .formArea .formGroup dd {
  width: calc(100% - 144px);
}

.downloadBody .formArea .formGroup input[type="text"],
.downloadBody .formArea .formGroup input[type="email"],
.downloadBody .formArea .formGroup input[type="number"],
.downloadBody .formArea .formGroup textarea {
  background: #fff;
  border-radius: 4px;
  border: 1px solid #C4DFDF;
}

.downloadBody .formArea .formGroup .eg {
  font-size: 12px;
  color: #2E2E2E;
}

.downloadBody .mwform-checkbox-field {
  display: inline-block;
}

.downloadBody .privacyText .mwform-checkbox-field {
  margin-top: 16px;
}

.downloadBody .mwform-checkbox-field input[type="checkbox"] {
  display: none;
}

.downloadBody .mwform-checkbox-field .mwform-checkbox-field-text {
  position: relative;
  box-sizing: border-box;
  padding-left: 20px;
}

.downloadBody .mwform-checkbox-field .mwform-checkbox-field-text::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 2px;
  border: 1px solid #C4DFDF;
  box-sizing: border-box;
}

.downloadBody .mwform-checkbox-field .mwform-checkbox-field-text::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 14px;
  height: 14px;
  background: url("/img/form_checkbox_on.svg");
  background-size: contain;
  opacity: 0;
}

.downloadBody .mwform-checkbox-field input[type="checkbox"]:checked+.mwform-checkbox-field-text::after {
  opacity: 1;
}

.selectBox dd {
  transform: translateY(-16px);
}

.selectBox .mwform-checkbox-field {
  font-size: 15px;
  font-weight: 600;
  margin-right: 24px;
  margin-top: 16px;
}

.selectBox .mwform-checkbox-field label {
  font-weight: 600;
}

.selectBox .mwform-checkbox-field .mwform-checkbox-field-text::before {
  top: 0px;
  width: 24px;
  height: 24px;
}

.selectBox .mwform-checkbox-field .mwform-checkbox-field-text::after {
  top: 0px;
  width: 24px;
  height: 24px;
}

.selectBox .mwform-checkbox-field .mwform-checkbox-field-text {
  padding-left: 32px;
}

.downloadBody .formArea input[type="submit"] {
  width: 286px;
  line-height: 56px;
}

.downloadBody footer {
  padding: 32px;
  text-align: center;
  background: #F5FCFC;
  font-size: 10px;
}

@media (max-width:767px) {
  .downloadBody .downloadHead h1 {
    font-size: 22px;
  }

  .downloadBody .downloadSection h2 {
    font-size: 16px;
  }

  .downloadBody .downloadSection h2::after {
    width: 90px;
    height: 68px;
    top: -68px;
    left: -12px;
  }

  .downloadBody .downloadHead .lead {
    margin-bottom: 72px;
  }

  .downloadBody .downloadList {
    flex-direction: column;
  }

  .downloadBody .downloadList .item {
    width: 100%;
  }

  .downloadBody .formArea .formGroup dd {
    width: 100%;
    padding: 0;
  }

  .downloadBody .formArea .submitBlk {
    flex-direction: row;
  }
}

/*top_btnArea*/
.top_btnArea {
  display: flex;
  gap: 24px;
}

.top_btnArea .btn {
  position: relative;
  overflow: inherit !important;
  margin: 0 !important;
  height: 60px !important;
}

.top_btnArea .btn a {
  position: relative;
  display: flex;
  width: 100%;
  height: 60px !important;
  gap: 10px;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  z-index: 2;
  transition: all 0.2s ease;
}

.top_btnArea .btn:nth-of-type(1) {
  width: 257px;
}

.top_btnArea .btn:nth-of-type(1) a {
  background: #FF7300;
  box-shadow: 0 4px 0 #E56700;
}

.top_btnArea .btn:nth-of-type(1) a:hover {
  opacity: 1;
  transform: translateY(4px);
  box-shadow: 0 0 0 #E56700;
}

.top_btnArea .btn:nth-of-type(2) {
  width: 305px;
}

.top_btnArea .btn:nth-of-type(2) a {
  background: #28B9B9;
  box-shadow: 0 4px 0 #149898;
}

.top_btnArea .btn:nth-of-type(2) a:hover {
  opacity: 1;
  transform: translateY(4px);
  box-shadow: 0 0 0 #149898;
}

.top_btnArea .btn .baloon {
  position: absolute;
  width: 180px;
  height: 40px;
  top: -27px;
  left: 50%;
  transform: translate(-50%);
  font-size: 14px;
  text-align: center;
  font-weight: 600;
  padding-top: 6px;
  z-index: 3;
}

.top_btnArea .btn:nth-of-type(1) .baloon {
  background-image: url("/img/top_btnArea_deco_01.svg");
  background-size: contain;
  background-repeat: no-repeat;
  color: #FF7300;
}

.top_btnArea .btn:nth-of-type(2) .baloon {
  background-image: url("/img/top_btnArea_deco_02.svg");
  background-size: contain;
  background-repeat: no-repeat;
  color: #28B9B9;
}

@media (max-width: 767px) {
  .top_btnArea {
    flex-direction: column;
    align-items: center;
    gap: 48px;
  }

  .top_btnArea .btn {
    width: 277px !important;
  }

  .top_btnArea .btn a {
    font-size: 18px;
  }
}

/* breadcrumb */
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  margin: -36px 0 24px;
  font-size: 12px;
}

.breadcrumb li {
  margin-right: 8px;
}

.breadcrumb li:not(:last-child)::after {
  content: ">";
  position: relative;
  top: -1px;
  margin-left: 8px;
  color: #30bbbb;
}

.breadcrumb a {
  color: #333;
}

.breadcrumb a:hover {
  opacity: 1;
  color: #28b9b9;
}

.breadcrumb .homeIco {
  position: relative;
  top: -2px;
}

.breadcrumb.-index {
  max-width: 960px;
  margin: 24px auto 0;
  padding: 0 24px;
}

@media only screen and (max-width: 1023px) {
  .breadcrumb {
    padding: 0 24px;
  }
}

@media only screen and (max-width: 767px) {
  .breadcrumb {
    margin-top: -16px;
    padding: 0 16px;
  }

  .breadcrumb.-index {
    margin-top: 16px;
    padding: 0 16px;
  }
}

/*explanationSection*/
.explanationSection {
  padding: 70px 0 88px;
  background: #f6fbfb;
}

.explanationSection h2 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: .05em;
  margin-bottom: 39px;
  text-align: center;
  letter-spacing: 0;
}

.explanationSection h2 .sp {
  display: none;
}

.explanationSection .itemGroup {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 40px;
}

.explanationSection .itemGroup .item {
  background: #fff;
}

.explanationSection .itemGroup * {
  box-sizing: border-box;
}

.explanationSection .itemGroup .item:nth-of-type(-n+6) {
  margin-bottom: 8px;
}

.explanationSection .itemGroup .item:not(:nth-child(-n+6)) a {
  display: flex;
  gap: 24px;
  padding: 24px;
  width: 100%;
  height: 100%;
  align-items: center;
}

.explanationSection .itemGroup .item:not(:nth-child(-n+6)) .img {
  width: 50.97%;
  flex-shrink: 0;
}

.explanationSection .itemGroup .item .txt {
  color: #333333;
  font-size: 15px;
  font-weight: 600;
}

.explanationSection .itemGroup .item:nth-of-type(-n+6) .txt {
  padding: 20px 24px;
}

.explanationSection .itemGroup .item:not(:nth-child(-n+6)) .txt {
  display: flex;
  align-items: center;
}

.explanationSection .itemGroup .item .txt.blank .ico {
  display: inline-block;
  margin-left: 10px;
  transform: translateY(-1px);
}

@media screen and (max-width:767px) {
  .explanationSection {
    padding: 50px 0 56px;
  }

  .explanationSection h2 {
    margin-bottom: 38px;
  }

  .explanationSection h2 .sp {
    display: block;
  }

  .explanationSection .itemGroup {
    display: block;
  }

  .explanationSection .itemGroup .item {
    margin-bottom: 24px !important;
  }

  .explanationSection .itemGroup .item:not(:nth-child(-n+6)) a {
    flex-direction: column;
    padding: 20px 20px 16px;
    gap: 12px;
  }

  .explanationSection .itemGroup .item:not(:nth-child(-n+6)) .img {
    width: 100%;
  }

  .explanationSection .itemGroup .item:nth-of-type(-n+6) .txt {
    padding: 12px 20px;
  }
}

/*blogKv*/
.blogKv {
  width: 100%;
  margin-bottom: 40px;
}

/*top function*/
.functionSection {
  padding: 60px 0 64px;
  background: #F3F4F5;
}

.functionSection h2 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.05em;
  margin-bottom: 64px;
  text-align: center;
}

.functionSection .box {
  background: #fff;
  margin-bottom: 76px;
}

.functionSection .box:nth-of-type(1) {
  margin-top: 88px;
}

.functionSection .box:nth-of-type(2) {
  margin-bottom: 80px;
}

.functionSection .box .head {
  position: relative;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
  padding: 34px 21px 21px;
  background: #346BFF;
  text-align: center;
  color: #fff;
}

.functionSection .box .head .baloon {
  position: absolute;
  width: 260px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.68;
  border-radius: 100px;
  top: -28px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  background: #346BFF;
}

.functionSection .box .head .baloon::after {
  position: absolute;
  content: "";
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 10px 0 10px;
  border-color: #346BFF transparent transparent transparent;
}

.functionSection .box:nth-of-type(1) .baloon {
  background: #08D6B3;
}

.functionSection .box:nth-of-type(1) .baloon::after {
  border-color: #08D6B3 transparent transparent transparent;
}

.functionSection .box:nth-of-type(2) .baloon {
  background: #FF9900;
}

.functionSection .box:nth-of-type(2) .baloon::after {
  border-color: #FF9900 transparent transparent transparent;
}

.functionSection .box .body {
  padding: 24px;
}

.functionSection .box .itemGroup {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-rows: 1fr;
  grid-gap: 24px;
}

.functionSection .box .itemGroup .item {
  box-sizing: border-box;
}

.functionSection .box:nth-of-type(1) .itemGroup .item {
  padding: 24px;
  background: #EAF0FF;
}

.functionSection .box:nth-of-type(2) .itemGroup .item {
  padding: 24px;
  border: 3px solid #D2DEFF;
}

.functionSection .box .itemGroup .logo {
  width: 100%;
}

.functionSection .box .itemGroup .logo img {
  width: 100%;
}

.functionSection .box .itemGroup .ico {
  width: fit-content;
  margin: 0 auto 21px;
}

.functionSection .box .itemGroup .txt {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
  text-align: center;
}

.functionSection .itemGroup .min {
  font-size: 14px !important;
}

.functionSection .container .itemGroup {
  display: flex;
  gap: 24px;
  margin-bottom: 80px;
}

.functionSection .container .itemGroup .item {
  width: calc(100%/3);
  background: #fff;
  padding: 48px 24px;
  box-sizing: border-box;
}

.functionSection .container .itemGroup .item .ico {
  width: fit-content;
  margin: 0 auto 45px;
}

.functionSection .container .itemGroup .item .h {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.5;
  margin-bottom: 18px;
  text-align: center;
}

.functionSection .bannerArea {
  display: flex;
  flex-direction: column;
  gap: 64px;
}

.functionSection .banner {
  width: 100%;
  margin: 0 auto;
}

.functionSection .banner a {
  position: relative;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.cloudService {
  padding: 72px 0 40px;
}

.cloudService h2 {
  font-size: 24px;
  font-weight: 600;
  letter-spacing: 0.05em;
  margin-bottom: 40px;
  text-align: center;
}

.functionSection .banner .sp {
  display: none;
}

@media screen and (max-width:767px) {
  .functionSection .bannerArea {
    gap: 32px;
  }

  .functionSection .banner {
    max-width: 343px;
  }

  .functionSection .box .itemGroup,
  .functionSection .container .itemGroup {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .functionSection .box .item,
  .functionSection .container .itemGroup .item {
    width: 100%;
  }

  .functionSection .banner .sp {
    display: block;
  }

  .functionSection .banner .pc {
    display: none;
  }
}

/*scroll*/
.show_up {
  opacity: 0;
}

.show_up.active {
  animation-name: showUp;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes showUp {
  0% {
    opacity: 0;
    transform: translateY(25px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/*pages*/
.pages .headArea {
  background-image: none;
  background: #E9F7F8;
}

.pages .headArea .inner {
  background: none;
  text-align: center;
  padding: 73px 0 77px;
}

.pages .headArea .inner p {
  font-weight: 400;
}

.pages .headArea h1 {
  margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
  .pages .headArea .inner {
    padding: 40px 0;
  }
}

/*company*/

.company {
  font-size: 16px;
}

.company h2 {
  font-size: 26px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 32px;
}

.company #contents a {
  color: #28B9B9;
}

.company #contents a[target="_blank"]::after {
  content: "";
  display: inline-block;
  margin-left: 8px;
  width: 12px;
  height: 12px;
  background: url("/img/pages_ico_blank.svg") no-repeat;
  background-size: cover;
  vertical-align: middle;
  transform: translateY(-1px);
}

.company .companyMap {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
  padding-bottom: 30px;
  margin-bottom: 80px;
  border-bottom: 1px solid #DDDDDD;
}

.company .companyMap .item {
  width: calc((100% - 40px)/2);
}

.company .companyMap .item .body {
  margin-top: 20px;
  position: relative;
}

.company .companyMap .item .more {
  position: absolute;
  top: 0;
  right: 0;
  font-weight: 600;
}

.company .companyMap .item.full {
  width: 100%;
}

.company .companyMap .map iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 23/10;
}

.company .companyMap #map_hq {
  width: 100%;
  height: auto;
  aspect-ratio: 8/3;
}

.company .companyMap .h {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 8px;
}

.company .table {
  padding-top: 48px;
  margin-bottom: 72px;
}

.company table {
  width: 100%;
  border-collapse: collapse;
}

.company table th {
  border-top: 1px solid #DDDDDD;
  text-align: left;
  padding: 30px 40px 30px 0;
}

.company table th:last-of-type {
  border-bottom: 1px solid #DDDDDD;
}

.company table td {
  border-top: 1px solid #DDDDDD;
  padding: 30px 20px 30px 0;
}

.company table td:last-of-type {
  border-bottom: 1px solid #DDDDDD;
}

.company table td .mb16 {
  margin-bottom: 16px;
}

.company table tr:first-of-type th {
  border-top: none;
}

.company table tr:first-of-type td {
  border-top: none;
}

.company table ul li {
  position: relative;
  margin-bottom: 16px;
  padding-left: 28px;
}

.company table ul li:before {
  content: '・';
  position: absolute;
  top: 15px;
  left: 8px;
  color: #28B9B9;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.company table .notLink li:before {
  color: #333;
}

@media screen and (max-width: 767px) {
  .company {
    font-size: 14px;
  }

  .company .companyMap {
    gap: 32px;
  }

  .company .companyMap .h {
    font-size: 16px;
  }

  .company .companyMap .item {
    width: 100%;
  }

  .company .companyMap .item p {
    margin-bottom: 8px;
  }

  .company .companyMap .item .more {
    position: relative;
  }

  .company .companyMap .map iframe {
    height: 160px !important;
    aspect-ratio: auto;
  }

  .company table tr {
    border-top: 1px solid #DDDDDD;
  }

  .company table tr:last-of-type {
    border-bottom: 1px solid #DDDDDD;
  }

  .company table th {
    display: block;
    border: none !important;
    padding: 16px 16px 16px 0;
  }

  .company table td {
    display: block;
    border: none !important;
    padding: 0 16px 16px 0;
  }

  .company table ul li {
    margin-bottom: 8px;
  }

  .company table td .mb16 {
    margin-bottom: 8px;
  }
}

/*pcidss-saas*/
.pcidss-saasArea * {
  box-sizing: border-box;
}

.headArea.pcidss-saas {
  background: url("/img/bg_pcidss-saas.jpg") no-repeat center center / cover;

}

.headArea.pcidss-saas .inner {
  background: none;
  padding: 97px 0 82px;
}

.headArea.pcidss-saas h1 {
  margin-bottom: 32px;
}

.headArea.pcidss-saas h1 .small {
  display: block;
  font-size: 14px;
  margin-bottom: 18px;
  letter-spacing: 0;
}

.headArea.pcidss-saas h1 .large {
  font-size: 36px;
}

.headArea.pcidss-saas h1 .logoArea {
  font-size: 14px;
  font-weight: 600;
  display: flex;
  gap: 8px;
  letter-spacing: 0;
}

.headArea.pcidss-saas h1 .logo {
  width: 184px;
  display: block;
  flex-shrink: 0;
}

.headArea.pcidss-saas p {
  margin-bottom: 52px;
}

.pcidss-saasArea .section .head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 132px;
  text-align: center;
  position: relative;
  background: #F3F5F5;
  padding: 0 24px;
}

.pcidss-saasArea .section .head:after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #F3F5F5 transparent transparent transparent;
}

.pcidss-saasArea .section .head h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.32;
  color: #26B7B7;
}

.pcidss-saasArea .section .head h2 .min {
  display: block;
  font-size: 22px;
  margin-bottom: 8px;
}

.pcidss-saasArea .section .body {
  padding: 70px 0 80px;
  background: #fff;
}

.pcidss-saasArea .section .body h2 {
  font-size: 24px;
  font-weight: 600;
  color: #26B7B7;
  text-align: center;
  margin-bottom: 32px;
}

.pcidss-saasArea .section .lead {
  text-align: center;
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 35px;
}

.pcidss-saasArea .sp {
  display: none;
}

.pcidss-saasArea .section.merit .content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pcidss-saasArea .section.merit .content .img {
  width: 51.25%;
}

.pcidss-saasArea .section.merit .content .img img {
  display: block;
  width: 100%;
}

.pcidss-saasArea .section.merit .content .txtArea {
  width: 41.66%;
}

.pcidss-saasArea .section.merit .txtArea ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
}

.pcidss-saasArea .section.merit .txtArea li {
  position: relative;
  padding: 18px 18px 18px 62px;
  background: #FFE3D3;
  font-size: 14px;
  font-weight: 600;
}

.pcidss-saasArea .section.merit .txtArea li::before {
  content: "";
  position: absolute;
  width: 23px;
  height: 17px;
  background-image: url("/img/pcidss-saas_merit_ico.svg");
  background-size: contain;
  background-repeat: no-repeat;
  top: 50%;
  left: 32px;
  transform: translateY(-50%);

}

.pcidss-saasArea .section.merit .txtArea li:first-of-type {
  font-size: 18px;
  background: #FD8F4E;
  color: #fff;
  padding: 18px;
  text-align: center;
}

.pcidss-saasArea .section.merit .txtArea li:first-of-type::before {
  background-image: none;
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-right: 27px solid #fd8f4e;
  border-left: 0;
  left: -27px;
}

.pcidss-saasArea .section.flow .gridArea {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: auto auto auto;
  grid-column-gap: 35px;
  padding-right: 21px;
}

.pcidss-saasArea .section.flow .gridArea .box {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;

}

.pcidss-saasArea .section.flow .gridArea .box .headBlock {
  position: relative;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  background: #C0E3E6;
  padding: 32px 24px;
  padding-right: 8px;
  font-weight: 600;
  text-align: center;
}

.pcidss-saasArea .section.flow .gridArea .box .headBlock::after {
  content: "";
  position: absolute;
  width: 35px;
  height: 100px;
  background-image: url(/img/pcidss-saas_flow_arrow_a.svg);
  background-size: cover;
  top: 0;
  right: -35px;
}

.pcidss-saasArea .section.flow .gridArea .box:nth-of-type(even) .headBlock {
  background: #A3D3D8;
}

.pcidss-saasArea .section.flow .gridArea .box:nth-of-type(even) .headBlock::after {
  background-image: url(/img/pcidss-saas_flow_arrow_b.svg);
}

.pcidss-saasArea .section.flow .gridArea .box:last-of-type .headBlock::after {
  background-image: url(/img/pcidss-saas_flow_arrow_c.svg);
  width: 21px;
  right: -21px;
}

.pcidss-saasArea .section.flow .gridArea .box .icoBlock {
  padding: 26px 8px 24px 32px;
}

.pcidss-saasArea .section.flow .gridArea .box .icoBlock .img {
  text-align: center;
}

.pcidss-saasArea .section.flow .gridArea .box .txtBlock li {
  position: relative;
  font-size: 12px;
  font-weight: 600;
  padding-left: 10px;
  margin-bottom: 6px;
}

.pcidss-saasArea .section.flow .gridArea .box .txtBlock li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 6px;
  height: 6px;
  background: #28B9B9;
  border-radius: 50%;

}

.pcidss-saasArea .case .body {
  background: #F3F5F5;
}

@media screen and (max-width:1024px) {
  .pcidss-saasArea .section .head {
    padding: 0 16px;
  }
}

@media screen and (max-width:767px) {
  .headArea.pcidss-saas {
    background: url("/img/bg_pcidss-saas_sp.jpg") no-repeat center center / cover;

  }

  .headArea.pcidss-saas .sp {
    display: block !important;
  }

  .headArea.pcidss-saas .inner {
    padding: 35px 0 54px;
  }

  .headArea.pcidss-saas h1 {
    margin-bottom: 24px;
  }

  .headArea.pcidss-saas h1 .large {
    font-size: 22px;
    margin-bottom: 15px;
  }

  .pcidss-saas .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .pcidss-saas .btn a {
    font-size: 16px;
  }

  .pcidss-saas .btn .ico {
    width: 21px;
  }

  .pcidss-saasArea .section .head {
    height: auto;
  }

  .pcidss-saasArea .section .head h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .pcidss-saasArea .section .head h2 .min {
    font-size: 14px;
  }

  .pcidss-saasArea .section .body {
    padding: 40px 0 64px;
  }

  .pcidss-saasArea .section .body h2 {
    font-size: 16px;
    margin-bottom: 28px;
  }

  .pcidss-saasArea .sp {
    display: block;
  }

  .pcidss-saasArea .pc {
    display: none;
  }

  .pcidss-saasArea .section .lead {
    font-size: 14px;
    margin-bottom: 20px;
    text-align: left;
  }

  .pcidss-saasArea .image .body {
    padding: 34px 0;
  }

  .pcidss-saasArea .section.merit .content {
    flex-direction: column;
    gap: 36px;
  }

  .pcidss-saasArea .section.merit .content .img {
    width: 100%;
  }

  .pcidss-saasArea .section.merit .content .txtArea {
    width: 100%;
  }

  .pcidss-saasArea .section.merit .txtArea li {
    font-size: 13px;
    padding: 16px 16px 16px 56px;
  }

  .pcidss-saasArea .section.merit .txtArea li:first-of-type {
    font-size: 14px;
    padding: 16px;
  }

  .pcidss-saasArea .section.merit .txtArea li:first-of-type::before {
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
    border-bottom: 27px solid #fd8f4e;
    border-top: 0;
    top: -27px;
    left: 50%;
    transform: translateX(-50%);
  }

  .pcidss-saasArea .section.merit .txtArea li::before {
    width: 20px;
    height: 16px;
    left: 28px;
  }

  .pcidss-saasArea .section.flow .gridArea {
    grid-template-columns: 1fr auto;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    padding-right: 0px;
  }

  .pcidss-saasArea .section.flow .gridArea .box {
    grid-template-rows: subgrid;
    grid-template-columns: subgrid;
    grid-column: span 2;
    grid-row: span 1;
  }

  .pcidss-saasArea .section.flow .gridArea .box .icoBlock {
    display: none;
  }

  .pcidss-saasArea .section.flow .gridArea .box .headBlock::after {
    display: none;
  }

  .pcidss-saasArea .section.flow .gridArea .box .txtBlock {
    display: flex;
    align-items: center;
    padding: 12px;
  }

  .pcidss-saasArea .section.flow .gridArea .box .headBlock {
    padding: 16px;
    height: auto;
    font-size: 13px;
    white-space: nowrap;
  }

  .pcidss-saasArea .section.flow .gridArea .box .txtBlock li {
    font-size: 13px;
  }
}

/*toPcidss-saas*/
.toPcidss-saas * {
  box-sizing: border-box;
}

.toPcidss-saas {
  padding: 42px 0 60px;
}

.awsArea .toPcidss-saas,
.featureArea .toPcidss-saas {
  padding: 112px 0 124px;
  background: #D9F7F6;
}

.managedArea .toPcidss-saas {
  padding: 136px 0 124px;
  background: #F3F5F5;
}

.toPcidss-saas .box {
  margin: 0 auto;
  padding: 24px 24px 46px;
  background: #26B7B7;
}

.toPcidss-saas .box .baloon {
  padding: 16px 38px;
  display: block;
  width: fit-content;
  position: relative;
  background: #fff;
  font-size: 16px;
  font-weight: 600;
  margin: 0 auto 32px;
  color: #26B7B7;
}

.toPcidss-saas .box .baloon::after {
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 14px solid transparent;
  border-left: 14px solid transparent;
  border-top: 14px solid #ffffff;
  border-bottom: 0;
  bottom: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.toPcidss-saas .box .sp {
  display: none;
}

.toPcidss-saas .box .h {
  font-size: 24px;
  font-weight: 600;
  text-align: center;
  color: #fff;
  margin-bottom: 20px;
}

.toPcidss-saas .box .itemGroup {
  display: flex;
  justify-content: center;
  gap: 66px;
  flex-wrap: wrap;
  margin-bottom: 36px;
}

.toPcidss-saas .box .itemGroup .item {
  width: 200px;
}

.toPcidss-saas .box .itemGroup .item .circle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background: #fff;
  margin-bottom: 18px;
}

.toPcidss-saas .box .itemGroup .item .circle .sp {
  display: none;
}

.toPcidss-saas .box .itemGroup .item .txt {
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  text-align: center;
  white-space: nowrap;
}

.toPcidss-saas .box .btn {
  display: block;
  width: calc(100% - 64px);
  max-width: 208px;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 auto;
  font-size: 14px;
  font-weight: bold;
  color: #28b9b9;
  text-align: center;
  line-height: 48px;
  background: #fff;
  box-shadow: 0 3px 6px rgba(47, 50, 51, .16)
}

@media (max-width:767px) {
  .toPcidss-saas {
    padding: 10px 0 36px;
  }

  .awsArea .toPcidss-saas,
  .featureArea .toPcidss-saas,
  .managedArea .toPcidss-saas {
    padding: 24px 0 36px;
  }

  .toPcidss-saas .box {
    padding: 24px 24px 40px;
  }

  .toPcidss-saas .box .baloon {
    max-width: 312px;
    width: 100%;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 13px;
    margin-bottom: 24px;
    text-align: center;
  }

  .toPcidss-saas .box .baloon::after {
    border-right: 12px solid transparent;
    border-left: 12px solid transparent;
    border-top: 12px solid #ffffff;
    bottom: -12px;
  }

  .toPcidss-saas .box .sp {
    display: block;
  }

  .toPcidss-saas .box .h {
    font-size: 18px;
    margin-bottom: 36px;
  }

  .toPcidss-saas .box .itemGroup {
    flex-direction: column;
    gap: 24px;
    padding-left: 24px;
  }

  .toPcidss-saas .box .itemGroup .item {
    display: flex;
    align-items: center;
    gap: 20px;
  }

  .toPcidss-saas .box .itemGroup .item .circle {
    width: 56px;
    height: 56px;
    background: none;
    border-radius: 0;
    flex-shrink: 0;
  }

  .toPcidss-saas .box .itemGroup .item .circle .pc {
    display: none;
  }

  .toPcidss-saas .box .itemGroup .item .circle .sp {
    display: block;
  }

  .toPcidss-saas .box .itemGroup .item .txt {
    font-size: 14px;
    text-align: left;
  }
}

/*checkoutArea*/
.checkoutArea * {
  box-sizing: border-box;
}

.checkoutArea .layout {
  max-width: 900px;
}

.headArea.checkout {
  background-color: #FFEADE;
  background-image: none;
}

.headArea.checkout .inner {
  background-image: url("/img/bg_checkout_pc.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 78px 0 74px;
}

.headArea.checkout h1 {
  margin-bottom: 32px;
}

.headArea.checkout h1 .small {
  display: block;
  font-size: 14px;
  margin-bottom: 18px;
  letter-spacing: 0;
}

.headArea.checkout h1 .large {
  font-size: 36px;
}

.headArea.checkout h1 .logoArea {
  font-size: 14px;
  font-weight: 600;
  display: flex;
  gap: 8px;
  letter-spacing: 0;
}

.headArea.checkout h1 .logo {
  width: 184px;
  display: block;
  flex-shrink: 0;
}

.headArea.checkout p {
  margin-bottom: 52px;
}

.checkoutArea .section .head {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 132px;
  text-align: center;
  position: relative;
  background: #fff;
  padding: 0 24px;
}

.checkoutArea .section .head::after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #fff transparent transparent transparent;
}

.checkoutArea .section .head h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.32;
  color: #FF6716;
}

.checkoutArea .section .head h2 .min {
  position: relative;
  display: block;
  font-size: 22px;
  padding-bottom: 8px;
  margin-bottom: 8px;
}

.checkoutArea .section .head h2 .min::after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 3px;
  background: #FF6716;
}

.checkoutArea .section .body {
  padding: 70px 0;
  background: #F3F5F5;
}

.checkoutArea .section .body h2 {
  font-size: 24px;
  font-weight: 600;
  color: #FF6716;
  text-align: center;
  margin-bottom: 32px;
}

.checkoutArea .section h3 {
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 32px;
}

.checkoutArea .section .lead {
  text-align: center;
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 35px;
}

.checkoutArea .sp {
  display: none;
}

.checkoutArea .scene .itemGroup {
  background: #fff;
  padding: 50px 90px 34px;
  display: flex;
  flex-wrap: wrap;
  grid-row-gap: 16px;
  margin-bottom: 56px;
}

.checkoutArea .scene .itemGroup .item {
  max-width: 180px;
  width: calc(100% / 4);
  margin-bottom: 16px;
}

.checkoutArea .scene .itemGroup .item .ico {
  width: 80px;
  margin: 0 auto 13px;
}

.checkoutArea .scene .itemGroup .item .title {
  height: 42px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  line-height: 1.4;
  text-align: center;
}

.checkoutArea .scene .lead {
  margin-bottom: 0;
}

.checkoutArea .merit .content {
  background: #fff;
  display: flex;
}

.checkoutArea .merit .content:nth-of-type(1) {
  margin-bottom: 20px;
}

.checkoutArea .merit .content .icoArea {
  width: 200px;
  flex-shrink: 0;
}

.checkoutArea .merit .content .icoArea .ico {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.checkoutArea .merit .content .txtArea {
  padding: 24px;
}

.checkoutArea .merit .content .txtArea .h {
  font-size: 24px;
  font-weight: 600;
}

.checkoutArea .merit .content:nth-of-type(1) .txtArea .h {
  color: #FF6716;
}

.checkoutArea .merit .content:nth-of-type(2) .txtArea .h {
  color: #3290B9;
}

.checkoutArea .merit .content .txtArea ul li {
  position: relative;
  font-size: 18px;
  line-height: 1.75;
  padding-left: 30px;
}

.checkoutArea .merit .content .txtArea ul li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.checkoutArea .merit .content:nth-of-type(1) .txtArea ul li::before {
  background-image: url("/img/checkout_ico_11.svg");
}

.checkoutArea .merit .content:nth-of-type(2) .txtArea ul li::before {
  background-image: url("/img/checkout_ico_12.svg");
}

.checkoutArea .case .img {
  margin-bottom: 38px;
}

.checkoutArea .case h3 {
  position: relative;
  padding-bottom: 8px;
  width: fit-content;
  margin: 0 auto 16px;
}

.checkoutArea .case h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #FF6716;
}

.checkoutArea .case .content:nth-of-type(1) {
  margin-bottom: 76px;
}

.checkoutArea .feature .itemGroup {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 18px;
  margin-bottom: 76px;
}

.checkoutArea .feature .itemGroup .item {
  background: #fff;
  width: calc((100% - 36px) / 3);
  padding: 20px 8px 26px;
}

.checkoutArea .feature .itemGroup .item .ico {
  width: 34px;
  height: 34px;
  margin: 0 auto 4px;
}

.checkoutArea .feature .itemGroup .item .h {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 51px;
  font-size: 18px;
  line-height: 1.5;
  color: #FF6716;
  margin-bottom: 16px;
}

.checkoutArea .feature .itemGroup .item .txt {
  padding: 0 16px;
}

@media (max-width:767px) {
  .headArea.checkout .sp {
    display: block !important;
  }

  .headArea.checkout .inner {
    background-image: url("/img/bg_checkout_sp.jpg");
    padding: 35px 0 54px;
  }

  .headArea.checkout h1 {
    margin-bottom: 24px;
  }

  .headArea.checkout h1 .large {
    font-size: 22px;
    margin-bottom: 15px;
  }

  .checkout .btn {
    margin: 16px auto 0;
    width: 224px;
    height: 48px;
    border-radius: 24px;
  }

  .checkout .btn a {
    font-size: 16px;
  }

  .checkout .btn .ico {
    width: 21px;
  }

  .checkoutArea .section .head {
    height: auto;
  }

  .checkoutArea .section .head h2 {
    padding: 24px 16px;
    font-size: 16px;
  }

  .checkoutArea .section .head h2 .min {
    font-size: 14px;
  }

  .checkoutArea .section .body {
    padding: 40px 0 64px;
  }

  .checkoutArea .section .body h2 {
    font-size: 16px;
    margin-bottom: 28px;
  }

  .checkoutArea .sp {
    display: block;
  }

  .checkoutArea .pc {
    display: none;
  }

  .checkoutArea .section h3 {
    font-size: 14px;
  }

  .checkoutArea .section .lead {
    font-size: 14px;
    margin-bottom: 20px;
    text-align: left;
  }

  .checkoutArea .image .body {
    padding: 34px 0;
  }

  .checkoutArea .scene .itemGroup {
    padding: 32px;
  }

  .checkoutArea .scene .itemGroup .item {
    width: calc(100% / 2);
  }

  .checkoutArea .merit .content .icoArea {
    width: 80px;
  }

  .checkoutArea .merit .content .txtArea .h {
    font-size: 16px;
    margin-bottom: 8px;
  }

  .checkoutArea .merit .content .txtArea ul li {
    font-size: 14px;
  }

  .checkoutArea .merit .content .txtArea ul li::before {
    width: 16px;
    height: 16px;
    top: 4px;
  }

  .checkoutArea .case .content:nth-of-type(1) {
    margin-bottom: 36px;
  }

  .checkoutArea .feature .itemGroup {
    flex-direction: column;
  }

  .checkoutArea .feature .itemGroup .item {
    width: 100%;
  }
}

.serviceList {
  padding-bottom: 70px;
}

.serviceList * {
  box-sizing: border-box;
}

.serviceList .box {
  background: #F3F5F5;
  padding: 32px 32px 52px;
}

.serviceList .h {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 40px;
  text-align: center;
}

.serviceList .itemGroup {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr;
  gap: 20px 30px;
}

.serviceList .itemGroup .item {
  min-height: 60px;
}

.serviceList .itemGroup .item a {
  display: flex;
  width: 100%;
  height: 100%;
  position: relative;
  background: #fff;
  padding: 10px 32px 10px 16px;
  font-size: 14px;
  transition: 0.4s ease;
  color: #333333;
  align-items: center;
}

.serviceList .itemGroup .item a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 10px;
  height: 10px;
  border-right: 2px solid #30bbbb;
  border-bottom: 2px solid #30bbbb;
  transform: translateY(-50%)rotate(-45deg);
}

.serviceList .itemGroup .item a:hover {
  color: #28b9b9;
  opacity: 1;
}

@media (max-width:767px) {
  .serviceList .itemGroup {
    grid-template-columns: 1fr;
  }
}

/*waf*/
.headArea.waf {
  background-image: url("/img/bg_waf.jpg");
}

.headArea.waf h1 {
  margin-bottom: 20px;
}

.headArea.waf h1 .small {
  display: block;
  font-size: 14px;
  margin-bottom: 8px;
  letter-spacing: 0;
}

.headArea.waf h1 .large {
  display: block;
  line-height: 1.38;
}

.headArea.waf .logo {
  width: fit-content;
  margin-bottom: 28px;
}

.headArea.waf p {
  font-size: 16px;
  margin-bottom: 90px;
}

.wafArea .section .head {
  background: #F3F5F5;
  color: #336BFF;
}

.wafArea .section .body {
  background: #FFFFFF;
}

.wafArea .section .head:after {
  content: '';
  position: absolute;
  bottom: -30px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 30px 31px 0 31px;
  border-color: #F3F5F5 transparent transparent transparent;
}

.wafArea .requirements .table table {
  border-spacing: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #DEE6EB;
}

.wafArea .requirements .table table thead tr th {
  padding: 16px;
}

.wafArea .requirements .table table thead tr th:nth-of-type(1) {
  width: 195px;
  background: #52E2CA;
  color: #fff;
  border-right: 1px solid #DEE6EB;
}

.wafArea .requirements .table table thead tr th:nth-of-type(2) {
  background: #6F98FC;
  color: #fff;
}

.wafArea .requirements .table table tbody tr th,
.wafArea .requirements .table table tbody tr td {
  border-bottom: 1px solid #DEE6EB;
}

.wafArea .requirements .table table tbody tr:last-of-type th,
.wafArea .requirements .table table tbody tr:last-of-type td {
  border-bottom: none;
}

.wafArea .requirements .table table tbody tr th {
  border-right: 1px solid #DEE6EB;
  font-size: 16px;
  padding: 16px;
}

.wafArea .requirements .table table tbody tr td {
  padding: 30px 36px 24px;
}

.wafArea .requirements .table table tbody tr td p {
  font-size: 16px;
  margin-bottom: 12px;
}

.wafArea .requirements .table table tbody tr td .bold {
  font-weight: 600;
}

.wafArea .requirements .table table tbody tr td ul li {
  position: relative;
  padding-left: 12px;
  margin-bottom: 10px
}

.wafArea .requirements .table table tbody tr td ul li:last-of-type {
  margin-bottom: 0;
}

.wafArea .requirements .table table tbody tr td ul li::before {
  content: "";
  position: absolute;
  top: 9px;
  left: 0;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #336BFF;
}

.wafArea .section h3 {
  font-size: 26px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 32px;
  color: #336BFF;
}

.wafArea .section .lead .tag {
  padding: 4px 8px;
  background: #7F7F7F;
  color: #fff;
  margin-right: 6px;
}

.wafArea .section .circle {
  width: fit-content;
  margin: 0 auto 20px;
}

.wafArea .section .box {
  padding: 32px 32px 40px;
  margin: 0 auto 84px;
  background: #F3F5F5;
}

.wafArea .section .box:last-of-type {
  margin-bottom: 0;
}

.wafArea .section .box .logo {
  max-width: 300px;
  margin: 0 auto 20px;
}

.wafArea .section .box h4 {
  font-size: 18px;
  font-weight: 600;
  color: #336BFF;
  text-align: center;
  margin-bottom: 22px;
}

.wafArea .section .box .itemGroup {
  display: flex;
  gap: 5px;
}

.wafArea .section .box .itemGroup .item {
  width: calc((100% - 5px)/2);
  background: #fff;
}

.wafArea .section .box .itemGroup .item .h {
  padding: 24px;
  text-align: center;
  color: #fff;
  background: #6E96FC;
  font-size: 18px;
  font-weight: 600;
}

.wafArea .section .box .itemGroup .item .txtArea {
  padding: 24px 30px;
}

.wafArea .section .box .itemGroup .item .txtArea li {
  position: relative;
  padding-left: 14px;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 8px;
}

.wafArea .section .box .itemGroup .item .txtArea li::before {
  content: "";
  position: absolute;
  top: 6px;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #6E96FC;
}

.wafArea .section .box .itemGroup .item .txtArea li .note {
  font-size: 11px;
}

.wafArea .section .img {
  margin-bottom: 84px;
}

.wafArea .section .img:last-of-type {
  margin-bottom: 0;
}

.wafArea .section .box .img {
  width: fit-content;
  margin: 0 auto;
  padding: 16px 0;
}

.wafArea .service h3:first-of-type {
  margin-bottom: 15px;
}

@media (max-width:767px) {
  .headArea.waf {
    background-image: url("/img/bg_waf_sp.jpg");
  }

  .headArea.waf p {
    margin-bottom: 60px;
  }

  .wafArea .requirements .table table {
    border: none;
  }

  .wafArea .requirements .table table thead {
    display: none;
  }

  .wafArea .requirements .table table tbody tr {
    display: block;
    margin-bottom: 24px;
    border: 1px solid #dee6eb;
  }

  .wafArea .requirements .table table tbody tr th {
    display: block;
    background: #6F98FC;
    color: #fff;
    padding: 8px;
  }

  .wafArea .requirements .table table tbody tr th::before {
    content: attr(data-head);
    display: block;
    color: #fff;
  }

  .wafArea .requirements .table table tbody tr td {
    display: block;
    padding: 20px 24px;
  }

  .wafArea .section h3 {
    font-size: 16px;
    margin-bottom: 20px;
  }

  .wafArea .section .box .itemGroup {
    flex-direction: column;
    gap: 16px;
  }

  .wafArea .section .box .itemGroup .item {
    width: 100%;
  }

  .wafArea .section .box {
    padding: 16px 16px 20px;
  }

  .wafArea .section .box .itemGroup .item .h {
    padding: 16px;
  }

  .wafArea .section .box .itemGroup .item .txtArea {
    padding: 16px;
  }

  .wafArea .service h3:first-of-type {
    margin-bottom: 12px;
  }
}

/*.topArea .cloudService .gridGroup*/
.topArea .cloudService .gridGroup {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(312px, 1fr));
  grid-gap: 12px;
}

.topArea .cloudService .gridGroup .item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  background: #E9F7F8;
  padding: 32px;
  grid-gap: 16px;
}

.topArea .cloudService .gridGroup .item .ico {
  width: 40px;
  height: 40px;
  margin: 0 auto;
}

.topArea .cloudService .gridGroup .item .btn {
  width: 208px;
  height: 48px;
  border-radius: 3px;
  overflow: hidden;
  margin: 0 auto;
}

.topArea .cloudService .gridGroup .item .btn a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  background: #28B9B9;
}

.topArea .cloudService .gridGroup .item .h {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
}

.topArea .cloudService .gridGroup .item .h .en {
  font-size: 100%;
}

.topArea .cloudService .gridGroup .item .logo {
  margin-bottom: 8px;
}

.topArea .cloudService .gridGroup .item .txt {
  margin-bottom: 8px;
}


/*guest*/
.guest * {
  box-sizing: border-box;
}

.guest #wrap {
  background: #F3F5F5;
}

.guest .headArea {
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 80px 24px 48px;
}

.guest .headArea h1 {
  font-size: 36px;
  margin-left: 20px;
  padding-top: 8px;
}

.guest .lead {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 64px;
}

.guest .headArea img {
  width: 38px;
}

.guest .phone {
  text-align: center;
  margin-bottom: 80px;
}

.guest .phone .h {
  font-size: 14px;
  font-weight: 600;
  line-height: 40px;
}

.guest .phone .txtBlock {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.guest .phone .txtBlock .number {
  display: flex;
  align-items: center;
  font-size: 22px;
  font-weight: 600;
  gap: 8px;
}

.guest .phone .txtBlock .time {
  font-size: 14px;
  font-weight: 600;
}

.guest h2 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 40px;
  text-align: center;
}

.guest .service .layout,
.guest .case .layout {
  max-width: 1160px;
}

.guest .gridGroup {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  grid-gap: 12px;
  margin-bottom: 64px;
}

.guest .gridGroup .item {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 4;
  background: #fff;
  padding: 24px;
  grid-gap: 16px;
}

.guest .gridGroup .item .ico {
  width: 40px;
  height: 40px;
  margin: 0 auto;
}

.guest .gridGroup .item .h {
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  line-height: 1.3;
}

.guest .gridGroup .item .h .en {
  font-size: 100%;
}

.guest .gridGroup .item .logo {
  margin-bottom: 8px;
}

.guest .case ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  grid-gap: 12px;
  margin-bottom: 88px;
}

.guest .case ul li {
  background: #fff;
}

.guest .case ul li .img {
  aspect-ratio: 280/179;
  overflow: hidden;
}

.guest .case ul li .txt {
  position: relative;
  background: #fff;
  padding: 20px 20px 16px;
}

.guest .case ul li .txt .h {
  position: absolute;
  top: 0;
  left: 20px;
  padding: 8px;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  transform: translateY(-50%);
}

.guest .case ul li .txt .h.cat_1 {
  background: #9D6DC4;
}

.guest .case ul li .txt .h.cat_2 {
  background: #ff6666;
}

.guest .case ul li .txt .h.cat_3 {
  background: #26b7b7;
}

.guest .case ul li .txt .h.cat_4 {
  background: #00aeff;
}

.guest .case ul li .txt .h.cat_5 {
  background: #007f92;
}

.guest .case ul li .txt .h.cat_6 {
  background: #484c4d;
}

.guest .case ul li .txt .h.cat_7 {
  background: #ff7a34;
}

.guest .case ul li .txt .h.cat_8 {
  background: #ff6716;
}

.guest .case ul li .txt .h.cat_9 {
  background: #346BFF;
}

.guest .case ul li .txt .name {
  font-size: 15px;
  font-weight: 600;
  color: #333;
}

.guest.thanks .headArea h1 {
  font-size: 24px;
}

.guest.thanks .headArea img {
  width: 47px;
}

.guest.thanks .linkArea {
  margin-bottom: 72px;
}

.guest.thanks .linkArea .itemGroup {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(460px, 1fr));
  grid-gap: 16px 40px;
  margin-bottom: 40px;
}

.guest.thanks .linkArea .itemGroup .item a {
  width: 100%;
  height: 100%;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  background: #fff;
}

.guest.thanks .linkArea .itemGroup .item .img {
  width: 210px;
  flex-shrink: 0;
}

.guest.thanks .linkArea .itemGroup .item .txt {
  font-size: 15px;
  font-weight: 600;
  color: #333;
}

.guest.thanks .linkArea .btn {
  width: 192px;
  height: 42px;
  margin: 0 auto;
}

.guest.thanks .linkArea .btn a {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 16px;
  letter-spacing: .05em;
  font-weight: 600;
  background: #28b9b9;
  border-radius: 3px;
}

.guestFooter {
  text-align: center;
  padding: 80px 24px;
  font-size: 13px;
  background: #fff;
}

@media (max-width:767px) {
  .guest .headArea {
    padding: 40px 16px 36px;
  }

  .guest .headArea h1 {
    font-size: 22px;
  }

  .guest .headArea img {
    width: 32px;
  }

  .guest .lead {
    font-size: 16px;
    margin-bottom: 48px;
  }

  .guest h2 {
    font-size: 18px;
    margin-bottom: 24px;
  }

  .guest .phone .txtBlock {
    flex-direction: column;
  }

  .guest .gridGroup .item .logo {
    width: 160px;
    margin: 0 auto 8px;
  }

  .guest .case ul {
    grid-template-columns: 1fr 1fr;
  }

  .guest .case ul li .txt {
    padding: 20px 12px 16px;
  }

  .guest .case ul li .txt .h {
    font-size: 10px;
    padding: 4px 6px;
    left: 12px;
    line-height: 1.5;
  }

  .guest.thanks .linkArea .itemGroup {
    grid-template-columns: auto;
  }

  .guest.thanks .linkArea .itemGroup .item .img {
    width: 105px;
  }
}

/*encfilecloud*/
.headArea.encfilecloud {
  background-image: url(/img/encfilecloud/bg_encfilecloud.jpg);
}

.encfilecloud hgroup {
  margin-bottom: 24px;
}

.encfilecloud hgroup .small {
  line-height: 2.3;
  font-size: 17px;
  font-weight: 600;
  margin-bottom: 8px;
}

.encfilecloud hgroup h1 {
  margin-bottom: 0;
}

.headArea.encfilecloud p {
  margin-bottom: 0;
}

.headArea.encfilecloud .leadblock {
  margin-bottom: 20px;
}

.headArea.encfilecloud .leadblock .h {
  padding: 8px;
  background: #fff;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.35;
  margin-bottom: 10px;
  width: fit-content;
}

.headArea.encfilecloud .leadblock p {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

.headArea.encfilecloud .top_btnArea {
  margin-top: 78px;
}

@media (max-width:767px) {
  .headArea.encfilecloud .leadblock {
    margin-bottom: 18px;
  }

  .headArea.encfilecloud .leadblock .h {
    font-size: 15px;
  }

  .headArea.encfilecloud .leadblock p {
    font-size: 14px;
  }
}

.encfilecloud .section p {
  font-size: 18px;
}

.encfilecloud .section .head {
  background: #28B9B9;
  color: #ffffff;
}

.encfilecloud .section .head:after {
  border-color: #28B9B9 transparent transparent transparent;
}

.managedArea.encfilecloud .section .body {
  background: #fff;
}

.encfilecloud h3 {
  overflow: hidden;
  position: relative;
  width: fit-content;
  margin: 0 auto 24px;
  padding-bottom: 32px;
  color: #28B9B9;
  font-size: 28px;
  font-weight: 600;
  text-align: center;
  overflow: hidden;
}

.encfilecloud h3::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 960px;
  height: 23px;
  clip-path: path('M0.5 0.5H455.974C456.462 0.5 456.939 0.64265 457.346 0.91038L481.858 17.009L506.37 0.91038C506.778 0.64265 507.255 0.5 507.742 0.5H965.5V5.5H508.49L483.23 22.0896C482.397 22.6368 481.319 22.6368 480.486 22.0896L455.226 5.5H0.5V0.5Z');
  background: #28b9b9;
  translate: -50% 0;
}

.encfilecloud .list li {
  position: relative;
  padding-left: 14px;
  font-size: 18px;
  font-weight: 600;
}

.encfilecloud .list li::after {
  content: "";
  position: absolute;
  top: calc((1em*1.75)/2);
  left: 0;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #28B9B9;
}

@media (max-width:767px) {
  .encfilecloud .section p {
    font-size: 14px;
  }

  .encfilecloud h3 {
    padding-bottom: 24px;
    font-size: 16px;
  }

  .encfilecloud h3::after {
    scale: 0.5;
  }
}

.encfilecloud .table table {
  border-spacing: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #dee6eb;
}

.encfilecloud .table table thead th {
  background: #84A9FF;
  color: #fff;
  font-weight: 600;
  font-size: 18px;
  padding: 16px;
}

.encfilecloud .table table thead th:nth-of-type(1) {
  width: 160px;
  border-right: 1px solid #fff;
}

.encfilecloud .table table tbody {
  font-size: 14px;
}

.encfilecloud .table table tbody th,
.encfilecloud .table table tbody td {
  border-bottom: 1px solid #dee6eb;
}

.encfilecloud .table table tbody th {
  font-weight: 600;
  border-right: 1px solid #dee6eb;
  padding: 18px 12px;
}

.encfilecloud .table table tbody td {
  padding: 18px;
}

.encfilecloud .table table ul {
  margin-bottom: 12px;
}

.encfilecloud .table table ul li {
  position: relative;
  padding-left: 12px;
  font-size: 14px;
  line-height: 1.7;
}

.encfilecloud .table table ul li::after {
  content: "";
  position: absolute;
  top: calc((1em*1.7)/2);
  left: 4px;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #84A9FF;
}

.encfilecloud .table table td p {
  margin-bottom: 8px;
  font-size: 14px;
}

.encfilecloud .table table td p:last-of-type {
  margin-bottom: 0;
}

@media (max-width:767px) {
  .encfilecloud .table table {
    display: block;
    border: none;
  }

  .encfilecloud .table table thead {
    display: none;
  }

  .encfilecloud .table table tbody tr {
    display: block;
    margin-bottom: 24px;
    border: 1px solid #dee6eb;
  }

  .encfilecloud .table table tbody tr th {
    display: block;
    background: #6F98FC;
    color: #fff;
    padding: 8px;
  }

  .encfilecloud .table table tbody tr th::before {
    content: attr(data-head);
    display: block;
    color: #fff;
  }

  .encfilecloud .table table tbody tr th br {
    display: none;
  }

  .encfilecloud .table table tbody tr td {
    display: block;
  }

  .encfilecloud .table table tbody tr td::before {
    content: attr(data-head);
    display: block;
    text-align: center;
    font-weight: 600;
    margin-bottom: 8px;
  }
}

.encfilecloud .box+p {
  margin-top: 40px;
}

.encfilecloud .box+p:last-of-type {
  margin-bottom: 0;
}

.encfilecloud .flexitems {
  display: flex;
  gap: 56px;
  margin-bottom: 48px;
}

.encfilecloud .flexitems .item:nth-of-type(1) {
  position: relative;
  width: 244px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  background: #E8EFFF;
  padding: 32px 20px;
  text-align: center;
}

.encfilecloud .flexitems .item:nth-of-type(1)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -70px;
  transform: translateY(-50%);
  width: 82px;
  height: 78px;
  background-image: url(/img/encfilecloud/encfilecloud_arrow.svg);
  background-size: cover;
  background-repeat: no-repeat;
}

.encfilecloud .flexitems .item:nth-of-type(1) p {
  font-size: 18px;
}

.encfilecloud .flexitems .item:nth-of-type(1) p .large {
  font-weight: 600;
  font-size: 21px;
}

.encfilecloud .flexitems .item:nth-of-type(1) p .marker {
  background: linear-gradient(transparent 52%, #fed03c 52%, #fed03c 80%, transparent 80%);
  display: inline;
  padding: 0 1px 0px;
}

.encfilecloud .flexitems .item:nth-of-type(2) {
  background: #E9F7F8;
  padding: 20px 32px 40px;
  font-size: 15px;
  line-height: 1.5;
}

.encfilecloud .flexitems .item:nth-of-type(2) .headblock {
  margin-bottom: 40px;
}

.encfilecloud .flexitems .item:nth-of-type(2) .headblock .small {
  font-size: 18px;
  line-height: 2.2;
  font-weight: 600;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock {
  margin-bottom: 30px;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock:last-of-type {
  margin-bottom: 0;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock {
  margin-bottom: 30px;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock:last-of-type {
  margin-bottom: 0;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock .h {
  font-size: 18px;
  padding: 8px;
  line-height: 1.35;
  background: #FED03C;
  width: fit-content;
  margin-bottom: 12px;
  font-weight: 600;
}

.encfilecloud .flexitems .item:nth-of-type(2) .leadblock p {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

@media (max-width:767px) {
  .encfilecloud .flexitems {
    flex-direction: column;
  }

  .encfilecloud .flexitems .item:nth-of-type(1) {
    width: 100%;
  }

  .encfilecloud .flexitems .item:nth-of-type(1)::after {
    top: auto;
    bottom: -70px;
    left: 50%;
    transform: translateX(-50%)rotate(90deg);
  }

  .encfilecloud .flexitems .item:nth-of-type(1) p {
    font-size: 16px;
  }

  .encfilecloud .flexitems .item:nth-of-type(1) p .large {
    font-size: 18px;
  }

  .encfilecloud .flexitems .item:nth-of-type(2) .headblock .small {
    font-size: 15px;
  }

  .encfilecloud .flexitems .item:nth-of-type(2) .headblock .logo {
    width: 226px;
  }

  .encfilecloud .flexitems .item:nth-of-type(2) .leadblock {
    margin-bottom: 18px;
  }

  .encfilecloud .flexitems .item:nth-of-type(2) .leadblock .h {
    font-size: 15px;
  }

  .encfilecloud .flexitems .item:nth-of-type(2) .leadblock p {
    font-size: 14px;
  }
}

.encfilecloud .about_container {
  margin-bottom: 80px;
}

.encfilecloud .about_container:last-of-type {
  margin-bottom: 0;
}

.encfilecloud .about_container .img {
  margin-bottom: 48px;
}

@media (max-width:767px) {
  .encfilecloud .about_container {
    margin-bottom: 56px;
  }

  .encfilecloud .about_container .img {
    margin-bottom: 24px;
  }

  .encfilecloud .about_container .list {
    margin-left: 0;
  }

  .encfilecloud .list li {
    font-size: 14px;
  }

}

/*contact*/
#contact.guest .headArea {
  display: block;
}

#contact.guest .headArea .shoulder {
  width: fit-content;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 12px;
  padding: 2px 10px;
  line-height: 1;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  background: #007780;
}

#contact.guest .headArea .joint {
  width: fit-content;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 12px;
  font-size: 20px;
  font-weight: 700;
  border-bottom: solid 2px #007780;
  color: #007780;
}

#contact.guest .headArea hgroup {
  background: none;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
}

#contact.guest .headArea img {
  width: 54px;
}

#contact.guest .headArea h1 {
  margin: 0;
  padding: 0;
}

#contact.guest .lead {
  margin-bottom: 72px;
}

#contact.guest .contact-block {
  display: flex;
  margin-bottom: 32px;
  padding: 40px;
  background: #FFFFFF;
  gap: 40px;
}

#contact.guest .contact-block.sw {
  flex-direction: column;
}

#contact.guest .contact-block.sw .lead-block {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  line-height: 35px;
  text-align: justify;
}

#contact.guest .contact-block .person {
  width: 250px;
}

#contact.guest .contact-block .person .img {
  width: 100%;
  margin: 0 0 16px;
}

#contact.guest .contact-block .person .img img {
  display: block;
  width: 100%;
}

#contact.guest .contact-block .person .txt {
  padding: 16px;
  background: #F3F5F5;
  font-size: 11px;
  line-height: 1.27;
}

#contact.guest .contact-block .person .txt .h {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 8px;
}

#contact.guest .contact-block .person .txt p {
  margin-bottom: 8px;
}

#contact.guest .contact-block .person .txt p:last-of-type {
  margin-bottom: 0;
}

#contact.guest .contact-block .person .txt p:has(+ ul) {
  margin-bottom: 0;
}

#contact.guest .contact-block .person .txt ul {
  margin-bottom: 8px;
}

#contact.guest .contact-block .person .txt ul li {
  padding-left: 1em;
  text-indent: -1em;
}

#contact.guest .contact-block.sw .person-block {
  width: 100%;
  display: flex;
  gap: 0 38px;
}

#contact.guest .contact-block.sw .person {
  display: flex;
  flex-direction: column;
  background: #F3F5F5;
  width: 50%;
  padding: 20px;
}

#contact.guest .contact-block.sw .person .person-box {
  display: flex;
}

#contact.guest .contact-block.sw .person .person-box .img {
  width: 120px;
  height: 120px;
}

#contact.guest .contact-block.sw .person .txt p {
  line-height: 14px;
  margin-bottom: 8px;
}

#contact.guest .contact-block.sw .person .career {
  display: flex;
  flex-direction: column;
  font-size: 11px;
}

#contact.guest .contact-block.sw .person .career ul {
  margin-bottom: 8px;
}

#contact.guest .contact-block.sw .person .career ul li {
  padding-left: 1em;
  text-indent: -1em;
}

@media (max-width:767px) {
  #contact.guest .contact-block.sw .lead-block {
    font-size: 15px;
    line-height: 1.75em;
  }

  #contact.guest .contact-block.sw .lead-block br {
    display: none;
  }

  #contact.guest .contact-block.sw .person-block {
    display: block;
  }

  #contact.guest .contact-block.sw .person {
    display: block;
    width: 100%;
    margin-bottom: 38px;
  }

  #contact.guest .contact-block.sw .txt-group li {
    font-size: 14px;
    line-height: 1.75em;

  }
}

#contact.guest .contact-block .txt-group {
  flex: 1;
}

#contact.guest .contact-block .txt-group p {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 16px;
  line-height: 1.8;
}

#contact.guest .contact-block .txt-group .baloon {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
  height: 32px;
  background: #28B9B9;
  padding: 2px 12px;
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 18px;
  border-radius: 4px;
  color: #fff;
}

#contact.guest .contact-block .txt-group .baloon::after {
  content: '';
  position: absolute;
  bottom: -9px;
  left: 7px;
  width: 0;
  height: 0;
  border-right: 11px solid transparent;
  border-left: 0;
  border-top: 9px solid #28b9b9;
}

#contact.guest .contact-block .txt-group li {
  position: relative;
  padding-left: 12px;
  font-size: 15px;
  line-height: 1.42;
  margin-bottom: 6px;
}

#contact.guest .contact-block .txt-group li::before {
  content: '';
  position: absolute;
  top: calc((1em*1.42)/2);
  left: 0;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #28B9B9;
}

@media (max-width:767px) {
  #contact.guest .lead {
    margin-bottom: 48px;
  }

  #contact.guest .contact-block {
    flex-direction: column-reverse;
  }

  #contact.guest .contact-block .person {
    width: 100%;
  }

  #contact.guest .contact-block .txt-group p {
    font-size: 14px;
  }

  #contact.guest .contact-block .txt-group li {
    font-size: 12px;
  }
}


/* ---------------- p-form */
.p-form {
  background: #fff;
  color: #333 !important;
}

.p-form br {
  display: none;
}

.p-form>div {
  max-width: 768px !important;
  margin: 0 auto;
  padding: 48px 0 !important;
  color: inherit !important;
}

.p-form .zcwf_title {
  display: none;
}

.p-form .zcwf_row {
  margin: 0 0 24px !important;
}

.p-form .zcwf_col_lab {
  width: 250px !important;
  margin: 0 !important;
  padding: 0 24px 0 0 !important;
  font-size: 16px !important;
  font-weight: 600;
  text-align: right;
}

.p-form .zcwf_col_lab label span[style="color:red;"] {
  overflow: hidden;
  display: inline-block;
  position: relative;
  width: 32px;
  height: 20px;
  margin-left: 4px;
  text-indent: 100%;
  vertical-align: middle;
  white-space: nowrap;
}

.p-form .zcwf_col_lab label span[style="color:red;"]::after {
  content: '必須';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #28B9B9;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-align: center;
  text-indent: 0;
}

.p-form .zcwf_col_fld {
  width: calc(100% - 250px) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.p-form .zcwf_col_help {
  display: block;
  float: none !important;
  max-width: none !important;
  margin: 0 !important;
}

.p-form .zcwf_col_help>span {
  display: none !important;
}

.p-form .zcwf_tooltip_over {
  display: block !important;
  margin-top: 6px;
}

.p-form .zcwf_tooltip_ctn {
  position: static !important;
  max-width: none !important;
  padding: 0 !important;
  background: none !important;
  color: #666 !important;
  font-size: 13px !important;
  line-height: 1.5;
}

.p-form .zcwf_privacy {
  padding: 0 !important;
  margin-left: 250px;
}

.p-form .zcwf_privacy .vaT {
  translate: 0 4px;
}

.p-form .zcwf_privacy .vaT input {
  display: inline-block !important;
}

.p-form .zcwf_privacy .zcwf_privacy_txt,
.p-form .zcwf_privacy .zcwf_privacy_txt span,
.p-form .zcwf_privacy .zcwf_privacy_txt font {
  color: #333 !important;
  font-size: 14px !important;
}

@media (max-width:1023px) {
  .p-form>div {
    max-width: 400px !important;
    padding: 16px !important;
  }

  .p-form .zcwf_col_lab {
    float: none !important;
    width: auto !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .p-form .zcwf_col_fld {
    width: auto !important;
  }

  .p-form .zcwf_lblLeft .zcwf_col_fld {
    float: none !important;
  }

  .p-form .zcwf_col_help {
    width: auto !important;
  }

  .p-form .zcwf_privacy {
    margin-left: 0;
  }
}

/* input */
.p-form .zcwf_col_fld input[type="text"] {
  outline: none;
  float: none !important;
  width: 100% !important;
  max-width: 480px;
  height: 37px !important;
  padding: 0 10px !important;
  background: #f5fcfc;
  border: 1px solid #c4dfdf !important;
  border-radius: 2px;
  color: inherit;
  font-size: 14px;
  -webkit-appearance: none;
}

.p-form .zcwf_col_fld input[type="text"]:focus {
  background: #fff;
}

.p-form .zcwf_col_fld textarea {
  outline: none;
  float: none !important;
  width: 100% !important;
  height: 160px !important;
  padding: 8px 10px !important;
  background: #f5fcfc;
  border: 1px solid #c4dfdf !important;
  border-radius: 2px;
  color: inherit;
  font-size: 14px;
  -webkit-appearance: none;
}

.p-form .zcwf_col_fld textarea:focus {
  background: #fff;
}

.p-form .zcwf_col_fld select {
  outline: none;
  position: relative;
  width: 100% !important;
  max-width: 260px;
  height: 32px !important;
  padding: 0 32px 0 12px !important;
  background: url(/img/form_select_arw.svg) no-repeat right 12px center;
  border: 1px solid #c4dfdf !important;
  border-radius: 32px;
  color: inherit;
  font-size: 15px;
  -webkit-appearance: none;
}

.p-form .zcwf_checkbox label input {
  display: none;
}

.p-form .zcwf_checkbox .label {
  display: grid;
  grid-template-columns: 16px 1fr;
  gap: 8px;
  align-items: center;
}

.p-form .zcwf_checkbox .label::before {
  content: '';
  display: block;
  aspect-ratio: 1 / 1;
  width: 16px;
  background: #fff;
  border: 1px solid #C4DFDF;
  border-radius: 2px;
}

.p-form .zcwf_checkbox input:checked+.label::before {
  background: url(/img/form_checkbox_on.svg) no-repeat center center / contain;
  border: none;
}

.p-form .formsubmit {
  width: 240px !important;
  height: 60px !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #28B9B9 !important;
  border: none !important;
  border-radius: 3px !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}

.p-form input[type=reset] {
  display: none;
}

/* close */
.p-form .close {
  background: #dff4f4;
  text-align: center;
}
.p-form .close br {
  display: block;
}

/* CTA全体 */
#contents #content_inner .article .cta_button {
  display: grid;
  grid-template-columns: repeat(2, 360px);
  gap: 32px;
  justify-content: center;
  margin: 40px 0 56px;
}

/* 各ボタン共通 */
#contents #content_inner .article .cta_button .download-cta-button,
#contents #content_inner .article .cta_button .ondemand-cta-button {
  width: 100%;
  max-width: 360px;
  min-height: 72px;
  color: #fff;
  display: grid;
  grid-template-columns: auto max-content;
  column-gap: 12px;
  /* ここで余白を作る */
  align-items: center;
  justify-content: center;
  /* 中央寄せしたいなら */
  cursor: pointer;
  transition: opacity 0.4s ease;
  border-radius: 40px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.1rem;
  box-sizing: border-box;
  padding-inline: 52px;
}

/* hover */
#contents #content_inner .article .cta_button .download-cta-button:hover,
#contents #content_inner .article .cta_button .ondemand-cta-button:hover {
  opacity: 0.6;
}

/* 共通：疑似要素 */
.download-cta-button::before,
.ondemand-cta-button::before {
  content: "";
  display: block;
  grid-column: 1;
  align-self: center;
  transform: translateY(-1px);
}

/* 資料DL */
.download-cta-button {
  background-color: #FE7A0C;
}

.download-cta-button::before {
  width: 25px;
  height: 27px;
  background: url("/img/blog/cta_btnArea_ico_01.svg") no-repeat center / contain;
}

/* オンデマンド */
.ondemand-cta-button {
  background-color: #28B9B9;
}

.ondemand-cta-button::before {
  width: 32px;
  height: 28px;
  background: url("/img/blog/cta_btnArea_ico_02.svg") no-repeat center / contain;
}

/* SP */
@media (max-width: 767px) {
  #contents #content_inner .article .cta_button {
    grid-template-columns: 1fr;
    gap: 20px;
    justify-items: center;
  }

  #contents #content_inner .article .cta_button .download-cta-button,
  #contents #content_inner .article .cta_button .ondemand-cta-button {
    max-width: 277px;
    min-height: 60px;
    font-size: 16px;
    padding-inline: 20px;
  }

  .download-cta-button::before {
    width: 22px;
    height: 24px;
  }

  .ondemand-cta-button::before {
    width: 28px;
    height: 24px;
  }
}