@charset "utf-8";
body {
  color: #363636;
  font-size: 16px;
  font-family: helvetica, arial, "宋体", san-serif;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
  min-width: 0;
}

h1{
  font-weight: bold;
}
h3{
  font-size: 1.17em;
}

a {
  text-decoration: none;
  color: #373737;
}
a:link, a:visited{
  text-decoration: none;
  color: #373737;
}

a:hover {
  text-decoration: underline;
}

img {
  vertical-align: top;
  font-size: 0;
  line-height: 0;
  max-width: 100%;
  height: auto;
}

a img {
  transition: .2s ease-in-out;
}

a img:hover {
  opacity: .7;
  filter: alpha(opacity=70);
}

th{
  font-weight: bold;
}
strong{
  font-weight: bold;
}

@media screen and (max-width:640px) {
  html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
    font-size: 16px;
  }
}

/* /css/ss/products/vision/visionbasics/setting.css */

/* //////////////////////////////////////////////////////////////////////////

    Common Settings

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Helper Class
========================================================================== */
/*  Display
========================================================================== */
.block {
  display: block !important;
}

.inblock {
  display: inline-block !important;
}

.inline {
  display: inline !important;
}

.table {
  display: table !important;
}

/*  Float
========================================================================== */
.fl {
  float: left !important;
}

.floatR {
  float: right !important;
}

.clear {
  clear: both;
}

/*  Margin, Padding, Border
========================================================================== */
/* margin */
.mt0 {
  margin-top: 0 !important;
}

.mt10 {
  margin-top: 10px !important;
}

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

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

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

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

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

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

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

.mb40 {
  margin-bottom: 40px !important;
}

.ml10 {
  margin-left: 10px !important;
}

.mr10 {
  margin-right: 10px !important;
}

/* padding */
.pt10 {
  padding-top: 10px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pb20 {
  padding-bottom: 20px !important;
}

.pr10 {
  padding-right: 10px !important;
}

/* border */
.border {
  box-sizing: border-box;
  border: solid 1px #ddd;
}

/*  Columns
========================================================================== */
.col2Wrap,
.col3Wrap,
.col4Wrap {
  display: table;
  width: 100%;
}

.col2Wrap .col,
.col3Wrap .col,
.col4Wrap .col {
  float: left;
  box-sizing: border-box;
  margin: 0 1% 20px 0;
}

.col2Wrap .col:nth-child(2n),
.col3Wrap .col:nth-child(3n),
.col4Wrap .col:nth-child(4n) {
  margin-right: 0;
}

.col3Wrap .col {
  width: 32.6%;
}

.col2Wrap .col {
  width: 49.5%;
}

.col4Wrap .col {
  width: 24.25%;
}

/*  Container
========================================================================== */
.inner {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}

.spItem {
  display: none;
}

.imgWrap {
  margin: 20px 0;
  text-align: center;
}

.imgWrap .col {
  display: inline-block;
}

.imgWrap.border {
  padding: 20px;
}

/* ==========================================================================
    Style
========================================================================== */
/*  Heading
========================================================================== */
/* Main Title */
.ttlMain {
  margin: 0 0 1em;
  color: #435b6b;
  font-size: 225%;
  font-weight: normal;
  line-height: 1.2;
}

/* Background */
.ttlBgImg {
  box-sizing: border-box;
  margin: 0 0 1em;
  padding: 15px;
  background: url(/img/ss/products/vision/visionbasics/bg_inner_ttl_h2.gif) no-repeat right center #2c7fab;
  color: #fff;
  font-size: 150%;
  font-weight: normal;
  line-height: 1.2;
}

.ttlBgBlue {
  box-sizing: border-box;
  margin: 0 0 25px;
  padding: 10px 15px;
  border: 1px solid #cee6ef;
  background: #e7f4fa;
  color: #435b6b;
  font-size: 132%;
  font-weight: normal;
}

/* Bold */
.ttlBold {
  font-size: 100%;
  font-weight: bold;
  margin-bottom: 20px;
}

.ttlBoldBlue {
  color: #0085c3;
  font-weight: bold;
  font-size: 113%;
  margin-bottom: 20px;
}

/* Border */
.ttlBorderLeft {
  box-sizing: border-box;
  margin: 0 0 20px;
  padding: 0 0 0 7px;
  border-left: 3px solid #0085c3;
  color: #435b6b;
  font-size: 113%;
  font-weight: normal;
}

.ttlBorderBottom {
  box-sizing: border-box;
  color: #435b6b;
  font-size: 113%;
  padding-bottom: 5px;
  margin-bottom: 20px;
  border-bottom: 1px solid #b6b8b7;
  font-weight: bold;
}

.ttlBorderBottomBlue {
  box-sizing: border-box;
  margin: 0 0 10px;
  padding: 0 0 2px;
  border-bottom: 1px solid #0085c4;
  font-weight: bold;
}

/*  Text
========================================================================== */
.textBlue {
  color: #0085c3 !important;
}

.textRed {
  color: #e41a26 !important;
}

.textBrown {
  color: #7e513a !important;
}

.textBlack {
  color: #393939 !important;
}

.textBold {
  font-weight: bold !important;
}

.textNormal {
  font-weight: normal !important;
}

.textSmall,
small {
  font-size: 80% !important;
}

.textRight {
  text-align: right !important;
}

.textLeft {
  text-align: left !important;
}

.textCenter {
  text-align: center !important;
}

.textBorder {
  border: solid 1px #0085c3;
  color: #0085c3;
}

/*  Link
========================================================================== */
a.linkArrow {
  padding: 0 0 0 1em;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow.png) no-repeat left .3em;
  color: #0085c3;
}

a.linkBlue {
  color: #0085c3 !important;
}

a.linkLine {
  text-decoration: underline;
}

a.linkLine:hover {
  text-decoration: none;
}

/*  Box
========================================================================== */
/* Border */
.boxBorder {
  box-sizing: border-box;
  margin: 25px 0;
  padding: 25px;
  border: 3px solid #cee6ef;
}

.boxBorderThin {
  box-sizing: border-box;
  margin: 25px 0;
  padding: 25px;
  border: 1px solid #cee6ef;
}

.boxBorderGray {
  box-sizing: border-box;
  margin: 25px 0;
  padding: 25px;
  border: 1px solid #dedede;
}

.boxBorderDarkBlue {
  box-sizing: border-box;
  border: solid 1px #435b6b;
}

.boxBorderDarkBlue .boxHead {
  padding: .5em 0;
  background: #435b6b;
  color: #fff;
  font-weight: normal;
  text-align: center;
}

