@charset "UTF-8";
/* ===================================================================
CSS Document
file name  :common.css <- common.scss
style info :reset / utility / common Style
=================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;600&display=swap');
/*---------------------------------------------
Browser Default Initialization
---------------------------------------------*/
html {
  overflow-y: scroll;
}
body, div, dl, dt, dd {
  margin: 0;
  padding: 0;
  line-height: 1.7;
}
ul {
  margin: 0;
  padding: 0;
  line-height: 1.7;
}
ul li {
  margin: 0;
  padding: 0;
  line-height: 1.7;
}
h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, section, nav, article, aside, hgroup, header, address, figure, figcaption {
  margin: 0;
  padding: 0;
  line-height: 1.7;
}
address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
caption, th {
  text-align: left;
}
q:before, q:after {
  content: '';
}
object, embed {
  vertical-align: top;
}
hr, legend {
  display: none;
}
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}
img, abbr, acronym, fieldset {
  border: 0;
}
img {
  vertical-align: top;
  -ms-interpolation-mode: bicubic;
}
ul li {
  list-style-type: none;
}
a, button, input, textarea {
  outline: none;
}
/** fade使用時のズレ対策（FF）**/
img {
  box-shadow: #000 0 0 0;
}
x:-moz-any-link, x:default {
 box-shadow: #000 0 0 0;
}
a {
  color: #171F6C;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
/*---------------------------------------------
FontSize Initialization
---------------------------------------------*/
html {
  font: 62.5%/1.231 Noto Sans JP, メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
body {
  font-size: 1.0rem;
  letter-spacing: -0.001em;
  -webkit-text-size-adjust: 100%;
}
select, input, button, textarea, table {
  font: 1.0rem Noto Sans JP, メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}
pre, code, kbd, samp, tt {
  font-family: Noto Sans JP, メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  line-height: 1;
}
/*---------------------------------------------
Utility
---------------------------------------------*/
/* Clearfix */
.cf:after, .sec:after, .section:after {
  visibility: hidden;
  display: block;
  content: " ";
  clear: both;
  height: 0;
}
#wrap * {
  box-sizing: border-box;
}
.serif {
  font-family: "Noto Serif JP", 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
}
#wrap {
  font-size: 1.6rem;
  min-width: 1000px;
  margin: 0 auto;
  text-align: center;
}
img {
  line-height: 0;
}
a:hover {
  opacity: .7;
  transition: .5s ease;
}
/*--------------------------
Contents
---------------------------*/
.wrap {
  text-align: center;
  margin: 0 auto;
}
.content {
  background: url(../img/bg.jpg)no-repeat center top /1500px 100%;
  max-width: 1500px;
  margin: 0 auto;
  padding-bottom: 1px;
}
.detail {
  position: relative;
  width: 1000px;
  margin: 0 auto;
}
.table {
  text-align: left;
  margin: 0 auto 30px;
}
.table .ttl {
  font-size: 22px;
  font-weight: 600;
  color: #221815;
  margin: 28px 0 18px;
  line-height: 1.4;
  letter-spacing: 0.4px;
}
.table .txt {
  color: #3d3e40;
  font-size: 17px;
  margin: 0 0 32px;
  letter-spacing: -0.7px;
}
.detail__link--00 {
  margin: 0 !important;
  width: auto !important;
  position: absolute;
   bottom: 82px;
  left: 0;
}
.product {
  display: flex;
  justify-content: center;
  margin: 22px auto 50px;
}
.product.is-02 {
  margin: 22px auto 65px;
}
div[class^="detail__link"] {
  width: 310px;
  margin: 0 21.5px;
  text-align: left;
}
.detail__link--00 .ttl {
  height: auto;
}
.product .ttl {
  font-size: 22px;
  font-weight: 600;
  color: #221815;
  margin: 28px 0 10px;
  height: 90px;
  line-height: 1.4;
  letter-spacing: 0.4px;
}
.product.is-02 .ttl {
  height: 120px;
}
.product .txt {
  color: #3d3e40;
  font-size: 17px;
  margin: 0 0 13px;
  letter-spacing: -0.7px;
}
.product.is-02 .txt {
  height: 83px;
}
.case-link {
  padding: 35px 0 90px;
}