/* --------------------
  base
-------------------- */
.pcOnly {
  display: block;
}
.spOnly {
  display: none;
}


/* --------------------
  contents
-------------------- */
#sv-fmvdatacloud_howto {
  font-size: 16px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  text-align: left;
  color: #333;
}
#sv-fmvdatacloud_howto .bodyarea {
  background: #f0f5f5;
  padding: 0 0 90px;
}
#sv-fmvdatacloud_howto img {
  max-width: 100%;
  vertical-align: bottom;
}
#sv-fmvdatacloud_howto a:link, #sv-fmvdatacloud_howto a:visited {
  color: #003490;
  text-decoration: underline;
}
#sv-fmvdatacloud_howto a:hover, #sv-fmvdatacloud_howto a:active {
  color: #003490;
  text-decoration: none;
}
#sv-fmvdatacloud_howto .anno {
  text-indent: -1em;
  padding-left: 1em;
}
/* --------------------
  fv
-------------------- */
#sv-fmvdatacloud_howto #fv {
  text-align: center;
}
#sv-fmvdatacloud_howto #fv h1 {
  background: #13a6dd;
  color: #fff;
  font-size: 3.2rem;
  font-weight: bold;
  line-height: 1.3;
  padding: 20px;
}
#sv-fmvdatacloud_howto #fv .anno {
  font-size: 1.6rem;
  margin: 30px auto;
}


/* --------------------
  acbox
-------------------- */
#sv-fmvdatacloud_howto .acbox {
  width: auto;
  /*font-size:0px;*/ /* ラベルと開く部分を分離する時は数値を入れる */
  margin: 0 auto 10px; /* ボックス全体の位置調整 */
  max-width: 1080px;
}
#sv-fmvdatacloud_howto .acbox label {
  width: auto;
  font-size: 2.6rem; /* ラベルの文字サイズ */
  font-weight: bold;
  text-align: left;
  background: #1a2f5e; /* ラベルの背景色 */
  position: relative;
  display: block;
  padding: 0;
  border-radius: 5px; /* ラベルの角の丸み */
  cursor: pointer;
  color: #fff;
}
#sv-fmvdatacloud_howto .acbox label:hover {
  opacity: 0.7;
}
#sv-fmvdatacloud_howto .acbox input {
  display: none;
}
#sv-fmvdatacloud_howto .acbox label:after {
  color: #fff;
  content: ""; /* ラベルのアイコン */
  position: absolute;
  top: 0;
  right: 0;
  background: #101f40 url("../images/ico_open.png") no-repeat center;
  width: 68px;
  height: 100%;
  border-radius: 0 5px 5px 0;
  border-left: 3px solid #2a4278;
}
#sv-fmvdatacloud_howto .acbox input:checked ~ label::after {
  content: ""; /* ラベルをクリックした後のアイコン */
  background: #101f40 url("../images/ico_close.png") no-repeat center;
  border-radius: 0 5px 0 0;
}
#sv-fmvdatacloud_howto .acbox label h2 {
  width: 100%;
  font-size: 2.6rem;
  font-weight: bold;
  display: inline-block;
  padding: 17px 100px 14px 50px;
}
#sv-fmvdatacloud_howto .acbox div {
  height: 0px;
  overflow: hidden;
  opacity: 0;
  transition: 0.15s; /* 開閉スピードの設定 */
}
#sv-fmvdatacloud_howto .acbox input:checked ~ div {
  height: auto;
  padding: 40px 50px; /* 開いた部分の枠内の余白 */
  border-radius: 0 0 5px 5px;
  background: rgba(255, 255, 255, 0.7); /* 開いた部分の背景色 */
  opacity: 1;
}
#sv-fmvdatacloud_howto .acbox input:checked ~ label {
  background: #1a2f5e; /* クリック後のラベルの背景色 */
  border-radius: 5px 5px 0 0;
}
#sv-fmvdatacloud_howto .acbox-under {
  font-size: 1.8rem; /* 開いた部分の文字サイズ */
  color: #333; /* 開いた部分の文字色 */
}
#sv-fmvdatacloud_howto .acbox-under dt {
  border-top: 2px dashed #999;
  padding-top: 40px;
  margin: 40px auto 30px;
}
#sv-fmvdatacloud_howto .acbox-under dt:first-of-type {
  border-top: none;
  padding-top: 0;
  margin: 0 auto 30px;
}
#sv-fmvdatacloud_howto .acbox-under dd {
  text-align: center;
  margin: 20px auto;
}
#sv-fmvdatacloud_howto .acbox-under dt p {
  text-indent: -1.35em;
  padding-left: 1.35em;
}

/*---- clearfix ----*/
.clearfix {
  display: block;
  content: "";
  clear: both;
}

/*スクロール
------------------------------*/
.scrolltop {
  position: fixed;
  right: 15px;
  bottom: 264px;
  display: none;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  z-index: 9999;
}
.scrolltop img {
  width: 68px;
  height: auto;
  vertical-align: bottom;
}

/* ヘッダーフッター非表示(HTML記述)→トップに戻るボタンのみ表示 */
.footer {
  display: block !important;
  margin-top: 0;
  width: 100%;
}
.footer_bgInner {
  display: none;
}
.footer_bottom {
  display: none;
}


/*--- 768px------------------------------------------------------*/
@media screen and (max-width: 768px) {
  /* --------------------
  base
-------------------- */
  .pcOnly {
    display: none;
  }
  .spOnly {
    display: inline-block;
  }
  /* --------------------
  contents
-------------------- */
  #sv-fmvdatacloud_howto .bodyarea {
    padding: 0 0 2em;
  }
  /* --------------------
  fv
-------------------- */
  #sv-fmvdatacloud_howto #fv h1 {
    font-size: 2.6rem;
    padding: 0.5em;
  }
  #sv-fmvdatacloud_howto #fv .anno {
    font-size: 1.4rem;
    margin: 1em auto;
  }
  /* --------------------
  acbox
-------------------- */
  #sv-fmvdatacloud_howto .acbox {
    margin: 0 1em 1em;
  }
  #sv-fmvdatacloud_howto .acbox label {
    font-size: 2.4rem;
  }
  #sv-fmvdatacloud_howto .acbox label:after {
    top: inherit;
    bottom: 0;
    width: 100%;
    height: 1.25em;
    border-radius: 0 0 5px 5px;
    border-top: 3px solid #2a4278;
    border-left: none;
    display: block;
  }
  #sv-fmvdatacloud_howto .acbox input:checked ~ label::after {
    border-radius: 0 0 0 0;
  }
  #sv-fmvdatacloud_howto .acbox label h2 {
    font-size: 2.2rem;
    padding: 0.5em 0.5em 1.75em 2.35em;
    text-indent: -1.35em;
  }
  #sv-fmvdatacloud_howto .acbox input:checked ~ div {
    padding: 1.5em 1em 1em;
  }
  #sv-fmvdatacloud_howto .acbox input:checked ~ label {
    border-radius: 5px 5px 0 0;
  }
  #sv-fmvdatacloud_howto .acbox-under {
    font-size: 1.6rem;
  }
  #sv-fmvdatacloud_howto .acbox-under dt {
    padding-top: 1.5em;
    margin: 2em auto 1em;
  }
  #sv-fmvdatacloud_howto .acbox-under dt:first-of-type {
    padding-top: 0;
    margin: 0 auto 1em;
  }
  #sv-fmvdatacloud_howto .acbox-under dd {
    margin: 1em auto;
  }
}