.boxBorderDarkBlue .boxBody {
  box-sizing: border-box;
  padding: 20px;
}
@media screen and (max-width:640px) {
  .boxBorderDarkBlue .boxBody {
    padding: 10px;
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* Background */
.boxBlue {
  box-sizing: border-box;
  padding: 20px;
  background: #e7f4fa;
  color: #0085c3;
}

/*  Table
========================================================================== */
.tableBorder {
  width: 100%;
  border: solid 1px #435b6b;
}

.tableBorder th,
.tableBorder td {
  border: solid 1px #435b6b;
  padding: .5em;
  vertical-align: middle;
}

.tableBorder th {
  background: #e7f4fa;
}

.tableBorder thead th {
  background: #374d5C;
  color: #fff;
}

.tableBorder .bgDarkBlue {
  background: #374d5C;
  color: #fff;
}

.tableScroll {
  overflow-x: scroll;
}

.tableScroll::-webkit-scrollbar {
  width: 5px;
  background: #e7f4fa;
}

.tableScroll::-webkit-scrollbar:horizontal {
  height: 5px;
  background: #e7f4fa;
}

.tableScroll::-webkit-scrollbar-thumb {
  background: #3ea8dc;
  border-radius: 2px;
}

.tableScroll::-webkit-scrollbar-thumb:horizontal {
  background: #3ea8dc;
  border-radius: 2px;
}

/*  List
========================================================================== */
/* List Style */
.listNone {
  list-style: none !important;
}

.listDisc {
  padding: 0 0 0 1.2em;
  list-style: outside disc;
}

.listDecimal {
  padding: 0 0 0 1.2em;
  list-style: outside decimal;
}

.listDecimalStyled {
  counter-reset: number;
  display: table;
  width: 100%;
}

.listDecimalStyled li {
  list-style: none;
}

.listDecimalStyled li::before {
  counter-increment: number;
  content: counter(number);
  float: left;
  padding: 0 .5em;
  margin: 0 .5em 0 0;
  color: #fff;
  font-weight: bold;
  background: #0085c3;
}

/* Color */
.listBlue {
  color: #0185c5;
}

.listBlue span {
  color: #363636;
}

/*  Arrow
========================================================================== */
.arrowBottomAfter::after {
  content: '';
  display: block;
  height: 21px;
  margin: 15px 0;
  background: url(/img/ss/products/vision/visionbasics/arrow_box.jpg) no-repeat center center;
  background-size: auto 100%;
}

.arrowBottomBefore::before {
  content: '';
  display: block;
  height: 21px;
  margin: 15px 0;
  background: url(/img/ss/products/vision/visionbasics/arrow_box.jpg) no-repeat center center;
  background-size: auto 100%;
}

@media screen and (max-width: 640px) {

  .pcCol .col,
  .pcCol .col,
  .pcCol .col {
    float: none;
    width: 100%;
    margin: 0 0 20px;
  }

  .inner {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0 2%;
  }

  .spItem {
    display: block;
  }

  .pcItem {
    display: none !important;
  }
}

/*  Text
========================================================================== */
.indent_t {
  text-indent: -0.5em;
  margin-left: 0.5em;
}

.textlink:link,
.textlink:visited {
  color: #06c;
  text-decoration: none;
}

.textlink:hover {
  text-decoration: underline;
}

/*  compare_images
========================================================================== */
.compare_images {
  margin: 20px auto;
  border: solid 1px #c7c7c7;
}

.compare_images .bar {
  padding: 10px 8px;
  border-bottom: solid 1px #c7c7c7;
  background: linear-gradient(to right, #e7f4fa, #113251);
  color: #fff;
  font-weight: bold;
  text-align: center;
}

.compare_images .image_table {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.compare_images .image_table .row {
  flex: 1 1 50%;
  display: table;
  table-layout: fixed;
  width: 50%;
  border-right: 1px solid transparent;
}

.compare_images .image_table .row:first-of-type {
  border-color: #c7c7c7;
}

.compare_images .image_table .col {
  display: table-cell;
  width: 50%;
  padding: 10px;
  border-right: 1px solid #c7c7c7;
  text-align: center;
}

.compare_images .image_table .col:last-of-type,
.compare_images .image_table .merged .col {
  border-color: transparent;
}

.compare_images .image_table .term {
  padding: 8px;
  background: #76aee2;
}

.compare_images .image_table .row:first-of-type .col:first-of-type .term {
  background: #e7f4fa;
}

.compare_images .image_table .row:last-of-type .col .term {
  background: #113251;
  color: #fff;
}

.compare_images .image_table .caption {
  display: none;
}

.compare_images .image_table.col_many .row {
  flex-basis: 40%;
  width: 40%;
}

.compare_images .image_table.col_many .row.merged {
  flex-basis: 60%;
  width: 60%;
}

@media screen and (max-width: 640px) {
  .compare_images {
    border: none;
  }

  .compare_images .bar {
    display: none;
  }

  .compare_images .image_table {
    display: block;
  }

  .compare_images .image_table .row {
    width: 100%;
    margin: 15px 0;
    border: 1px solid #c7c7c7;
  }
  
  .compare_images .image_table.col_many .row {
    width: 100%;
  }

  .compare_images .image_table .caption {
    display: block;
    font-size: 24px;
    line-height: 1.25;
  }
  .compare_images .image_table.col_many .row.merged {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
  }
}

/*  SVG Wrapper
========================================================================== */
.svg_graph {
  max-width: 720px;
  margin: 40px auto;
}

.prt_svg_wrap {
  position: relative;
  padding-top: 48.6%;
  overflow: hidden;
}

.prt_svg_wrap .svg_inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.prt_svg_wrap svg {
  max-width: 100%;
  height: auto;
}

.prt_svg_wrap .svg_text1 {
  fill: #fff;
  font-size: 18px;
}

.prt_svg_wrap .svg_text2 {
  fill: #3d8d4b;
  font-size: 20px;
  font-weight: bold;
}


/*  Inquiry Banner
========================================================================== */
.prt_inquiry_banner {
  max-width: 720px;
  margin: 0 auto 40px;
}

.prt_inquiry_banner a,
.prt_inquiry_banner a * {
  text-decoration: none;
}

.prt_inquiry_banner a {
  display: block;
}

.prt_inquiry_banner a:hover {
  opacity: 0.7;
}

.prt_inquiry_banner .banner {
  position: relative;
  border: 3px solid #3e944d;
  background: #eaf4f6;
}

.prt_inquiry_banner .banner:after {
  content: "";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 97px;
  height: 134px;
  background: url(/img/ss/common/icon_calculator_001.png) no-repeat center / contain;
}

.prt_inquiry_banner .caption {
  position: relative;
  padding: 14px 120px 14px 18px;
  background: #3e944d;
  color: #fff;
  font-size: 24px;
  font-weight: bold;
  line-height: 1.143;
  overflow: hidden;
}

.prt_inquiry_banner .caption:before {
  content: "";
  position: absolute;
  top: 0;
  right: -405px;
  width: 720px;
  height: 400px;
  background: #6ba573;
  transform: rotate(-60deg);
}

.prt_inquiry_banner .caption:after {
  content: "";
  position: absolute;
  top: 0;
  right: -425px;
  width: 720px;
  height: 400px;
  background: #a3ccaa;
  transform: rotate(-60deg);
}

.prt_inquiry_banner .caption span {
  position: relative;
  z-index: 10;
}

.prt_inquiry_banner .content {
  padding: 10px 120px 14px 18px;
}

.prt_inquiry_banner .content p {
  margin: 0;
  color: #333;
  font-size: 16px;
  font-weight: bold;
}

.prt_inquiry_banner .content .button {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  margin: 12px 0 0;
  padding: 8px 8px 9px;
  background: #ce3939;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.3;
  text-align: center;
}

.prt_inquiry_banner .content .button:after {
  content: "";
  display: inline-block;
  flex: 0 0 13px;
  height: 13px;
  margin-left: 10px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  font-size: 0;
  vertical-align: middle;
  transform: rotate(45deg);
}


/*  Contents Button
========================================================================== */
.prt_sect_cv {
  max-width: 720px;
  margin: 48px auto;
}

.prt_sect_cv * {
  box-sizing: border-box;
  text-align: inherit;
}

.prt_sect_cv:after {
  display: block;
  visibility: hidden;
  clear: both;
  height: 0;
  content: "";
  font-size: 0;
}

.prt_sect_cv .button {
  width: 48%;
  width: -webkit-calc(50% - 10px);
  width: calc(50% - 10px);
}

.prt_sect_cv .button.inquiry {
  float: left;
  clear: left;
}

.prt_sect_cv .button.download {
  float: right;
  clear: right;
}

.prt_sect_cv .button a:hover {
  text-decoration: none;
  opacity: 0.7;
}
@media screen and (max-width: 640px) {
  .prt_sect_cv .button span.txt01,.prt_sect_cv .button span.txt02{
    font-size: 2.5vw;
  }
}

.prt_inquiry_btn {
  display: table;
  position: relative;
  max-width: 380px;
  width: 100%;
  height: 60px;
  padding: 0 12px;
  border-radius: 5px;
  background: #1284c8;
  background: #3e944c;
  background: linear-gradient(#3e944c, #176a25);
  text-align: center;
  text-decoration: none;
  font-size: 15px;
}

.prt_inquiry_btn .label {
  display: table-cell;
  color: #fff;
  vertical-align: middle;
  text-decoration: none;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
  padding: 0 60px 0 10px;
}

.prt_inquiry_btn.icon01>span:first-child {
  background: url(/img/ss/common/icon_download_001.png) no-repeat left center;
}

.prt_inquiry_btn .img01 {
  position: absolute;
  top: 50%;
  right: 12px;
  display: inline-block;
  transform: translateY(-50%);
}

.ss_download_btn {
  position: relative;
  display: table;
  border-radius: 5px;
  background: #e60012;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #cc1717), color-stop(0, #e24140));
  background: -webkit-linear-gradient(#e24140, #cc1717);
  background: -webkit-gradient(linear, left top, left bottom, from(#e24140), to(#cc1717));
  background: linear-gradient(#e24140, #cc1717);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.ss_download_btn.type01,
.ss_download_btn.type02 {
  padding: 6px 0 5px;
  width: 100%;
  text-align: center;
}

.ss_download_btn.type01,
.ss_download_btn.type02 {
  padding-right: 12px;
  padding-left: 12px;
}

.ss_download_btn.type01 {
  max-width: 360px;
  height: 45px;
}

.ss_download_btn.type02 {
  max-width: 350px;
  height: 60px;
}

.ss_download_btn.icon01>span:first-child {
  background: url(/img/ss/common/bg_icon_dl_001.png) no-repeat left center;
}

.ss_download_btn.icon02>span:first-child {
  background: url(/img/ss/common/bg_icon_dl_002.png) no-repeat left center;
}

.ss_download_btn .img01,
.ss_download_btn .img02 {
  position: absolute;
  top: 50%;
  right: 12px;
  display: inline-block;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.ss_download_btn .img01 img,
.ss_download_btn .img02 img {
  border: solid 1px #ccc;
}

.ss_download_btn .txt01,
.ss_download_btn .txt02 {
  display: table-cell;
  color: #fff;
  vertical-align: middle;
  word-break: break-word;
  font-weight: bold;
}

.ss_download_btn .txt01,
.ss_download_btn .txt02 {
  padding-left: 30px;
  width: -webkit-calc(100% - 30px);
  width: calc(100% - 30px);
  font-size: 16px;
  line-height: 1.2;
}

.ss_download_btn .txt01 {
  padding-right: 60px;
}

.ss_download_btn .txt02 {
  padding-right: 79px;
}


/*  SUB Page Bnr
========================================================================== */
.ss_subpage_bnr,
.ss_subpage_bnr * {
  box-sizing: border-box;
}

.ss_subpage_bnr {
  margin: 30px 10px;
}

.ss_subpage_bnr img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}

.ss_subpage_bnr .banner {
  display: block;
  position: relative;
  max-width: 580px;
  margin: 0 auto;
  padding: 30px;
  border: 1px solid #2c7fab;
  box-sizing: border-box;
  background: #fff;
  color: #333;
  font-size: 14px;
  line-height: 1.4;
  text-decoration: none;
  word-break: break-word;
  overflow: hidden;
}

.ss_subpage_bnr .banner:hover {
  opacity: 0.7;
  text-decoration: none;
}

.ss_subpage_bnr .img {
  float: left;
  width: 104px;
  border: 1px solid #ccc;
}

.ss_subpage_bnr .inner {
  width: auto;
  margin: 0 0 0 130px;
  padding-bottom: 3em;
}

.ss_subpage_bnr .title {
  margin-bottom: 8px;
  padding-bottom: 3px;
  border-bottom: 1px solid #2c7fab;
  font-size: 18px;
}

.ss_subpage_bnr .title strong {
  font-weight: bold;
  vertical-align: baseline;
}

.ss_subpage_bnr .btn_wrap {
  position: absolute;
  bottom: 10px;
  right: 10px;
  left: 124px;
  text-align: center;
}

.ss_subpage_bnr .btn_wrap .button {
  display: inline-block;
  width: 100%;
  max-width: 320px;
  padding: 8px 36px;
  border-radius: 5px;
  background-color: #e24141;
  background: url(/img/ss/common/bg_icon_dl_001.png) no-repeat 12px center, linear-gradient(#e24141, #ca1616);
  color: #fff;
  font-weight: bold;
}

@media screen and (max-width: 640px) {
  .ss_subpage_bnr {
    margin: 20px 0;
  }

  .ss_subpage_bnr .banner {
    padding: 20px;
    max-width: none;
    width: 100%;
    line-height: inherit;
  }

  .ss_subpage_bnr .btn_wrap .button {
    padding: 8px 10px 8px 48px;
    width: 100%;
    text-align: left;
  }

  .ss_subpage_bnr .title {
    font-size: inherit;
  }
}

/*  anchorList
========================================================================== */
.prt_anchor_list_01 {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 40px 0 30px;
  padding: 4px 4px 18px;
  background: rgba(83, 83, 83, 0.05);
  font-size: 0;
}

.prt_anchor_list_01.style_col {
  flex-direction: column;
}

.prt_anchor_list_01>li {
  position: relative;
  margin: 0.75rem 0.875rem 0;
  padding-left: 1.125rem;
  font-size: 0.938rem;
  line-height: 1.33333;
}

.prt_anchor_list_01>li::before {
  position: absolute;
  top: 0.25rem;
  left: 0;
  width: 0.75rem;
  height: 0.75rem;
  background: #2c7fab;
  content: "";
  font-size: 0;
}

.prt_anchor_list_01>li::after {
  position: absolute;
  top: 0.75rem;
  left: 0.375rem;
  width: 0.312rem;
  height: 0.312rem;
  border-top: 0.062rem solid #fff;
  border-left: 0.062rem solid #fff;
  content: "";
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

.prt_anchor_list_01>li a {
  color: #06c;
  text-decoration: none;
}

.prt_anchor_list_01>li a:hover {
  text-decoration: underline;
}

.prt_anchor_list_01>li>a {
  font-weight: bold;
}

.prt_anchor_list_01>li ul {
  margin-left: -1.562rem;
  font-size: 0;
}

.prt_anchor_list_01>li ul li {
  position: relative;
  display: inline-block;
  margin: 0.375rem 0.5rem 0;
  padding-left: 0.875rem;
  font-size: 0.938rem;
}

.prt_anchor_list_01>li ul li::before {
  position: absolute;
  top: 0.875rem;
  left: 0.312rem;
  width: 0.375rem;
  height: 0.375rem;
  border-top: 0.125rem solid #2c7fab;
  border-left: 0.125rem solid #2c7fab;
  content: "";
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  -webkit-transform-origin: left top;
  transform-origin: left top;
}

.prt_anchor_list_01>li.is_line {
  width: 100%;
}

/*  boxStyle
========================================================================== */
.box_style01 {
  padding: 20px;
  background: #e7f4fa;
}

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

.box_style01 .box_title {
  margin: 0 0 18px;
  color: #0085c3;
  font-weight: bold;
  font-size: 112.5%;
  line-height: 1.4em;
}

/*  floatImage
========================================================================== */
.float_image {
  overflow: hidden;
  margin-bottom: 35px;
}

.float_image .image {
  float: right;
  margin-bottom: 20px;
  margin-left: 20px;
}

.float_image.no_wrap .image {
  margin-bottom: 0;
  text-align: center;
}

.float_image.no_wrap .txt {
  overflow: hidden;
  margin: 0;
}

@media screen and (max-width: 640px) {

  .float_image .image,
  .float_image.no_wrap .image {
    float: none;
    margin-bottom: 20px;
    margin-left: 0;
  }
}

/*  colBox
========================================================================== */
.col_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  max-width: 980px;
  margin: 20px auto 40px;
}

.col_box.col_2 .col {
  width: 350px;
  margin: 0 70px 25px;
}

.col_box.col_3 .col {
  width: 255px;
  margin-right: 107px;
  margin-bottom: 25px;
}

.col_box.col_2 .col:nth-child(2n),
.col_box.col_3 .col:nth-child(3n) {
  margin-right: 0;
}

@media screen and (max-width: 640px) {
  .col_box {
    flex-direction: column;
  }

  .col_box>* {
    min-height: 0%;
  }

  .col_box.col_2 .col,
  .col_box.col_3 .col {
    margin-right: 0;
    margin-left: 0;
    width: 100%;
  }
}

/*  columnItemStyle
========================================================================== */
.col_style01>.thumb {
  text-align: center;
  margin-bottom: 5px;
}

.col_style01>.title {
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
}

.col_style01>.txt {
  color: #333;
  font-size: 87.5%;
}

/*  modalLink
========================================================================== */
.modal_link {
  display: block;
  transition: opacity 0.3s;
}

.modal_link:hover {
  text-decoration: none;
  opacity: 0.7;
}

.modal_link:hover img {
  opacity: 1;
}

/*  desc_list
========================================================================== */
.desc_list {
  margin: 20px 0;
}

.desc_list>.item+.item {
  margin-top: 25px;
}

.desc_list>.item .title {
  font-weight: bold;
  font-size: 112.5%;
  margin-bottom: 5px;
}

/*  colorbox
========================================================================== */
#colorbox,
#cboxOverlay,
#cboxWrapper {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
}

#colorbox * {
  box-sizing: border-box;
}

#cboxWrapper {
  max-width: none;
}

#cboxOverlay {
  position: fixed;
  width: 100%;
  height: 100%;
}

#cboxMiddleLeft,
#cboxBottomLeft {
  clear: left;
}

#cboxContent {
  position: relative;
}

#cboxLoadedContent {
  overflow: auto;
  margin: 0 auto;
  padding: 20px;
}

#cboxLoadedContent p {
  margin-top: 20px;
}

#cboxLoadedContent p em {
  font-weight: bold;
  font-style: normal;
}

#cboxTitle {
  margin: 0;
}

#cboxLoadingOverlay,
#cboxLoadingGraphic {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#cboxPrevious,
#cboxNext,
#cboxClose,
#cboxSlideshow {
  cursor: pointer;
}

