@charset "UTF-8";

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

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

body { line-height: 1 }

ol, ul { list-style: none }

blockquote, q { quotes: none }

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

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

html {
  color: #5a5a5a;
  overflow-y: scroll
}

body {
  font-size: 16px;
  font-family: "Roboto", sans-serif;
  line-height: 1.5;
  background-color:#f7f7f7
  margin: 0;
  overflow: hidden;
  padding: 0;
  letter-spacing: 1.2px;
  -webkit-text-size-adjust: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -ms-box-sizing: border-box
}
@media only screen and (min-width:961px) {

body { min-width: 1060px }
}

img { vertical-align: bottom }

a {
  overflow: hidden;
  outline: 0;
  text-decoration: none
}

a img, img { border: 0 }

a img { background: 0 0 }
@media only screen and (max-width:600px) {

img.resp {
  width: 100%;
  height: auto
}
}

.clearfix { zoom: 1 }

.clearfix:after {
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
  line-height: 0;
  content: "."
}

.mb80 { margin-bottom: 80px }

.mb75 { margin-bottom: 75px }

.mb70 { margin-bottom: 70px }

.mb65 { margin-bottom: 65px }

.mb60 { margin-bottom: 60px }

.mb55 { margin-bottom: 55px }

.mb50 { margin-bottom: 50px }

.mb45 { margin-bottom: 45px }

.mb40 { margin-bottom: 40px }

.mb35 { margin-bottom: 35px }

.mb30 { margin-bottom: 30px }

.mb25 { margin-bottom: 25px }

.mb20 { margin-bottom: 20px }

.mb15 { margin-bottom: 15px }

.mb10 { margin-bottom: 10px }

.mb5 { margin-bottom: 5px }

.mr0 { margin-right: 0 }

.fl_l { float: left }

.fl_r { float: right }

.cl_both { clear: both }

.fw_b { font-weight: 700 }

.ta_r { text-align: right }

.ta_c { text-align: center }

.ta_l { text-align: left }

.f_min { font-family: "ヒラギノ明朝 ProN W6", HiraMinProN-W6, "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif }

.fs20 { font-size: 20px }

.fs19 { font-size: 19px }

.fs18 { font-size: 18px }

.fs17 { font-size: 17px }

.fs16 { font-size: 16px }

.fs15 { font-size: 15px }

.fs14 { font-size: 14px }

.fs13 { font-size: 13px }

.fs12 { font-size: 12px }

.fs11 { font-size: 11px }

.header {
  background: #d0d0d0;
  padding: 30px;
  margin-bottom: 40px
}

.footer {
  background: #d0d0d0;
  padding: 30px
}

#wrapper {
  overflow: hidden;
  font-size: 16px
}

#container { padding: 0 15px 50px 15px }
@media only screen and (min-width:961px) {

#container {
  width: 1060px;
  margin: 0 auto
}
}

.mainTit {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
  position: relative;
  padding-bottom: 10px;
  line-height: 1.3
}

.mainTit:before {
  width: 100%;
  height: 2px;
  background: #5a5a5a;
  position: absolute;
  left: 0;
  bottom: 0;
  content: ''
}

.mainCaption { margin-bottom: 80px }

.mainCaption_tit {
  font-weight: 700;
  font-size: 24px;
  margin-bottom: 15px
}

.main .block { margin-bottom: 100px }

.main .blockTit {
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 10px;
  line-height: 1.2;
  padding-left: 20px;
  position: relative
}

.main .blockTit:before {
  position: absolute;
  left: 0;
  top: 4px;
  content: '';
  background: #5a5a5a;
  width: 12px;
  height: 12px
}

.main .blockCaption {
  font-size: 14px;
  margin-bottom: 20px
}

.main .js-slideIn {
  transition: all .4s linear;
  -webkit-transition: all .4s linear;
  -moz-transition: all .4s linear;
  -o-transition: all .4s linear;
  -ms-transition: all .4s linear;
  -ms-filter: "alpha(opacity=0)";
  opacity: 0;
  transform: translate(0, 60px);
  -webkit-transform: translate(0, 60px);
  -moz-transform: translate(0, 60px);
  -o-transform: translate(0, 60px);
  -ms-transform: translate(0, 60px)
}

.main .js-slideIn.slideIn {
  transform: translate(0, 0);
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -ms-filter: "alpha(opacity=100)";
  opacity: 1
}

.main .js-fadeIn {
  -ms-filter: "alpha(opacity=0)";
  opacity: 0;
  transition: all .9s linear;
  -webkit-transition: all .9s linear;
  -moz-transition: all .9s linear;
  -o-transition: all .9s linear;
  -ms-transition: all .9s linear
}

.main .js-fadeIn.fadeIn {
  -ms-filter: "alpha(opacity=100)";
  opacity: 1
}

.main .js-fadeOut {
  transition: all .8s linear;
  -webkit-transition: all .8s linear;
  -moz-transition: all .8s linear;
  -o-transition: all .8s linear;
  -ms-transition: all .8s linear
}

.main .js-fadeOut.fadeOut {
  -ms-filter: "alpha(opacity=0)";
  opacity: 0
}