@charset "UTF-8";

html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font-weight: inherit;
  vertical-align: baseline
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block
}

ol, ul {
  list-style: none
}

blockquote, q {
  quotes: none
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none
}

table {
  border-collapse: collapse;
  border-spacing: 0
}

button {
  padding: 0;
  border: 0;
  background: none
}

button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0
}

a img {
  border: 0
}

#wrapper, .container, .container__inner, .s1-hdg-lv2__element, .s1-tbl--default th, .s1-tbl--stripe th, .s1-tbl--default td, .s1-tbl--stripe td, .s1-tbl--detail tr, .s1-tbl--detail .caution-list.is-type--number, .s1-tbl--detail .caution-list.is-type--number li, .s1-box, .s1-label {
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box
}

.s1-lp-header__inner:after, .s1-lp-header-right:after, .s1-lp-header-ichiba:after, .s1-lp-header-account:after, .s1-footer #wrapper-liner:after {
  content: "";
  display: block;
  font-size: 0;
  line-height: 0;
  clear: both
}

/*!
* Default Styles
*/
body, html {
  font-size: 62.5%
}

body {
  margin: 0;
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, MS-PGothic, sans-serif;
  color: #333;
  background-color: #fff;
  min-width: auto;
  line-height: 1.6
}

button, input, textarea {
  font-family: "Hiragino Kaku Gothic ProN", Meiryo, MS-PGothic, sans-serif;
  font-size: 62.5%;
  line-height: 1.6
}

a {
  text-decoration: none
}

a:link, a:visited, a:hover, a:active {
  color: transparent
}

a:hover {
  text-decoration: underline
}

b {
  font-weight: bold
}

sup {
  vertical-align: .5em
}

input.s-input-text, textarea.s-textarea {
  padding: 5px;
  background: #f0f0f0;
  border-top: 1px solid #9c9c9c;
  border-left: 1px solid #9c9c9c;
  border-right: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0
}

::-webkit-input-placeholder {
  color: #999
}

::-moz-placeholder {
  color: #999
}

:-ms-input-placeholder {
  color: #999
}

.placeholdersjs {
  color: #999
}

.s-analysis-tools {
  overflow: hidden;
  height: 0
}

table {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd;
  background-color: #fff
}

table+table {
  margin-top: 20px
}

th, td {
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding: 5px
}

thead th {
  background-color: #3f4da2;
  color: #fff
}

tbody th {
  background-color: #e9ebf7
}

/*============================
general
============================*/
#wrapper img {
  width: 100%;
  margin: 0 auto;
  line-height: 0;
  vertical-align: bottom;
  display: block;
}

.inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 20px;
}

.inner div,
.rel_box {
  position: relative;
  box-sizing: border-box;
}

#wrapper {
  font-family: YakuHanJP, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "メイリオ", Meiryo, "Meiryo UI", Avenir, "Open Sans", Helvetica, "Helvetica Neue", Arial, Verdana, Roboto, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#wrapper a {
  transition: all 0.3s ease 0s;
  opacity: 1;
}

#wrapper a:hover {
  opacity: 0.8;
}

#wrapper {
  width: 100%;
  overflow-x: hidden;
}

/*============================
contents
============================*/
.pce {
  display: block !important;
}

.spe {
  display: none !important;
}

#wrapper .flex_wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#wrapper a,
#wrapper a img {
  opacity: 1;
  transition: all ease 0.3s;
}

#wrapper a:hover,
#wrapper a img:hover {
  opacity: 0.8;
}

#wrapper a,
#wrapper a:visited {
  text-decoration: none;
}

/* bg_color */

#wrapper .box_gray {
  background-color: #f0f0f0;
}

/* general */
#wrapper * {
  box-sizing: border-box;
}

#wrapper section {
  position: relative;
}

#wrapper .fv .inner {
  position: relative;
}

#wrapper .logo {
  width: min(calc(92/1120*100%), 92px);
  position: absolute;
  top: 3%;
  left: 2%;
}

@media (min-width: 1200px) {
  #wrapper .logo {
    width: min(calc(92/1120*100%), 92px);
    position: absolute;
    top: 3%;
    left: -3.5%;
  }
}

#wrapper .cv {
  background: #96b5c7;
}

#wrapper .cv_btn {
  width: calc(612/1120*100%);
  position: absolute;
  top: 71%;
  left: 50%;
  transform: translateX(-50%);
}

#wrapper .intro .intro_bg {
  background: transparent url(../img/intro_bg.jpg) no-repeat top center / cover;
}

@media (min-width: 1920px) {
  #wrapper .intro .intro_bg {
    background-size: contain;
  }
}

#wrapper .intro .bg_blue {
  background: #fbfcff;
}

#wrapper .actually .actually_bg {
  background: transparent url(../img/actually_bg.jpg) no-repeat top center / cover;
}

@media (min-width: 1920px) {
  #wrapper .actually .actually_bg {
    background-size: contain;
  }
}

#wrapper .point .point_bg {
  background: transparent url(../img/point_bg.jpg) no-repeat top center / cover;
}

@media (min-width: 1920px) {
  #wrapper .point .point_bg {
    background-size: contain;
  }
}

#wrapper .point .point02_02 {
  width: min(calc(1141/1120*100%), 1141px);
  margin: 62px 0 min(calc(40/1120*100%), 40px);
}

#wrapper .slogan .bg_water {
  background: #f7fbfc;
}

#wrapper .slogan .slogan_bg {
  background: transparent url(../img/slogan_bg.jpg) no-repeat top center / cover;
}

@media (min-width: 1920px) {
  #wrapper .slogan .slogan_bg {
    background-size: contain;
  }
}

#wrapper .component {
  padding: min(10%, 100px) 0 min(10%, 100px);
}

#wrapper dl.accordion dt {
  position: relative;
  cursor: pointer;
}

#wrapper dl.accordion dt::before {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.7%;
  z-index: 1000;
  width: 1.5%;
  max-width: 1.5%;
  height: 2px;
  max-height: 2px;
  margin: auto 0;
  background: #555555;
  content: '';
}

#wrapper dl.accordion dt::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.7%;
  z-index: 1000;
  width: 1.5%;
  max-width: 1.5%;
  height: 2px;
  max-height: 2px;
  margin: auto 0;
  background: #555555;
  transform: rotate(-90deg);
  transition: all 0.3s ease 0s;
  content: '';
}

#wrapper dl.accordion dt.selected:after {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

#wrapper dl.accordion dd {
  display: none;
}

/*============================
SP
============================*/

@media screen and (max-width:750px) {
  /*============================
  contents
  ============================*/

  .pce {
    display: none !important;
  }

  .spe {
    display: block !important;
  }

  .inner {
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
  }

  #wrapper .logo {
    width: calc(116/750*100%);
    top: 3%;
    left: 4%;
  }

  #wrapper .cv_btn {
    width: calc(690/750*100%);
    top: 83.7%;
    left: 50%;
  }

  #wrapper .point .point02_02 {
    width: 100%;
    margin: 0;
  }

  #wrapper dl.accordion dt {
    width: calc(690/750*100%);
    margin: 0 auto;
  }

  #wrapper .component {
    padding: 8% 0;
  }

  #wrapper dl.accordion dt::before {
    right: 4.2%;
    width: 2.5%;
    max-width: 2.5%;
    height: 2px;
    max-height: 2px;
  }

  #wrapper dl.accordion dt::after {
    right: 4.2%;
    width: 2.5%;
    max-width: 2.5%;
    height: 2px;
    max-height: 2px;
  }
}