.cboxPhoto {
  float: left;
  margin: auto;
  border: 0;
  display: block;
  max-width: none;
}

.cboxIframe {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
  padding: 0;
  margin: 0;
}

#colorbox,
#cboxContent,
#cboxLoadedContent {
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
}

#cboxOverlay {
  background: #000;
  opacity: .5;
  filter: alpha(opacity=50);
}

#colorbox {
  outline: 0;
}

#cboxContent {
  margin-top: 44px;
  overflow: visible;
  background: #fff;
}

.cboxIframe {
  background: #fff;
}

#cboxError {
  padding: 50px;
  border: 1px solid #ccc;
}

#cboxLoadingOverlay {
  background: #fff;
}

#cboxCurrent {
  position: absolute;
  top: -22px;
  right: 205px;
  text-indent: -9999px;
}

#cboxPrevious,
#cboxNext,
#cboxSlideshow {
  border: 0;
  padding: 0;
  margin: 0;
  overflow: visible;
  text-indent: -9999px;
  width: 20px;
  height: 20px;
  position: absolute;
  top: -20px;
}

#cboxTitle {
  position: absolute;
  top: -44px;
  left: 0;
  color: #333;
  padding: 10px 15px;
  font-weight: bold;
  background: #f4f4f4;
  border-bottom: #c3c3c3 1px solid;
  width: 100%;
  min-height: 44px;
}

#cboxClose {
  position: absolute;
  top: -35px;
  right: 15px;
  display: block;
  text-indent: -999em;
  height: 25px;
  width: 25px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  cursor: pointer;
  transition: opacity 0.3s;
}

#cboxClose:before {
  content: "";
  display: block;
  background: #666;
  border: #666 1px solid;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 12px;
  right: 3px;
  width: 20px;
  height: 1px;
}

#cboxClose:after {
  content: "";
  display: block;
  background: #666;
  border: #666 1px solid;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  position: absolute;
  top: 12px;
  right: 3px;
  width: 20px;
  height: 1px;
}

#cboxPrevious:active,
#cboxNext:active,
#cboxSlideshow:active,
#cboxClose:active {
  outline: 0;
}

#cboxPrevious {
  background-position: 0px 0px;
  right: 44px;
}

#cboxPrevious:hover {
  background-position: 0px -25px;
}

#cboxNext {
  background-position: -25px 0px;
  right: 22px;
}

#cboxNext:hover {
  background-position: -25px -25px;
}

#cboxClose {
  background-position: -50px 0px;
}

#cboxClose:hover {
  background-position: -50px -25px;
}

.cboxSlideshow_on #cboxPrevious,
.cboxSlideshow_off #cboxPrevious {
  right: 66px;
}

.cboxSlideshow_on #cboxSlideshow {
  background-position: -75px -25px;
  right: 44px;
}

.cboxSlideshow_on #cboxSlideshow:hover {
  background-position: -100px -25px;
}

.cboxSlideshow_off #cboxSlideshow {
  background-position: -100px 0px;
  right: 44px;
}

.cboxSlideshow_off #cboxSlideshow:hover {
  background-position: -75px -25px;
}

/* modal_movie */
#modal_movie {
  margin: 0 auto;
  max-width: 620px;
  width: 100%;
}

#modal_movie .movie_wrap {
  position: relative;
  overflow: hidden;
  margin: 0 auto 25px;
  max-width: 620px;
  max-height: 355px;
  width: 100vw;
  height: 100vw;
}

#modal_movie .movie_ttl {
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 18px;
}

#modal_movie .movie_txt {
  font-size: 15px;
}

/*  tableOfContents
========================================================================== */
.tableOfContents {
  max-width: 980px;
  margin: 40px 0;
}

.tableOfContents .tocHeader {
  padding: 10px;
  background: #cee6ef;
  font-weight: bold;
  text-align: center;
  user-select: none;
}

.tableOfContents .tocHeader span {
  margin: 0 0.25em;
  color: #06c;
  cursor: pointer;
}

.tableOfContents .tocHeader span:hover {
  color: #f00;
  opacity: 0.7;
}

.tableOfContents .tocHeader span[data-label-status='show']:before {
  content: attr(data-show-label);
}

.tableOfContents .tocHeader span[data-label-status='hide']:before {
  content: attr(data-hide-label);
}

.tableOfContents .tocBody {
  background: #e7f4fa;
}

.tableOfContents .tocInner {
  padding: 20px;
}

.tableOfContents .catname {
  margin: 8px 0 4px;
  font-weight: bold;
}

.tableOfContents .catname:first-child {
  margin-top: 0;
}

.tableOfContents .chapterList {
  display: flex;
  flex-wrap: wrap;
}

.tableOfContents .chapterList li {
  flex: 1 1 462px;
  margin: 0 4px;
}

.tableOfContents .chapterList a {
  display: inline-block;
  padding: 0 0 0 16px;
  color: #06c;
  text-align: left;
  text-indent: -16px;
}

.tableOfContents .chapterList a:hover {
  color: #f00;
  opacity: 0.7;
  text-decoration: none;
}

.tableOfContents .chapterList a:before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin: -2px 8px 0 0;
  border-width: 5px 4px 0;
  border-style: solid;
  border-color: #0085c3 transparent transparent;
  font-size: 0;
  vertical-align: middle;
}

@media screen and (max-width: 640px) {
  .tableOfContents .chapterList {
    display: block;
  }
}

/*  recognitionResultImage
========================================================================== */
.recognitionResultImage_01 {
  display: flex;
  margin: 20px 0;
}

.recognitionResultImage_01 .frame {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin: 0 auto;
  padding: 24px 19px 20px 24px;
  box-sizing: border-box;
  border: 1px solid #b6b8b7;
}

.recognitionResultImage_01 .keyImage {
  flex: 1 0 auto;
  margin-right: 5px;
}

.recognitionResultImage_01 .resultImages .caption {
  font-size: 14px;
  line-height: 1.25;
}

.recognitionResultImage_01 .resultImages>.caption {
  margin: 0 0 10px;
  padding: 0 5px;
  text-align: right;
}

.recognitionResultImage_01 .resultImages .caption dl div {
  display: inline-block;
}

.recognitionResultImage_01 .resultImages .caption dl dt,
.recognitionResultImage_01 .resultImages .caption dl dd {
  display: inline;
}

.recognitionResultImage_01 .resultImages .caption dl div {
  text-align: left;
  margin-left: 1em;
}

.recognitionResultImage_01 .resultImages .caption dl div:first-child {
  margin-left: 0;
}

.recognitionResultImage_01 .resultImages .caption dl dt:after {
  content: ": ";
}

.recognitionResultImage_01 .resultImages .images {
  display: flex;
  justify-content: space-between;
}

.recognitionResultImage_01 .resultImages .image {
  flex: 1 0 auto;
  margin: 0 5px;
  text-align: center;
}

.recognitionResultImage_01 .resultImages .image .caption {
  display: flex;
  justify-content: space-around;
  margin: 10px 0 0;
}

.recognitionResultImage_01 .resultImages .image .caption span {
  flex: 1;
  display: inline-block;
  padding: 0 5px;
  font-size: inherit;
  text-align: center;
}

@media screen and (max-width: 640px) {
  .recognitionResultImage_01 {
    display: block;
  }

  .recognitionResultImage_01 .frame {
    display: block;
    padding: 20px;
  }

  .recognitionResultImage_01 .resultImages .caption {
    margin: 20px 0;
    padding: 0;
    font-size: 20px;
  }

  .recognitionResultImage_01 .keyImage {
    margin: 0 0 20px;
  }

  .recognitionResultImage_01 .keyImage,
  .recognitionResultImage_01 .resultImages .image {
    flex: 1;
    text-align: center;
  }

  .recognitionResultImage_01 .resultImages .image.grow2 {
    flex-grow: 2;
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Common Layout

////////////////////////////////////////////////////////////////////////// */
.header {
  width: 100%;
  border-top: solid 5px #2f4554;
  background: #fff;
}

.header .inner {
  display: -ms-flexbox;
  display: flex;
  position: relative;
  box-sizing: border-box;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/*    Header - Logo
========================================================================== */

#header .logo {
  flex: 0 0 162px;
}

.headLogo {
  margin-right: 10px;
  padding: 10px 0;
  flex-shrink: 0;
}

.logoMain span {
  display: block;
  font-size: 13px;
  font-weight: bold;
  white-space: nowrap;
}


/*    Header - Contact
========================================================================== */
.headContact ul {
  display: -ms-flexbox;
  display: flex;
  margin-left: -5px;
}

.headContact li {
  margin-left: 5px;
  display: -ms-flexbox;
  display: flex;
}

#header .logoCi {
  margin-left: 10px;
}

.headContact li a {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  min-width: 198px;
  text-align: center;
  border-radius: 0 0 5px 5px;
  min-height: 37px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  transition: opacity 0.3s;
  box-sizing: border-box;
  padding: 3px 44px 4px 58px;
}

.headContact li a:hover,
.headContact li a:focus {
  opacity: .7;
  text-decoration: none;
}

#header .btn_download a {
  background: #e60012;
}

#header .btn_contact a {
  background: #41a147;
}

#header .btn_tel a {
  background: #00284a;
}

#header .logoCi a {
  min-width: auto;
  padding: 0;
  border-radius: 0;
}

#header .headContact li a:before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 10px;
  margin-top: -2px;
  transform: translateY(-50%);
}

