@charset "UTF-8";


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


/*
==================================================
共通
==================================================
*/
body {
  margin: 0;
  padding: 0;
  line-height: 1.8;
  font-size: 18px;
  font-size: 1.8rem;
  -webkit-text-size-adjust: 100%;
  color: #000;
  font-weight: 400;
  font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", Arial, Verdana, sans-serif;
}
a, a:link, a:visited, a:hover, a:active {
  text-decoration: none;
  outline: none;
}
a {
  color: #007bff;
}
a:hover {
  color: #0056b3;
  text-decoration: underline;
}
h1, h2, h3 {
  margin: 0;
  padding: 0;
  font-weight: normal;
}
img {
  max-width: 100%;
  height: auto;
}
strong {
  font-weight: bold;
}
.red {
  color: #f00;
}
.line {
  background-color: #fff600;
}
.flex-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  justify-content: left;
}
#profile .flex-box {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.inner {
  width: 90%;
  max-width: 960px;
  margin: 0 auto;
}
.table {
  display: table;
  table-layout: fixed;
  width: 100%;
  border-collapse: collapse;
}
.table .cell {
  display: table-cell;
  vertical-align: middle;
}
/* haeder */
header .inner#main {
  padding-bottom: 30px;
  background: url("../images/header_matsu.jpg")no-repeat right bottom/25% auto;
}
header #cam-limit a {
color:#0090ff;
}
header .image.cell {
  width: 30%;
}
header h1 {
  margin-bottom: 15px;
  font-size: 36px;
  font-size: 3.6rem;
  line-height: 1.5;
  font-weight: bold;
  font-family: "ヒラギノ角ゴ StdN W8","Hiragino Kaku Gothic StdN","HGP創英角ｺﾞｼｯｸUB","HGPSoeiKakugothicUB","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}
header p {
  margin-bottom: 15px;
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 1.5;
  font-weight: bold;
  color: #1180b8;
}
header ul li {
  padding-left: 45px;
  margin-bottom: 10px;
  background: url("../images/catchlogo_1.png")no-repeat left top/30px auto;
}
header ul li:nth-child(2) {
  background: url("../images/catchlogo_2.png")no-repeat left top/30px auto;
}
header ul li:last-child {
  margin-bottom: 0;
  background: url("../images/catchlogo_3.png")no-repeat left top/30px auto;
}
/* main */
main h2 {
  position: relative;
  margin-bottom: 25px;
  border-bottom: solid 2px;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.7;
  font-weight: bold;
}
main h2:before {
  content: '';
  position: absolute;
  display: block;
  width: 80px;
  height: 2px;
  background-color: #42a6ff;
  left: 0;
  bottom: -2px;
}
main h3 {
  margin-bottom: 25px;
  font-size: 20px;
  font-size: 2rem;
  line-height: 1.7;
  font-weight: bold;
  text-align: center;
}
main .txt {
  margin-bottom: 20px;
}
main .image {
  margin-bottom: 30px;
}
main .txt:last-child,
main .image:last-child {
  margin-bottom: 0;
}
main .lead,
main .section {
  margin-bottom: 60px;
}
main .lead .block {
  width: calc(96% / 3);
  padding: 15px 20px;
  margin-right: 2%;
  border: 10px solid #efefef;
}
main .lead .block:last-child {
  margin-right: 0;
}
main .lead .block .cap {
  background: url("../images/icon_right.png")no-repeat center top/80px auto;;
  padding-top: 100px;
  font-size: 20px;
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
}
main .lead .block:nth-child(2) .cap {
  background: url("../images/icon_pc.png")no-repeat center top/80px auto;
}
main .lead .block:last-child .cap {
  background: url("../images/icon_coin.png")no-repeat center top/80px auto;
}
#cam-limit {
  padding: 20px 0 15px;
  margin-bottom: 30px;
  background-color: #b81111;
}
#cam-limit .inner {
  padding: 0;
}
#cam-limit .txt {
  margin-bottom: 0;
  text-align: center;
  color: #fff;
  font-size: 30px;
  font-size: 3rem;
  line-height: 1.4;
  font-weight: bold;
}
.limit-txt .fb {
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: bold;
}
main .box {
  padding: 20px;
  margin-bottom: 20px;
  border: 1px solid #000;
}
main .box:last-child {
  margin-bottom: 0;
}
main .box .cap {
  margin-bottom: 10px;
  font-weight: bold;
}
main .btn a {
  display: block;
  width: 100%;
  max-width: 700px;
  padding: 35px 20px 30px;
  margin: 0 auto 30px;
  border-radius: 15px;
  border-bottom: 4px solid #d37800;
  font-size: 40px;
  font-size: 4rem;
  line-height: 1;
  text-align: center;
  color: #fff;
  background-color: #ffa300;
  text-decoration: none;
  font-weight: bold;
  transition: all .3s;
}
main .btn a:hover {
  background-color: #ff7600;
}
main .link-wrapper p {
  margin-bottom: 10px;
  text-align: center;
}
/* #about */
main .open-btn {
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
  font-size: 24px;
  font-size: 2.4rem;
  line-height: 1.3;
  background: #1180b8 url(../images/icon_arrow.png) no-repeat right center;
  text-align: center;
  color: #fff;
  font-weight: bold;
  transition: all .3s;
}
main .open-btn:hover {
  cursor: pointer;
  background-color: #019fee;
}
main .open-btn .txt span {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: normal;
  color: #fff;
}
main .open-area {
  display: none;
}
main #about .table-wrapper {
  margin-bottom: 30px;
}
main #about th {
  padding: 15px 10px;
}
main #about th span {
  display: block;
  width: 80px;
  height: 61px;
  font-size: 15px;
  padding-top: 10px;
  font-weight: bold;
  background: url("../images/point_back.png") no-repeat left top;
  text-align: center;
  color: #2ECCFA;
}
main #about td {
  padding: 10px;
  vertical-align: middle;
}
main #about td:last-child {
  width: 12%;
}
main #about tr:nth-of-type(2n+1) {
  background-color: rgba(0, 0, 0, 0.05);
}
/* #voice */
main #voice .box {
  border: solid 10px #efefef;
}
main #voice .cell {
  padding: 10px 20px;
}
main #voice .cell:last-child {
  width: 120px;
  padding-left: 0;
}
main #voice .image img {
  border-radius: 50%;
}
/* .product */
main .product .limit-txt {
  margin-bottom: 10px;
  text-align: center;
}
main .product .txt {
  font-size: 36px;
  font-size: 3.6rem;
  font-weight: bold;
  text-align: center;
}
main .product ul {
  max-width: 90%;
  margin: 0 auto;
}
main .product li {
  padding-left: 35px;
  margin-bottom: 10px;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: bold;
  background: url("../images/icon_circle.png") no-repeat left 5px;
}
/* #faq */
main #faq .cap {
  position: relative;
  margin-bottom: 10px;
  font-weight: bold;
}
main #faq .cap::before {
  content: 'Q';
  position: absolute;
  width: 35px;
  height: 35px;
  left: 0;
  top: 0;
  display: inline-block;
  padding: 0;
  margin-right: 10px;
  border-radius: 50%;
  text-indent: 0;
  background-color: #42a6ff;
  color: #fff;
  text-align: center;
  line-height: 35px;
  font-weight: bold;
}
main #faq .txt-wrapper {
  position: relative;
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px dotted #ccc;
}
main #faq .txt-wrapper::before {
  content: 'A';
  position: absolute;
  width: 35px;
  height: 35px;
  left: 0;
  top: 0;
  display: inline-block;
  padding: 0;
  margin-right: 10px;
  border-radius: 50%;
  text-indent: 0;
  background-color: #aaa;
  color: #fff;
  text-align: center;
  line-height: 35px;
  font-weight: bold;
}
main #faq .txt-wrapper .txt,
main #faq .cap span {
  padding: 0 0 0 45px;
}
main #faq .cap span {
  display: inline-block;
  padding-top: 3px;
}
/* #profile */
main #profile .table {
  margin-bottom: 30px;
}
main #profile .image.cell {
  width: 350px;
  padding-right: 40px;
}
main #profile .block {
  padding: 30px 10%;
  border: solid 10px #efefef;
}
main #profile figure {
  width: calc(70% / 3);
  margin-right: 15%;
}
main #profile figure:last-child {
  margin-right: 0;
}
main #profile figure .image {
  margin-bottom: 10px;
}
main #profile figcaption {
  text-align: center;
  font-size: 14px;
  font-size: 1.4rem;
}
/* #add */
main #add .box:nth-child(2) {
  margin-bottom: 50px;
}
/* footer */
footer {
  background-color: #110c09;
}
.pc {
  display: block;
}
.sp,
.sp-m {
  display: none;
}
@media screen and (max-width:768px){
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  body {
    font-size: 16px;
    font-size: 1.6rem;
  }
  header .inner {
    padding-top: 20px;
  }
  header .inner#main {
    padding-bottom: 20px;
    background-size: 30% auto;
    background-position: right bottom;
  }
  header .inner#main ul {
    text-align: left;
    margin-right: 30%;
  }
  main #profile .table {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  main #profile .image.cell {
    display: block;
    width: 40%;
    padding: 0;
    margin: 0 auto 10px;
  }
  main #profile .cell {
    display: block;
    width: 100%;
    padding: 0;
  }
  header .txt-wrapper.cell {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 2;
    -webkit-order: 2;
    order: 2;
  }
  header .image.cell {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 1;
    -webkit-order: 1;
    order: 1;
  }
  header h1 {
    font-size: 20px;
    font-size: 2rem;
    letter-spacing: -0.05rem;
    text-align: center;
  }
  header p {
    font-size: 18px;
    font-size: 1.8rem;
    text-align: center;
  }
  main .btn a {
    padding: 15px 20px;
    font-size: 22px;
    font-size: 2.2rem;
    line-height: 1.3;
  }
  main .lead,
  main .section {
    margin-bottom: 30px;
  }
  main h2 {
    margin-bottom: 20px;
    font-size: 20px;
    font-size: 2rem;
    line-height: 1.5;
  }
  main .lead .flex-box {
    display: block;
    width: 100%;
  }
  main .lead .block,
  main .lead .block:last-child {
    display: block;
    width: 100%;
    padding: 15px 20px;
    margin-right: 0;
    margin-bottom: 10px;
  }
  main .lead .block:last-child {
    margin-bottom: 0;
  }
  #cam-limit {
    padding: 10px 0;
    margin-bottom: 0;
  }
  #cam-limit .txt {
    font-size: 20px;
    font-size: 2rem;
  }
  .limit-txt .fb {
    font-size: 20px;
    font-size: 2rem;
  }
  main .open-btn {
    padding-bottom: 40px;
    font-size: 18px;
    font-size: 1.8rem;
    text-align: left;
    background-position: center bottom;
  }
  main #about th {
    display: block;
    width: 100%;
    padding: 20px 20px 5px;
  }
  main #about td {
    display: block;
    width: 100%;
    padding: 5px 20px;
  }
  main #about td:last-child {
    padding: 5px 20px 10px;
  }
  main .open-btn {
    padding-bottom: 45px;
    margin-bottom: 10px;
    background: #1180b8 url(../images/icon_arrow02.png) no-repeat center bottom;
  }
  main .open-btn .txt {
    font-size: 16px;
    font-size: 1.6rem;
  }
  main .open-btn .txt span {
    display: inline-block;
    padding-top: 5px;
    font-size: 14px;
    font-size: 1.4rem;
  }
  main .product .txt {
    font-size: 22px;
    font-size: 2.2rem;
  }
  main .product ul {
    max-width: 100%;
  }
  main .product ul li {
    margin-bottom: 5px;
    font-size: 18px;
    font-size: 1.8rem;
    background-position: 0 0;
  }
  main #voice .cell:last-child {
    display: none;
  }
  main #profile .block {
    padding: 30px 5%;
  }
  main #profile figure {
    width: calc(80% / 3);
    margin-right: 10%;
  }
  main #profile figcaption br {
    display: none;
  }
  main #add .box:nth-child(2) {
    margin-bottom: 30px;
  }
}
@media screen and (max-width:480px){
  .sp-m {
    display: block;
  }
  header .inner#main {
    padding-bottom: 20px;
    background-size:100px auto;
    background-position: right 10px;
  }
  header .inner#main ul {
    margin-right: 0;
  }
  header .inner#main h1 {
    text-align: left;
    margin-right: 100px;
  }
  header .inner#main p {
    text-align: center;
  }
}