#header .btn_download a:before {
  width: 18px;
  height: 24px;
  background: url(/img/ss/common/bg_icon_dl_001.png) no-repeat center;
  background-size: contain;
}

#header .btn_contact a:before {
  width: 24px;
  height: 24px;
  background: url(/img/ss/common/bg_icon_contact_001.png) no-repeat center;
  background-size: contain;
}

#header .btn_tel a:before {
  width: 22px;
  height: 30px;
  background: url(/img/ss/common/bg_icon_tel_001.png) no-repeat center;
  background-size: contain;
}

.headContact .btn_tel {
  display: none;
}

#header .logoCi img {
  max-width: inherit;
}

@media screen and (max-width: 768px) {
  #header .list_box {
    flex-basis: 295px;
  }

  #header .list_box li {
    flex-basis: 145px;
  }
  #header .logo {
    margin-right: 10px;
  }
}

@media screen and (max-width: 640px) {
  .header .inner {
    display: block;
    padding: 0;
  }

  #header .site_title {
    flex-basis: 45%;
  }
  #header .logo {
    flex-basis: 162px;
  }

  .headLogo {
    margin: 0;
    padding: 6px 184px 6px 12px;
  }

  .logoMain a {
    width: auto;
    display: block;
  }

  .logoMain span {
    white-space: inherit;
    font-size: 20px;
  }

  .logoMain img {
    vertical-align: bottom;
  }

  .headContact ul {
    margin-left: 0;
  }

  .headContact li {
    width: 33.33333%;
    margin-left: 0;
  }

  .headContact .btn_tel {
    display: -ms-flexbox;
    display: flex;
  }

  #header .logoCi {
    position: absolute;
    top: 12px;
    right: 12px;
    margin-left: 0;
    width: auto;
  }

  .headContact li a {
    width: 100%;
    padding: 40px 5px 5px;
    min-width: inherit;
    border-radius: 0;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: start;
    align-items: flex-start;
    font-size: 22px;
  }

  #header .headContact li a:before {
    top: 10px;
    left: 50%;
    font-size: 14px;
    transform: translateX(-50%);
  }

  #header .logoCi img {
    width: auto;
  }

  #header .list_box {
    flex-basis: 100%;
  }
}

/* ==========================================================================
    Global Navi
========================================================================== */
.gnav {
  position: relative;
  width: 100%;
  background: url(/img/ss/products/vision/visionbasics/bg_nav.png) repeat-x #2b414f;
  background-size: contain;
  color: #a4b4bc;
}
@media screen and (max-width:640px) {
  .gnav {
    height: 0;
  }
}

.gnav.isFixed {
  z-index: 1000;
  position: fixed;
  top: 0;
  left: 0;
}

.gnavSpacer {
  position: relative !important;
  top: 0;
}

.gnav>ul {
  position: relative;
  display: flex;
  max-width: 980px;
  margin: 0 auto;
}

.gnav>ul>li {
  display: flex;
  width: 20%;
  text-align: center;
  vertical-align: top;
}

.gnav button {
  position: relative;
  display: block;
  width: 100%;
  background-color: transparent;
  border: none;
  font-size: 100%;
  line-height: 1.1;
  appearance: none;
  border-right: 1px solid #2f3d47;
  padding: 14px 20px 14px 5px;
  color: #fff;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  word-break: break-word;
  overflow-wrap: break-word;
}

.gnav>ul>li:first-child button {
  border-left: 1px solid #2f3d47;
}

.gnav button:after {
  content: '';
  display: block;
  position: absolute;
  width: 8px;
  height: 5px;
  top: 50%;
  right: 7px;
  margin-top: -3px;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow_nav_down.png) no-repeat;
}

.isRunJs .gnav>ul>li>a:hover,
.isRunJs .gnav>ul>li>a.isActive,
.isRunJs .gnav>ul>li>span:hover,
.isRunJs .gnav>ul>li>span.isActive {
  background-color: #4a687d;
}

.gnavUnder {
  color: #a4b4bc;
  font-weight: bold;
}

.gnavSmall {
  display: block;
  font-size: 12px;
}
/* Parent */
.gnavParent.isActive + .gnavChild{
  display: flex;
  flex-wrap: wrap;
}

/* Child */
.gnavChild {
  width: 100%;
  max-width: 980px;
  z-index: 100;
  display: table;
  padding: 10px 5px 5px;
  background: #3c5567;
  color: #fff;
  text-align: left;
  display: none;
}

.isRunJs .gnavChild {
  position: absolute;
  top: 100%;
  left: 0;
}

.gnavChild>li {
  width: 20%;
  margin: 0 0 10px;
  padding: 0 10px 0 5px;
  word-break: break-word;
  overflow-wrap: break-word;
}

.isRunJs .gnavBasic .gnavChild>li {
  margin: 0;
}

.gnavChild a {
  display: block;
  padding-left: 8px;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow_nav_right.png) no-repeat left 0.5em;
  color: #fff;
  text-decoration: none;
  word-break: break-word;
  overflow-wrap: break-word;
}

.gnavChild a:hover {
  color: #b2cbdd;
  text-decoration: underline;
}

.gnavChild dt {
  margin: 0 0 10px;
  font-size: 106.3%;
}

.gnavChild dd {
  margin: 0 0 10px;
}

.isHide {
  display: none;
}

/* ==========================================================================
    Breadcrumbs
========================================================================== */
.breadcrumb {
  margin: 0 0 30px;
  padding: 15px 0;
  background: #e7f4fa;
  color: #6a6a6a;
  font-size: 75%;
}

.breadcrumb a {
  color: #6a6a6a;
}

.breadcrumb ol {
  list-style: none;
}

.breadcrumb li {
  display: inline-block;
}

.breadcrumb li::after {
  content: '|';
  display: inline-block;
  margin: 0 10px;
}

.breadcrumb li:first-child::after {
  content: '>';
}

.breadcrumb li:last-child::after {
  display: none;
}

/* ==========================================================================
    Font Size
========================================================================== */
.fontSize {
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  text-align: right;
}

.fontSize ul,
.fontSize p {
  display: inline-block;
}

.fontSize li {
  display: inline-block;
  padding: 5px 10px;
  border: 1px solid #0085c3;
  background: #fff;
  color: #0085c3;
  vertical-align: middle;
  cursor: pointer;
}

.fontSize .current {
  color: #fff;
  background: #0085c3;
}

.toppage .fontSize {
  margin: 20px auto;
}

/* ==========================================================================
    Main
========================================================================== */
.contentsWrap {
  position: relative;
  display: block;
  width: 100%;
  max-width: 980px;
  box-sizing: border-box;
  margin: 10px auto;
  padding: 0 0 40px;
}

.main {
  width: 100%;
}

/* ==========================================================================
    Side
========================================================================== */
.side {
  width: 25%;
  max-width: 217px;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: 520px;
}

/*  Side - Navi
========================================================================== */
.sideNavWrap {
  padding: 0 0 20px;
  display: none;
}

.sideNav {
  margin: -1px 0 0;
  box-sizing: border-box;
  border-left: solid 1px #e2e2e2;
  border-right: solid 1px #e2e2e2;
  font-size: 88%;
}

.side button {
  width: 100%;
  background-color: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  appearance: none;
  font-size: 100%;
}

.sideNav:first-child {
  margin: 0;
}

.sideNavHead,
.side button {
  display: block;
  padding: 1.5em 1em;
  border-bottom: 1px solid #e2e2e2;
  font-weight: bold;
  background-position: 190px center;
  background-repeat: no-repeat;
  background-image: url(/img/ss/products/vision/visionbasics/side_nav_icon_on.png);
  cursor: pointer;
  text-align: left;
}

.sideNav:first-child .sideNavHead {
  border-top: 1px solid #e2e2e2;
}

.sideNavBody {
  padding: 15px 10px;
  border-bottom: 1px solid #e2e2e2;
}

.sideNavBody dt,
.sideNavBody li {
  padding: 0 0 0 10px;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow.png) no-repeat 0 .5em;
}

.sideNavBody dd,
.sideNavRuled li {
  margin: 0 0 5px;
  padding: 0 0 0 20px;
  background: url(/img/ss/products/vision/visionbasics/side_nav_icon_ttl.png) no-repeat 10px .5em;
}

.sideNavBody dt {
  margin: 0 0 5px;
}

.sideNavBody li {
  margin: 0 0 15px;
}

.sideNavBody li:last-child,
.sideNavBody dd:last-child {
  margin: 0;
}

.sideNavBody .sideNavChild {
  margin: 0 0 20px;
  padding: 0;
  background: none;
}

.sideNavBody .sideNavChild:last-child {
  margin: 0;
}

/* Active */
.sideNav a.isActive {
  color: #0085c3;
}

.isActive .sideNavHead {
  background-color: #e7f4fa;
  color: #0085c3;
}

/* Accordion - Close */
.isClose.sideNav {
  padding-bottom: 0 !important;
}

.isClose .sideNavHead {
  margin-bottom: 0 !important;
  background-image: url(/img/ss/products/vision/visionbasics/side_nav_icon_off.png);
}

.sideNavInner {
  height: 0;
  overflow: hidden;
  transition: height .3s ease;
}

.isLoad .sideNavInner {
  transition: none;
}

/*  Side - Banner
========================================================================== */
.sideCv li {
  margin: 0 0 10px;
}

.sideCv #sideDownload>div {
  display: none;
}

.sideCv li:last-child {
  margin: 0;
}

.sideCv.isFixed {
  position: fixed;
  top: 80px;
}

.sideCv.isBottom {
  position: absolute;
}

.sideBnr .series_box {
  display: block;
  width: 230px;
  padding: 10px;
  border: solid 2px #2c7fab;
  background: #fff;
  box-sizing: border-box;
}

.sideBnr .series_box .item {
  display: block;
  margin-bottom: 5px;
}

.sideBnr .series_box .item::after {
  display: table;
  content: "";
  clear: both;
}

.sideBnr .series_box .item .right {
  display: block;
  float: right;
  width: 110px;
}

.sideBnr .series_box .item .left {
  display: block;
  float: left;
}

.sideBnr .series_box .item .txt {
  display: block;
  color: #333;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 5px;
}

.sideBnr .series_box .item .ttl {
  display: block;
  font-size: 15px;
  line-height: 1.2;
  color: #2c7fab;
  font-weight: bold;
}

.sideCv .ss_download_btn.type03 {
  max-width: 100%;
  height: 26px;
  padding: 6px 8px 5px;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
}

.sideCv .ss_download_btn.icon02>span:first-child {
  background: url(/img/ss/products/vision/visionbasics/side_bnr_icon.png) no-repeat left center;
}

.sideCv .ss_download_btn .txt05 {
  padding-left: 20px;
  font-size: 12px;
  line-height: 1;
  display: table-cell;
  color: #fff;
  vertical-align: middle;
  word-break: break-all;
  font-weight: bold;
}

.sideCv a:hover {
  text-decoration: none;
}

.sideCv .ss_download_btn {
  position: relative;
  display: table;
  border-radius: 5px;
  background: #e60012;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #cc1717), color-stop(0, #e24140));
  background: -webkit-linear-gradient(#e24140, #cc1717);
  background: -moz-linear-gradient(#e24140, #cc1717);
  background: linear-gradient(#e24140, #cc1717);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.sideCv #sideDownload {
  margin-bottom: 20px;
}

.sideCv .catalog_box {
  display: block;
  width: 230px;
  padding: 10px;
  box-sizing: border-box;
  border: 1px solid #e7e7e7;
  background: #fff;
}

.sideCv .catalog_box .catch {
  display: block;
  font-size: 16px;
  color: #d31c1e;
  font-weight: bold;
  margin-bottom: 10px;
}

.sideCv .catalog_box .item {
  display: block;
  margin-bottom: 10px;
}

.sideCv .catalog_box .item::after {
  display: table;
  content: "";
  clear: both;
}

.sideCv .catalog_box .item img {
  display: block;
  float: left;
  width: 46px;
  margin-right: 7px;
  border: 1px solid #ccc;
}

.sideCv .catalog_box .item .txt {
  display: block;
  color: #333;
  float: left;
  font-size: 13px;
  font-weight: bold;
  line-height: 1.4;
  width: 140px;
}

/* ==========================================================================
    Summary
========================================================================== */
.summary,
.boxSummary {
  margin: 30px auto;
  padding: 20px;
  background: #e7f4fa;
}

.summary ol,
.summary ul {
  margin: 10px 0;
  color: #0185c5;
}

.summary ol:last-child,
.summary ul:last-child {
  margin-bottom: 0;
}

.summaryHead,
.boxSummary .boxHead {
  background: blue;
  box-sizing: border-box;
  margin: -20px -20px 20px;
  padding: 5px 0;
  background: #0185c5;
  color: #fff;
  font-size: 113%;
  font-weight: bold;
  text-align: center;
}

/* ==========================================================================
    Download
========================================================================== */
.btnDownload {
  margin: 20px 0;
  text-align: right;
}

.btnDownload a {
  display: inline-block;
  width: 40%;
  text-decoration: none;
}

.btnDownload a img {
  width: 100%;
}

.btnDownload.type02 {
  margin: 20px 0 40px;
  text-align: right;
  width: auto;
  margin-left: auto;
}

.btnDownload.type02 a {
  max-width: 100%;
  padding: 15px 80px 12px 20px;
  width: auto;
  text-align: center;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  border-radius: 2px;
  background: #e60012;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #cc1717), color-stop(0, #e24140));
  background: -webkit-linear-gradient(#e24140, #cc1717);
  background: -moz-linear-gradient(#e24140, #cc1717);
  background: linear-gradient(#e24140, #cc1717);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}

.btnDownload.type02 a:hover {
  text-decoration: none;
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.btnDownload.type02 a .txt {
  font-size: 110%;
  line-height: 1;
  display: block;
  color: #fff;
  overflow-wrap: break-word;
  word-break: break-word;
  font-weight: bold;
  background: url(/img/ss/products/vision/visionbasics/side_bnr_icon.png) no-repeat left center;
  padding-left: 30px;
  box-sizing: border-box;
}

.btnDownload.type02 a .icon {
  width: 45px;
  border: 1px solid #ccc;
  position: absolute;
  top: 50%;
  right: 10px;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.btnDownload.type02 a .icon img {
  width: 100%;
  height: auto;
}

.btnDownload.landscape a {
  padding-right: 96px;
}

.btnDownload.landscape a .icon {
  width: 72px;
}

/* ==========================================================================
    btnPageLink
========================================================================== */
.btnPageLink_01 {
  margin-top: 5px;
  margin-bottom: 30px;
  text-align: right;
}

.btnPageLink_01 a {
  position: relative;
  display: inline-block;
  padding: 13px 20px 13px 35px;
  background: #eef4fb;
  text-align: left;
  line-height: 1.2;
}

.btnPageLink_01 a:hover {
  color: #f00;
  opacity: 0.7;
  text-decoration: none;
}

.btnPageLink_01 a:before {
  position: absolute;
  top: 50%;
  left: 15px;
  display: block;
  margin-top: -1px;
  border-top: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid #5bcdda;
  content: "";
  transition: all 0.3s;
  transform: translateY(-50%);
}

/* ==========================================================================
    Pager
========================================================================== */
.pager ul {
  display: table;
  width: 100%;
  padding: 10px 0;
  border-top: solid 1px #b6b8b7;
  border-bottom: solid 1px #b6b8b7;
  word-break: break-word;
}

.pagerPrev,
.pagerNext {
  float: left;
  width: 50%;
}

.pagerPrev {
  box-sizing: border-box;
  border-right: solid 1px #b6b8b7;
}

.pagerNext {
  margin-left: -1px;
  border-left: solid 1px #b6b8b7;
}

.pagerNext:first-child {
  margin-left: 50%;
  box-sizing: border-box;
}

.pagerPrev a,
.pagerNext a {
  display: block;
  padding: 0 10%;
}

.pagerPrev a {
  background: url(/img/ss/products/vision/visionbasics/bg_pager_prev.png) no-repeat left center;
}

.pagerNext a {
  background: url(/img/ss/products/vision/visionbasics/bg_pager_next.png) no-repeat right center;
}

.pagerPrev a:hover,
.pagerNext a:hover {
  background-color: #ecf9ff;
  text-decoration: none;
}

.pager dt {
  color: #0085c4;
  font-size: 113%;
  font-weight: bold;
}

.pager dd {
  font-size: 100%;
  display: block;
  padding-left: 10px;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow.png) no-repeat 0 .5em;
}

.pagerTop {
  float: left;
  width: 100%;
  margin: 10px 0 0;
  padding: 10px 0 0;
  border-top: solid 1px #b6b8b7;
  text-align: center;
}

.pagerTop a {
  display: inline-block;
  padding: 0 0 0 1.5em;
  background: url(/img/ss/products/vision/visionbasics/pager_icon_back.png) no-repeat left center;
}

/* ==========================================================================
    CV Area
========================================================================== */
.cvArea {
  padding: 4% 0;
  background: url(/img/ss/products/vision/visionbasics/bg_cvarea.jpg) no-repeat center center #85c0de;
  background-size: cover;
}

.cvArea .inner {
  display: -ms-flexbox;
  display: flex;
}

.cvAreaCatalog {
  display: -ms-flexbox;
  display: flex;
  width: 60%;
}

.cvAreaCatalog>p {
  display: none;
}

.cvAreaCatalogBox {
  display: none;
  flex: 0 1 auto;
}

.cvAreaCatalogBox a {
  display: block;
  -ms-flex: 0 1 auto;
  background: #fff;
  padding: 25px;
  font-family: helvetica, arial, san-serif;
  position: relative;
  transition: opacity 0.3s;
  box-sizing: border-box;
}

.cvAreaCatalogBox>a>.inner {
  display: table;
}

.cvAreaCatalogBox a:hover {
  text-decoration: none;
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.cvAreaCatalogBox a .ttl {
  margin-bottom: 10px;
  font-size: 150%;
  line-height: 1.2;
  color: #435b6b;
  display: block;
}

.cvAreaCatalogBox a .ttl .em {
  color: #cc1818;
  font-size: 100%;
}

.cvAreaCatalogBox a .inner::after {
  content: "";
  display: table;
  clear: both;
}

.cvAreaCatalogBox a .thumb {
  width: 23%;
  padding: 0;
  display: block;
  float: left;
}

.cvAreaCatalogBox a .thumb>img {
  border: 1px solid #ccc;
  max-width: 100%;
}

.cvAreaCatalogBox a .txt {
  width: 70%;
  font-size: 106.6%;
  color: #435b6b;
  float: right;
  margin-bottom: 60px;
}

.cvAreaCatalogBox a .dl_btn {
  display: block;
  position: absolute;
  bottom: 25px;
  right: 4.25%;
  box-sizing: border-box;

}

.cvAreaContact {
  display: -ms-flexbox;
  display: flex;
  width: 37%;
  margin-left: 3%;
}

.cvAreaContact>a {
  display: block;
  -ms-flex: 0 1 auto;
  position: relative;
  padding: 25px 25px 220px;
  background: #fff;
  box-sizing: border-box;
}

.cvAreaContact>a:hover {
  text-decoration: none;
}

.cvAreaContact>a .ttl {
  margin-bottom: 10px;
  font-size: 150%;
  line-height: 1.2;
  color: #435b6b;
  display: block;
}

.cvAreaContact>a .icon {
  position: absolute;
  left: 0;
  bottom: 105px;
  width: 100%;
  text-align: center;
}

.cvAreaContact>a .dl_btn {
  position: absolute;
  left: 0;
  bottom: 25px;
  width: 100%;
  text-align: center;
}

.cvBanner {
  margin: 30px auto 0;
  text-align: center;
}

.cvBanner.inner {
  display: table;
}

.cvBanner li {
  display: inline-block;
  margin: 0 1.6%;
}

.cvBanner figcaption {
  font-weight: bold;
  text-align: left;
}

.cvBanner.download_page {
  font-size: 0;
}

.cvBanner.download_page li {
  margin: 0 12px;
}

.cvBanner.download_page li:first-child {
  margin-left: 0;
}

.cvBanner.download_page li:last-child {
  margin-right: 0;
}

/* ==========================================================================
    Contact
========================================================================== */
.contactArea {
  position: relative;
  padding: 10px 0;
  border-bottom: 1px solid #acd3e1;
  background: #435b6b;
  text-align: center;
}

.contactArea .inner {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
}

.contactAreaTel.pcItem {
  display: block;
  margin: 0 2% 0 0;
  width: 50%;
  text-align: left;
  flex: 1;
}

.contactAreaBtn {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-left: -5px;
  width: 50%;
  flex: 1;
}

.contactAreaBtn li {
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 0 5px;
  width: 50%;
  flex: 1;
}

.contactAreaBtn li a {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 16px;
  color: #fff;
  font-weight: bold;
  position: relative;
  min-height: 47px;
  box-sizing: border-box;
  padding: 10px 26px 10px 45px;
  width: 100%;
}

.contactAreaBtn li a:hover,
.contactAreaBtn li a:focus {
  opacity: .7;
  text-decoration: none;
}

.contactAreaBtn li a.catalog {
  background: #e60012;
}

.contactAreaBtn li a.contact {
  background: #41a147;
}

.contactAreaBtn li a:before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  left: 14px;
  transform: translateY(-50%);
}

.contactAreaBtn li a.catalog:before {
  width: 18px;
  height: 24px;
  background: url(/img/ss/common/bg_icon_dl_001.png) no-repeat center;
  background-size: contain;
}

.contactAreaBtn li a.contact:before {
  width: 24px;
  height: 24px;
  background: url(/img/ss/common/bg_icon_contact_001.png) no-repeat center;
  background-size: contain;
}

.contactArea.isFixed {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
}

@media screen and (max-width: 640px) {
  .contactArea {
    padding: 0;
  }

  .contactArea .inner {
    display: block;
  }

  .contactAreaTel {
    display: block;
    margin: 0;
  }

  .contactAreaBtn {
    width: 100%;
    margin-left: 0;
  }

  .contactAreaBtn li {
    margin-left: 0;
  }

  .contactAreaBtn li a {
    font-size: 28px;
  }

}

/* ==========================================================================
    Page Top
========================================================================== */
.pageTop {
  position: absolute;
  top: -71px;
  right: -100px;
  cursor: pointer;
}

.pageTop:hover {
  opacity: .7;
}

/* ==========================================================================
    Footer
========================================================================== */
.footer {
  background: url(/img/ss/products/vision/visionbasics/bg_footer.jpg) no-repeat center top #e7f4fa;
}

/*  Footer - Navi
========================================================================== */
.footerNavWrap {
  display: table;
  padding: 30px 0;
}

.footerNav {
  float: left;
  width: 25%;
}

.footerNavHome {
  float: none;
  width: 100%;
}

.footerNavBasic {
  margin: 10px 0 20px;
}

.footerNavBasic dl {
  display: table;
  width: 100%;
  float: left;
}

.footerNav dl+dl {
  margin-top: 20px;
}

.footerNav dt,
.footerNavHome {
  margin: 0 0 5px;
  font-size: 94%;
  font-weight: bold;
}

.footerNav dd dt {
  font-weight: normal;
}

.footerNav dd {
  margin: 0 0 3px;
}

.footerNav dd a {
  display: block;
  padding: 0 .5em 0 1em;
  background: url(/img/ss/products/vision/visionbasics/bg_arrow.png) no-repeat .3em .5em;
  font-size: 88%;
}

/*  Footer - Copyright
========================================================================== */
.footerCopy {
  padding: 15px 0;
  background: #0085c3;
  color: #fff;
  font-size: 75%;
}

.footerCopy .inner {
  display: table;
}

.footerCopy p {
  float: left;
  width: 50%;
}

.footerCopy ul {
  float: right;
  width: 50%;
  text-align: right;
}

.footerCopy li {
  display: inline;
  margin: 0 0 0 10px;
}

.footerCopy li:first-child {
  margin: 0;
}

.footerCopy a {
  color: #fff;
}

/* ==========================================================================
    Common Layout - SP
========================================================================== */
@media screen and (max-width: 640px) {

  .breadcrumb,
  .fontSize {
    display: none;
  }

  .btnDownload {
    text-align: center;
  }

  .btnDownload a,
  .btnDownload a img {
    width: auto;
  }

  .contentsWrap {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 5% 2%;
  }

  .main {
    float: none;
    width: 100%;
  }

  .side {
    display: block;
    position: relative;
    float: none;
    width: 100%;
    max-width: 100%;
    position: relative;
    top: 0;
    left: 0;
    margin-left: 0;
  }

  .pager {
    margin-bottom: 40px;
  }

  .toppage .cvAreaCatalog {
    display: none;
  }

  .cvAreaCatalog {
    width: 100%;
    margin: 0 0 20px;
    justify-content: center;
  }

  .cvAreaCatalog img {
    width: 100%;
  }

  .cvAreaCatalogBox a {
    height: auto;
  }

  .cvAreaCatalogBox a .dl_btn img {
    max-width: 100%;
    height: auto;
  }

  .cvBanner {
    box-sizing: border-box;
    margin: 0;
    padding: 0 2%;
  }

  .cvBanner li {
    display: block;
    width: 100%;
    margin: 10px 0 0;
  }

  .cvBanner li:first-child {
    margin: 0;
  }

  .cvBanner li img {
    width: auto;
    max-width: 100%;
  }

  .footerNav {
    text-align: center;
  }

  .footerNav a {
    font-size: 75%;
  }

  .footerCopy {
    padding: 15px;
    text-align: center;
  }

  .footerCopy .inner {
    padding: 0;
  }

  .footerCopy p {
    float: none;
    width: 100%;
    font-size: 75%;
  }

  .footerCopy ul {
    float: none;
    width: 100%;
    text-align: center;
  }

  .footerCopy li {
    font-size: 75%;
  }

  .sideNavWrap {
    padding: 0;
    display: block;
  }

  .sideNavHead,
  .side button {
    background-position: 95% center;
    background-image: url(/img/ss/products/vision/visionbasics/side_nav_icon_on_sp.png);
  }

  .isClose .sideNavHead {
    background-position: 95% center;
    background-image: url(/img/ss/products/vision/visionbasics/side_nav_icon_off_sp.png);
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Toppage

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Main Image
========================================================================== */
.mainImgWrap {
  margin: 0 0 30px;
  background: url(/img/ss/products/vision/visionbasics/index_bg_main.jpg) no-repeat center top;
}

.mainImgWrap .inner {
  position: relative;
  color: #fff;
}

.mainImg {
  width: 560px;
  height: 344px;
}

.mainImgTitle {
  position: absolute;
  top: 19%;
  left: 4%;
  font-size: 40px;
}
@media screen and (min-width: 641px) and (max-width: 980px) {
  .mainImgWrap{
    background-size: cover;
  }
  .mainImg {
    width: 57.14vw;
    height: 35.1vw;
  }
  .mainImgTitle {
    font-size: 4.1vw;
  }
}

.mainImgBtn {
  position: absolute;
  width: 317px;
  top: 55%;
  left: 4%;
}

/*  Index Navi - Common
========================================================================== */
.ttlTopNav {
  padding: 25px;
  background: url(/img/ss/products/vision/visionbasics/bg_ttl_default.jpg) no-repeat right center #2C7FAB;
  background-size: auto 100%;
  color: #fff;
  font-size: 175%;
  font-weight: normal;
  line-height: 1;
  word-break: break-word;
}

.sttlTopNav {
  margin: 0 0 1em;
  font-size: 125%;
  font-weight: normal;
  line-height: 1;
}

.topNav {
  display: table;
  width: 100%;
  max-width: 980px;
  margin: 0 auto 30px;
}

.topNav.col2 {
  display: flex;
}

.topNav li {
  margin: 0 0 .5em;
}

.topNav a {
  display: block;
  padding: 0 0 0 22px;
  background: url(/img/ss/products/vision/visionbasics/index_icon_arrow.jpg) no-repeat left .3em;
  color: #0085c3;
  font-size: 94%;
}

.topNav.column {
  display: -ms-flexbox;
  display: flex;
}

.topNavBody {
  display: table;
  width: 100%;
  padding: 3% 4.5%;
  box-sizing: border-box;
  border-left: solid 1px #cee6ef;
  border-right: solid 1px #cee6ef;
  border-bottom: solid 1px #cee6ef;
  background: #fff;
}

.topContentsBody {
  padding: 30px;
  border-right: 1px solid #cee6ef;
  border-bottom: 1px solid #cee6ef;
  border-left: 1px solid #cee6ef;
}

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

.topFigureLinks>.item {
  flex: 1 1 auto;
  line-height: 1.333;
}

.topFigureLinks>.item>a {
  display: block;
  text-decoration: none;
}

.topFigureLinks>.item>a:hover {
  opacity: 0.7;
}

.topFigureLinks>.item>a:hover img {
  opacity: 1;
}

.topFigureLinks .thumb {
  margin: 0 0 10px;
  text-align: center;
}

.topFigureLinks .thumb img{
  height: auto;
}

.topFigureLinks .caption {
  color: #0085c3;
  font-size: 18px;
  word-break: break-word;
}

.topFigureLinks .desc {
  font-size: 15px;
}

@media screen and (max-width: 640px) {
  .topContentsBody {
    padding: 30px 20px;
  }

  .topFigureLinks {
    display: block;
  }

  .topFigureLinks figure {
    display: flex;
  }

  .topFigureLinks .thumb {
    flex: 0 0 auto;
    margin: 0;
    width: 45%;
  }
  .topFigureLinks figcaption {
    padding: 0 0 0 16px;
    width: 55%;
  }

  .topFigureLinks .caption {
    font-size: 4.6875vw;
  }

  .topFigureLinks .desc {
    font-size: 4.0625vw;
  }
}

/*  Index Navi - Basic
========================================================================== */
.navBasicItem {
  display: table-cell;
  width: 25%;
  box-sizing: border-box;
  padding: 0 2%;
  background: url(/img/ss/products/vision/visionbasics/bg_line.jpg) repeat-y right top;
}

.navBasicItem:first-child {
  padding-left: 0;
}

.navBasicItem:last-child {
  padding-right: 0;
  background: none;
}

/*  Index Navi - Use
========================================================================== */
.navUse ul {
  width: 100%;
  display: table;
  padding: 3%;
  box-sizing: border-box;
  border-left: solid 1px #cee6ef;
  border-right: solid 1px #cee6ef;
  border-bottom: solid 1px #cee6ef;
  background: #fff;
}

.navUse li {
  float: left;
  width: 25%;
}

.navUse li:nth-child(4n+1) {
  clear: left;
}

/*  Index Navi - Tips
========================================================================== */
.navTips,
.navMerit {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 49%;
}

.navTips .ttlTopNav,
.navMerit .ttlTopNav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.navTips .topNavBody,
.navMerit .topNavBody {
  display: block;
  -ms-flex-grow: 2;
  flex-grow: 2;
}

.navTips {
  margin: 0 2% 0 0;
}

.navTips .topNavBody,
.navMerit .topNavBody {
  padding: 6%;
}

/*  Index Navi - History
========================================================================== */
.navHistory {
  width: 100%;
  box-sizing: border-box;
  max-width: 980px;
  margin: 0 auto 30px;
  padding: 8px;
  background: url(/img/ss/products/vision/visionbasics/con06_bg_line.jpg) repeat left top;
}

.ttlHistory {
  padding: 2.5% 3%;
  border-bottom: 1px solid #cee6ef;
  background: #fff;
  color: #586e7c;
  font-size: 175%;
  font-weight: normal;
  text-align: left;
  line-height: 1;
}

.ttlHistory span {
  display: inline-block;
  box-sizing: border-box;
  padding: .3em .5em;
  margin: 0 20px 0 0;
  color: #fff;
  font-size: 78%;
  background: #586e7c;
  line-height: 1;
  border-radius: 3px;
}

.navHistory ul {
  display: table;
  width: 100%;
  box-sizing: border-box;
  padding: 2.5% 3%;
  background: #fff;
}

.navHistory li {
  display: table-cell;
  width: 20%;
}

.navHistory a {
  display: block;
  padding: 0 0 0 22px;
  background: url(/img/ss/products/vision/visionbasics/index_icon_arrow.jpg) no-repeat left .3em;
  color: #0085c3;
  font-size: 94%;
}

/*    Index Navi - Basic
========================================================================== */
.indexNavBasic section {
  display: table-cell;
  width: 19%;
  padding: 0 3%;
  background: url(/img/ss/products/vision/visionbasics/bg_line.jpg) repeat-y left top;
}

.indexNavBasic section:first-child {
  background: none;
}

/*    Index Navi - Use
========================================================================== */
.indexNavUse ul {
  display: table;
}

.indexNavUse li {
  float: left;
  width: 25%;
}

/*    Index Navi - Improve
========================================================================== */
.navImprove .topNavBody {
  position: relative;
}

.improveItem {
  position: relative;
  float: left;
  width: 30.1%;
  margin: 0 4.5% 2.5% 0;
  box-sizing: border-box;
  border: 1px solid #cee6ef;
  background: #e7f4fa;
}

.improveItem:nth-child(3n) {
  margin-right: 0;
}

.improveItem img {
  width: 100%;
}

.improveItem h3 {
  padding: 7% 5% 0;
  font-weight: normal;
  word-break: break-word;
  overflow-wrap: break-word;
}

.improveItem ul {
  display: table;
  width: 100%;
  box-sizing: border-box;
  padding: 5% 5% 10%;
  word-break: break-word;
}

.improveItem li {
  display: table-cell;
}

.improveItem a {
  display: block;
  padding: 0 0 0 22px;
  background: url(/img/ss/products/vision/visionbasics/index_icon_arrow.jpg) no-repeat left .25em;
  color: #0085c3;
  font-size: 94%;
}

.improveItemFilter {
  position: absolute;
  width: 100%;
  height: 50%;
  top: 50%;
  left: 0;
}

.improveItemDisable {
  border-color: #f0f8fa;
}

.improveItemDisable:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: block;
  background: #fff;
  opacity: .8;
}

.improveItemFilter p {
  position: relative;
  top: 50%;
  margin-top: -1em;
  font-size: 200%;
  font-weight: bold;
  text-align: center;
}

/*    Index Navi - Technologies
========================================================================== */
.topOurTechnologies .topContentsBody {
  padding: 10px 9px;
}

.topOurTechnologies .topFigureLinks {
  box-sizing: border-box;
}

.topOurTechnologies .topFigureLinks .item {
  flex-basis: 200px;
  margin: 20px;
}
@media screen and (max-width: 640px) {
  .topOurTechnologies .topFigureLinks .item {
    margin: 20px 0;
  }
}

/*    Index Navi - Platforms
========================================================================== */
.topOurPlatforms .topContentsBody {
  padding: 10px 0;
}

.topOurPlatforms .topFigureLinks {
  flex-wrap: nowrap;
}

.topOurPlatforms .topFigureLinks .item {
  flex-basis: 266px;
  margin: 20px 0;
  padding: 0 30px;
  border-left: 1px dotted #0085c3;
}

.topOurPlatforms .topFigureLinks .item:first-child {
  border-left: none;
}

@media screen and (max-width: 640px) {
  .topOurPlatforms .topFigureLinks .item {
    padding: 0 10px;
    border-left: none;
  }
}

/*    Index Navi - FAQ
========================================================================== */
.topFaqSection {
  margin: 30px auto;
}

.topFaqChapter {
  margin: 24px 0 0;
}

.topFaqChapter:first-child {
  margin-top: 0;
}

.topFaqHeader {
  position: relative;
  padding: 8px 40px 8px 14px;
  background-color: #2c7fab;
  background-repeat: no-repeat;
  color: #fff;
  font-size: 20px;
  font-weight: normal;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
}

.topFaqHeader:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 12px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  font-size: 0;
  transform: translate(0, -50%);
}

.topFaqHeader:after {
  content: "";
  position: absolute;
  right: 24px;
  width: 8px;
  height: 8px;
}

.topFaqHeader[data-label-status='show']:after {
  bottom: 50%;
  border-right: 2px solid #2c7fab;
  border-bottom: 2px solid #2c7fab;
  transform-origin: right bottom;
  transform: translate(0, 5px) scaleY(1.125) rotate(45deg);
}

.topFaqHeader[data-label-status='hide']:after {
  bottom: 50%;
  border-right: 2px solid #2c7fab;
  border-top: 2px solid #2c7fab;
  transform-origin: right top;
  transform: translate(0, 4px) scaleY(1.125) rotate(-45deg);
}

.topFaqBody {
  display: none;
  padding: 18px 14px 24px;
  border-right: 1px solid #cee6ef;
  border-bottom: 1px solid #cee6ef;
  border-left: 1px solid #cee6ef;
  font-size: 15px;
  line-height: 1.2;
}

.topFaqBody>*:first-child {
  margin-top: 0;
}

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

.topFaqBody p {
  margin: 18px 0;
}

.topFaqBody a {
  color: #0085c3;
}

@media screen and (max-width: 640px) {
  .topFaqHeader {
    padding: 16px 80px 16px 28px;
    ;
    font-size: 110%;
  }

  .topFaqHeader:before {
    right: 20px;
    width: 48px;
    height: 48px;
  }

  .topFaqHeader:after {
    right: 44px;
    width: 16px;
    height: 16px;
  }

  .topFaqHeader[data-label-status='show']:after {
    border-right: 4px solid #2c7fab;
    border-bottom: 4px solid #2c7fab;
    transform: translate(0, 10px) scaleY(1.125) rotate(45deg);
  }

  .topFaqHeader[data-label-status='hide']:after {
    border-right: 4px solid #2c7fab;
    border-top: 4px solid #2c7fab;
    transform: translate(0, 8px) scaleY(1.125) rotate(-45deg);
  }

  .topFaqBody {
    font-size: 100%;
  }
}

/*    Index Navi - Study
========================================================================== */
.topStudy {
  padding: 4% 0;
  background: #fff;
}

.topStudyHead {
  position: relative;
  color: #435a6c;
  font-size: 200%;
  font-weight: normal;
  text-align: center;
}

.topStudyHead::before {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  height: 5px;
  top: 50%;
  margin: -2px 0 0;
  background: #cfe5f0;
}

.topStudyHead span {
  display: inline-block;
  position: relative;
  padding: 0 1em;
  background: #fff;
}

.topStudyContent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: calc(100% - 240px);
  min-height: 112px;
  font-size: 94%;
  padding: 0 3%;
  box-sizing: border-box;
}

.topStudyBody {
  background: url(/img/ss/products/vision/visionbasics/con07_img01.jpg) no-repeat right 0;
}

.topStudyBody li {
  color: #ef6411;
  font-weight: bold;
}

.topStudyBtn {
  margin: 5% 0 0;
  text-align: center;
}

.topStudyBtn a {
  display: inline-block;
  padding: 1% 2%;
  background: #0084c4;
  color: #fff;
  font-size: 150%;
  font-weight: bold;
  border-radius: 3px;
  transition: background .2s ease-in-out;
}

.topStudyBtn a:hover {
  background: #4da9d6;
  text-decoration: none;
}

.topStudyBtn span {
  margin: 0 0 0 .5em;
  font-size: 130%;
  line-height: 1;
}

/* ==========================================================================
    Toppage - SP
========================================================================== */
@media screen and (max-width: 640px) {
  .mainImgWrap {
    margin: auto;
    background-size: auto 34.375vw;
  }

  .mainImgWrap .inner {
    padding: 0;
  }

  .mainImg {
    width: 100%;
    max-width: 100%;
    height: 0;
    padding: 0 0 34.375vw;
  }

  .mainImgInner {
    width: auto;
    height: 0;
    padding: 41.7% 0 0;
    background: url(/img/ss/products/vision/visionbasics/index_bg_main.jpg) no-repeat center top;
    background-size: auto 100%;
  }

  .mainImgTitle {
    top: 18.5%;
    left: 1%;
    font-size: 4.75vw;
  }

  .mainImgBtn.btnDownload {
    position: static;
    width: 100%;
    padding: 5% 0;
    text-align: center;
    margin: 0;
  }

  .topNav {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 auto 20px;
    padding: 0 2%;
  }

  .topNav.col2 {
    display: table;
  }

  .topNav.column {
    display: block;
  }

  .navBasicItem {
    display: block;
    width: 100%;
    padding: 1em 0;
    border-bottom: dotted 1px #0085c3;
    background: none;
  }

  .navBasicItem:last-child {
    border: 0;
  }

  .navBasicItem li:last-child {
    margin: 0;
  }

  .navUse li {
    width: 50%;
  }

  .navTips,
  .navMerit {
    float: none;
    width: 100%;
  }

  .navTips {
    margin: 0 0 20px;
  }

  .navTips .topNavBody,
  .navMerit .topNavBody {
    width: 100%;
    box-sizing: border-box;
    padding: 3%;
  }

  .navHistory {
    margin: 0 0 20px;
  }

  .navHistory li {
    display: inline-block;
    width: auto;
    margin: 0 1em 0 0;
  }

  .improveItem {
    width: 49%;
    margin: 0 2% 2% 0;
  }

  .improveItem:nth-child(even) {
    margin-right: 0;
  }

  .improveItem:nth-child(2n+1) {
    margin: 0 2% 2% 0;
  }

  .topStudyHead {
    line-height: 1.2;
  }

  .topStudyHead::before {
    display: none;
  }

  .topStudyHead span {
    padding: 0;
    font-size: 80%;
  }

  .topStudyBody {
    padding: 0;
    background: none;
  }

  .topStudyContent {
    display: block;
    width: auto;
    min-height: 0;
  }

  .topStudyBtn a {
    font-size: 100%;
    font-weight: normal;
  }

  .contactArea .inner {
    padding: 0;
  }

  .improveItem a {
    background-position: left .5em;
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Basic Beginner

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Constitution
========================================================================== */
.basicBeginner .constitution ol {
  counter-reset: number;
  display: table;
  margin: 20px 0;
}

.basicBeginner .constitution li {
  display: table;
  float: left;
  width: 49%;
  box-sizing: border-box;
  margin: 0 2% 2% 0;
  padding: 2%;
  border: solid 1px #ddd;
  list-style: none;
}

.basicBeginner .constitution li:nth-child(even) {
  margin-right: 0;
}

.basicBeginner .constitution li::before {
  counter-increment: number;
  content: counter(number);
  display: block;
  float: left;
  box-sizing: border-box;
  padding: 0 .5em;
  margin: 0 .5em 0 0;
  background: #0085c3;
  color: #fff;
  font-weight: bold;
}

.basicBeginner .constitution dt {
  display: inline-block;
  margin: 0 0 2%;
  font-weight: bold;
}

/* ==========================================================================
    Influence
========================================================================== */
/*  Influence - Question
========================================================================== */
.basicBeginner .influenceQuestion dt,
.basicBeginner .influenceQuestion dd {
  padding: 0 0 0 2.5em;
}

.basicBeginner .influenceQuestion dt::before,
.basicBeginner .influenceQuestion dd::before {
  display: inline-block;
  padding: 0 .5em;
  margin: 0 .5em 0 -2.5em;
  background: #0085c3;
  color: #fff;
}

.basicBeginner .influenceQuestion dt {
  margin: 0 0 10px;
}

.basicBeginner .influenceQuestion dt::before {
  content: 'Q';
}

.basicBeginner .influenceQuestion dd::before {
  content: 'A';
}

/*  Influence - Point
========================================================================== */
.basicBeginner .influencePoint ul {
  margin: 10px 0 0;
}

.basicBeginner .influencePoint li {
  display: inline-block;
  margin: 0 5px 0 0;
  padding: 0 .5em;
  background: #435b6b;
  color: #fff;
  font-size: 95%;
}

.basicBeginner .influencePoint li:last-child {
  margin-right: 0;
}

/* ==========================================================================
    Basic Beginner - SP
========================================================================== */
@media screen and (max-width: 640px) {
  .basicBeginner .constitution li {
    display: block;
    width: 100%;
    margin: 0 0 2%;
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Basic Illumination

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Outline
========================================================================== */
.basicIllumination .outline li {
  margin: 0 0 1em;
}

.basicIllumination .outline li:last-child {
  margin: 0;
}

.basicIllumination .outline dt {
  margin: 0 0 .5em;
  font-weight: bold;
}

.basicIllumination .outline dd {
  padding: 0 0 0 1em;
}

.basicIllumination .outline dd::before {
  content: '・';
  margin: 0 0 0 -1em;
}

/* ==========================================================================
    Step1
========================================================================== */
.basicIllumination .step1 ol.imgWrap li {
  position: relative;
  display: inline-block;
  width: 30%;
  padding: 2%;
  vertical-align: top;
}

.basicIllumination .step1 ol.imgWrap li:first-child::after {
  content: '';
  position: absolute;
  width: 28px;
  height: 24px;
  margin: -12px 0 0;
  top: 50%;
  right: 5%;
  background: url(/img/ss/products/vision/visionbasics/arrow_brown_01.gif) no-repeat center center;
}

.basicIllumination .step1 ol.imgWrap li:last-child {
  border: solid 1px #ab8b74;
}

.basicIllumination .step1 ol.imgWrap li span {
  display: block;
  margin: 10px 0 0;
  font-size: 75%;
}

/* ==========================================================================
    Step2
========================================================================== */
.basicIllumination .step2Img {
  display: table-cell;
  width: 40%;
  box-sizing: border-box;
  text-align: center;
  vertical-align: middle;
}

.basicIllumination .step2Img p {
  margin: 20px 0 0;
  padding: 0 10% 0 0;
  font-size: 75%;
  text-align: left;
}

.basicIllumination .step2List {
  display: table-cell;
  width: 60%;
  vertical-align: top;
}

/* ==========================================================================
    Step3
========================================================================== */
.basicIllumination .step3LedWrap {
  box-sizing: border-box;
  padding: 3%;
}

.basicIllumination .step3Led {
  display: table-cell;
  width: 60%;
  text-align: center;
}

.basicIllumination .step3Led li {
  display: inline-block;
  position: relative;
  width: 30%;
  box-sizing: border-box;
  padding: 1% 1% 1.5em;
  text-align: left;
  vertical-align: top;
}

.basicIllumination .step3Led li:nth-child(2) {
  color: #de1b21;
}

.basicIllumination .step3Led li:nth-child(3) {
  color: #0957a9;
  border: dotted 2px #3978ae;
}

.basicIllumination .step3Led dt {
  margin: 0 0 5px;
  font-size: 81.3%;
  font-weight: bold;
}

.basicIllumination .step3Led dd {
  font-size: 75%;
}

.basicIllumination .step3Led span {
  display: block;
  margin: 1em 0 0;
}

.basicIllumination .step3Led span:nth-child(2) {
  position: absolute;
  width: 80%;
  left: 10%;
  background: #fff;
  font-size: 121.4%;
  font-weight: bold;
  line-height: 1;
  text-align: center;
}

.basicIllumination .step3Led img {
  width: 100%;
}

.basicIllumination .step3Column {
  position: relative;
  display: table-cell;
  width: 40%;
  box-sizing: border-box;
  padding: 3%;
  border: solid 1px #714135;
  border-radius: 5px;
  color: #714135;
  font-size: 75%;
}

.basicIllumination .step3ColumnHead {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  padding: .2em .5em;
  background: #714135;
  color: #fff;
  font-weight: normal;
}

/* ==========================================================================
    Image
========================================================================== */
.basicIllumination .bgYellow {
  padding: 20px 0;
  background: #fff7e2;
}

.basicIllumination .bgYellow span {
  color: #ed0014;
}

/* ==========================================================================
    Basic Illumination - SP
========================================================================== */
@media screen and (max-width: 640px) {

  .basicIllumination .step3Led,
  .basicIllumination .step3Column {
    display: block;
    width: 100%;
  }

  .basicIllumination .step3Column {
    margin-top: 30px;
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Basic Middle

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Effect
========================================================================== */
.basicMiddle .goldlabel {
  padding: 2%;
  text-align: center;
}

.basicMiddle .goldlabel li {
  display: inline-block;
  width: 33.8%;
  max-width: 244px;
  text-align: left;
  vertical-align: top;
}

.basicMiddle .goldlabel li:last-child {
  width: 25.1%;
  max-width: 181px;
}

.basicMiddle .goldlabel .goldlabelTxt {
  display: block;
  width: 74.2%;
  margin: .5em 0 0;
  font-size: 75%;
}

.basicMiddle .goldlabel li:last-child .goldlabelTxt {
  width: 100%;
}

.basicMiddle .ccd figure {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-pack: center;
  justify-content: center;
}

.basicMiddle .ccd figcaption {
  -ms-flex-order: 1;
  order: 1;
}

/* //////////////////////////////////////////////////////////////////////////

    Basic Size

////////////////////////////////////////////////////////////////////////// */
.basicSize .section02TrendEdgeList dt::before {
  content: '・';
}

/* //////////////////////////////////////////////////////////////////////////

    Basic Position

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Process
========================================================================== */
.basicPosition .algorithmProcess {
  margin: 30px 0 0;
}

.basicPosition .algorithmProcess .ttlBold {
  padding: 0 0 0 6em;
}

.basicPosition .algorithmProcess .ttlBold span {
  position: relative;
  display: inline-block;
  padding: 0 .5em;
  margin: 0 .5em 0 -6em;
  color: #fff;
  background: #0085c3;
}

.basicPosition .shapeTraxSearch .col {
  width: 40%;
}

.basicPosition .shapeTraxSearch .col:last-child {
  width: 59%;
}

/*  Quiz
========================================================================== */
.ttlQuestion {
  margin: 0 0 1em;
  font-size: 100%;
  font-weight: 600;
}

.ttlQuestion span {
  color: #0085c4;
  margin: 0 2em 0 0;
}

.listQuestion {
  display: table;
  margin: 1em 0;
  list-style: upper-latin inside;
}

.listQuestion li {
  float: left;
  margin: 0 20px 0 0;
  font-weight: bold;
}

.listQuestion span {
  font-weight: normal;
}

button.btnAnswer {
  width: 100%;
  background-color: transparent;
  border: none;
  padding: 0;
  font-size: 100%;
  appearance: none;
  position: relative;
  padding: 0 0 .5em 1em;
  border-bottom: dotted 1px #b6b8b7;
  cursor: pointer;
  text-align: left;
}

.btnAnswer::before {
  display: block;
  content: "";
  position: absolute;
  top: .5em;
  left: 0;
  width: 6px;
  height: 6px;
  border-top: solid 2px #0085c4;
  border-right: solid 2px #0085c4;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
  border: none\9;
  width: 10px\9;
  height: 10px\9;
  background: url(/img/ss/products/vision/visionbasics/bg_ancIE.png) no-repeat center center\9;
}

.boxAnswer {
  display: none;
  box-sizing: border-box;
  padding: 20px 0 20px 40px;
  border-bottom: solid 1px #b6b8b7;
}

.boxAnswerWrap {
  height: 0;
  overflow: hidden;
  transition: height .3s ease;
}

.answerOption {
  font-size: 140%;
}

/*  Quiz
========================================================================== */
.listPrimerSummary {
  counter-reset: number;

  padding: 0 0 0 5em;
}

.listPrimerSummary li::before {
  display: inline-block;
  counter-increment: number;
  content: '【手順'counter(number)'】';
  margin: 0 0 0 -5em;
}

.tipsPrimer1 .boxSummary table {
  font-size: 70%;
  background: #fff;
}

.sensorCheckList {
  counter-reset: number;
  display: table;
  width: 100%;
  list-style: none;
}

.sensorCheckList li {
  float: left;
  width: 49%;
  box-sizing: border-box;
  margin: 0 2% 2% 0;
  padding: 2%;
  border: solid 1px #dedede;
}

.sensorCheckList li:nth-child(even) {
  margin: 0 0 2%;
}

.sensorCheckList li::before {
  counter-increment: number;
  content: counter(number);
  float: left;
  padding: 0 .5em;
  margin: 0 .5em 0 0;
  background: #0085c3;
  color: #fff;
  font-weight: bold;
}

.sensorCheckList dt {
  margin: 0 0 .5em;
  font-weight: bold;
}

.sensorCheckList li>dl>dd:last-child {
  box-sizing: border-box;
  margin: .5em 0 0;
  padding: 3%;
  background: #e7f4fa;
}


/* //////////////////////////////////////////////////////////////////////////

    Merit

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Calculator
========================================================================== */
.calculator table {
  width: 90%;
  margin: 0 auto;
}

.calculator th {
  width: 50%;
  padding: 5px 0;
  color: #0085c3;
  font-weight: bold;
  text-align: left;
}

.calculator input {
  margin-right: 10px;
}

.calculator input[type=button] {
  margin-top: 18px;
  width: 100%;
  font-size: 113%;
  font-weight: bolder;
  background-color: #0085c3;
  color: #fff;
  border: none;
  border-radius: 5px;
  line-height: 2.5;
}

.calculator td {
  font-weight: bold;
}

.calculator .boxBlue {
  margin: 20px 0 0;
  color: #393939;
  font-weight: bold;
  text-align: center;
}

.calculator .boxBlue span {
  font-size: 190%;
  color: #0085c3;
  margin-right: 2%;
  word-break: break-all;
  word-wrap: break-word;
}

.boxCalError {
  margin: 20px 0 0;
  padding: 2%;
  background: #f7d1d1;
  color: #cc1313;
  font-weight: bold;
}

.basicPrimer .image256Grad {
  width: 100%;
  border-collapse: separate;
  border-spacing: 10px 0;
  margin: 0 -10px;
}

.basicPrimer .table {
  width: 100%;
}

.basicPrimer .caption {
  display: table-cell;
  box-sizing: border-box;
  padding: .5em 1em;
  background: #333;
  color: #fff;
  font-size: 75%;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}



/* //////////////////////////////////////////////////////////////////////////

    History

////////////////////////////////////////////////////////////////////////// */
/* ==========================================================================
    Traceability
========================================================================== */
.historyTraceability .structure .border {
  display: table;
  width: 100%;
  padding: 3%;
}

.historyTraceability .structureItem {
  float: left;
  width: 25%;
  margin: 0 2.5% 0 0;
  padding: 0 10% 0 0;
  background: url(/img/ss/products/vision/visionbasics/traceability_img01.gif) no-repeat right top;
  background-size: 25% auto;
  box-sizing: content-box;
}

.historyTraceability .structureItem:last-child {
  padding: 0;
  margin: 0;
  background: none;
}

.historyTraceability .structureItem h4 {
  padding: 1em 0;
  background: #7d3a06;
  color: #fff;
  font-size: 112.5%;
  text-align: center;
}

.historyTraceability .structureItem div {
  display: table;
  width: 100%;
  box-sizing: border-box;
  margin: 1em 0 .7em;
  padding: .5em;
  border: solid 1px #7d3a06;
  color: #7d3a06;
  font-weight: bold;
  text-align: center;
  line-height: 1.2;
}

.historyTraceability .structureItem p {
  display: table-cell;
  width: 100%;
  vertical-align: middle;
}

.historyTraceability .structureItem p span {
  font-weight: normal;
}

.historyTraceability .structureItem li {
  border: solid 1px #7d3a06;
  margin: -1px 0 0;
  color: #7d3a06;
  font-size: 81.3%;
  text-indent: .5em;
}

.historyTraceability .structureItem table {
  width: 100%;
  border: solid 1px #7d3a06;
  color: #7d3a06;
}

.historyTraceability .structureItem td {
  border: solid 1px #7d3a06;
  font-size: 81.3%;
  text-indent: .5em;
}

@media screen and (max-width: 640px) {
  .historyTraceability .structureItem {
    float: none;
    width: 100%;
    padding: 0 0 12.5%;
    margin: 0 0 2.5%;
    background: url(/img/ss/products/vision/visionbasics/traceability_img01_sp.gif) no-repeat center bottom;
    background-size: 10% auto;
  }
}

/* //////////////////////////////////////////////////////////////////////////

    Spreq Download

////////////////////////////////////////////////////////////////////////// */
.spreqDownloadColWrap {
  display: table;
}

.spreqDownloadColWrap>li {
  float: left;
  width: 32%;
  margin: 0 2% 2% 0;
  padding: 20px;
  border: solid 1px #ddd;
  text-align: center;
  box-sizing: border-box;
}

.spreqDownloadColWrap>li.spreqDownloadCol1 {
  width: 100%;
}

.spreqDownloadColWrap>li:nth-child(3n+1) {
  margin-right: 0;
}

.spreqDownloadColWrap>li>p img {
  border: solid 1px #ccc;
}

.spreqDownloadColWrap>li dt a {
  color: #0094d3;
  font-size: 120%;
  font-weight: bold;
}

.spreqDownloadColWrap>li dt {
  margin: 20px 0 10px;
}

.spreqDownloadColWrap>li dd+dd {
  margin: 10px 0 0;
}

.spreqDownloadColWrap>li.spreqDownloadCol1 p {
  display: table-cell;
  width: 30%;
  vertical-align: top;
}

.spreqDownloadColWrap>li.spreqDownloadCol1 dl {
  display: table-cell;
  width: 70%;
  text-align: left;
  vertical-align: top;
}

@media screen and (max-width: 640px) {
  .spreqDownloadColWrap>li {
    width: 100%;
  }

  .spreqDownloadColWrap>li.spreqDownloadCol1 p {
    display: block;
    width: 100%;
  }

  .spreqDownloadColWrap>li.spreqDownloadCol1 dl {
    display: block;
    width: 100%;
    text-align: center;
  }

  .spreqDownloadColWrap>li.spreqDownloadCol1 dd {
    font-size: 80%;
  }
}

/* パフォーマンス改善調整用 */
#header {
  border-top: solid 5px #2f4554;
  background: #fff;
}

#cv_contact #pagetop a{
  background: #435b6b;
}
#cv_contact #pagetop a::after{
  background: #435b6b;
}

.calculation_value {
  display: none;
}

#footer .copy ul {
  flex-shrink: 0;
}