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

main html {
  line-height: 1;
}

main ol, main ul {
  list-style: none;
}

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

main caption, main th, main td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

main q, main blockquote {
  quotes: none;
}

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

main a img {
  border: none;
}

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

main img {
  vertical-align: bottom;
}

html {
  width: 100%;
  margin: 0 auto;
  font-size: 62.5%;
}

body {
  font-size: 1.3rem;
  line-height: 1.8;
  font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, Arial, Sans-Serif;
  color: #000;
  text-align: left;
  background-color: #FFF;
}

main a {
  color: #000;
  text-decoration: none;
  transition: all 0.2s;
}

main a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
}

main img {
  width: 100%;
}

main .inner {
  box-sizing: border-box;
  margin: 0 auto;
}

@media screen and (min-width: 320px) {
  main .inner {
    width: 96%;
  }
}

/*@media screen and (min-width: 1040px) {
  main .inner {
    width: 1040px;
  }
}*/

@media screen and (min-width: 960px) {
  main .inner {
    width: 960px;
  }
}

main .grayArea {
  background-color: #F6F5F4;
}

main .l-inner {
  width: 1000px;
  margin: 0 auto;
  zoom: 1;
}

main .l-inner:after {
  content: "";
  display: table;
  clear: both;
}

main .breakArea {
  padding-top: 3.5rem;
  padding-bottom: 5rem;
}

@media screen and (max-width: 767px) {
  main .breakArea {
    padding-top: 2rem;
    padding-bottom: 0;
  }
}

main .breakArea-title {
  width: 343px;
  margin-bottom: 1.6rem;
}

@media screen and (max-width: 342px) {
  main .breakArea-title {
    width: 100%;
  }
}

main .breakArea-descArea {
  padding: 3.5rem 1.6rem;
  border: 1px dashed #858585;
  margin-bottom: 5.5rem;
  zoom: 1;
}

main .breakArea-descArea:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 767px) {
  main .breakArea-descArea {
    padding: 1.5rem 1rem;
    margin-bottom: 2rem;
  }
}

main .breakArea-left {
  width: 47%;
  float: left;
}

@media screen and (max-width: 767px) {
  main .breakArea-left {
    width: 100%;
    float: none;
  }
}

main .breakArea-right {
  width: 47%;
  float: right;
}

@media screen and (max-width: 767px) {
  main .breakArea-right {
    width: 100%;
    float: none;
  }
}

main .leftContents-image {
  width: 68.4989%;
  margin-bottom: 2.8rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-image {
    width: 100%;
    margin-bottom: 2rem;
  }
}

main .leftContents-title {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.2;
  color: #2BA5DF;
  margin-bottom: 0.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-title {
    text-align: center;
  }
}

main .leftContents-desc {
  margin-bottom: 2.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-desc {
    margin-bottom: 2rem;
  }
}

main .leftContents-desc > dt {
  font-size: 1.7rem;
  font-weight: bold;
  margin-bottom: 0.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-desc > dt {
    font-size: 1.4rem;
    line-height: 1.5;
  }
}

main .leftContents-desc > dd {
  font-size: 1.3rem;
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  main .leftContents-desc > dd {
    font-size: 1.1rem;
    line-height: 1.7;
  }
}

main .leftContents-specificationTitle {
  font-size: 1.2rem;
  line-height: 1.2;
  padding-left: 1.2rem;
  padding-bottom: 4px;
  border-bottom: 1px solid #27A9E1;
  position: relative;
  margin-bottom: 3.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationTitle {
    font-size: 1rem;
    line-height: 1.4;
    margin-bottom: 1.5rem;
  }
}

main .leftContents-specificationTitle > em {
  font-size: 1.7rem;
  font-weight: bold;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationTitle > em {
    font-size: 1.4rem;
  }
}

main .leftContents-specificationTitle:before {
  content: "";
  display: block;
  width: 7px;
  height: 35px;
  background-color: #27A9E1;
  position: absolute;
  top: -2px;
  left: 0;
}

@media screen and (max-width: 399px) {
  main .leftContents-specificationTitle:before {
    height: 48px;
  }
}

main .leftContents-specificationTable {
  width: 100%;
  margin-bottom: 3.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationTable {
    margin-bottom: 2rem;
  }
}

main .leftContents-specificationTable tr:nth-child(2n+1) {
  background-color: #F6F5F4;
}

main .leftContents-specificationTable th {
  display: block;
  font-size: 1.7rem;
  font-weight: bold;
  line-height: 1;
  padding: 1rem 1.5rem 0.5rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationTable th {
    font-size: 1.3rem;
  }
}

main .leftContents-specificationTable td {
  display: block;
  font-size: 1.3rem;
  line-height: 1.3;
  padding: 0 1.5rem 0.8rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationTable td {
    font-size: 1.1rem;
  }
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationLinks {
    width: 80%;
    margin: 0 auto 3rem;
  }
}

main .leftContents-specificationLinks > li {
  margin-bottom: 2.8rem;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationLinks > li {
    margin-bottom: 1rem;
  }
}

main .leftContents-specificationLinks > li a {
  display: block;
  font-size: 1.4rem;
  color: #fff;
  line-height: 1;
  padding: 2rem 2.5rem;
  background-color: #2BA6E0;
  position: relative;
}

@media screen and (max-width: 1040px) {
  main .leftContents-specificationLinks > li a {
    padding: 2rem 4.5rem 2rem 2.5rem;
    line-height: 1.3;
  }
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationLinks > li a {
    font-size: 1.2rem;
    line-height: 1.5;
    padding: 0.8rem 1.5rem;
    padding-right: 4rem;
  }
}

main .leftContents-specificationLinks > li a:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 0 15px 15px;
  border-color: transparent transparent transparent #fff;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.6rem;
  margin: auto;
}

@media screen and (max-width: 767px) {
  main .leftContents-specificationLinks > li a:after {
    border-width: 5px 0 5px 5px;
  }
}

main .rightContents > li {
  margin-bottom: 2.6rem;
}

@media screen and (max-width: 767px) {
  main .rightContents > li {
    margin-bottom: 2rem;
  }
}

main .rightContents-title {
  margin-bottom: 1.5rem;
}

@media screen and (max-width: 767px) {
  main .rightContents-title {
    margin-bottom: 0.7rem;
  }
}

main .rightContents-subtitle {
  font-size: 1.9rem;
  color: #26A9E0;
}

@media screen and (max-width: 767px) {
  main .rightContents-subtitle {
    font-size: 1.3rem;
  }
}

main .rightContents-text {
  font-size: 1.3rem;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

@media screen and (max-width: 767px) {
  main .rightContents-text {
    font-size: 1.1rem;
  }
}

main .rightContents-point1 .rightContents-image {
  width: 290px;
}

@media screen and (max-width: 767px) {
  main .rightContents-point1 .rightContents-image {
    width: 80%;
    margin: 0 auto;
  }
}

main .rightContents-point2 .rightContents-image {
  width: 283px;
}

@media screen and (max-width: 767px) {
  main .rightContents-point2 .rightContents-image {
    width: 80%;
    margin: 0 auto;
  }
}

main .rightContents-point3, main .rightContents-point4 {
  zoom: 1;
}

main .rightContents-point3:after, main .rightContents-point4:after {
  content: "";
  display: table;
  clear: both;
}

main .rightContents-point3 .rightContents-image, main .rightContents-point4 .rightContents-image {
  width: 19.45%;
  float: left;
  margin-right: 4.86%;
}

main .rightContents-point3 > div, main .rightContents-point4 > div {
  width: 75.69%;
  float: right;
}

main .rightContents-point5 > .rightContents-subtitle {
  margin-bottom: 2rem;
}

@media screen and (max-width: 767px) {
  main .rightContents-point5 > .rightContents-subtitle {
    margin-bottom: 1rem;
  }
}

main .rightContents-point5 dt {
  color: #2BA5DF;
  line-height: 1;
  margin-bottom: 0.3rem;
}

@media screen and (max-width: 767px) {
  main .rightContents-point5 dt {
    font-size: 1.3rem;
  }
}

main .rightContents-point5 dd {
  margin-bottom: 2rem;
}

@media screen and (max-width: 767px) {
  main .rightContents-point5 dd {
    margin-bottom: 1rem;
  }
}

main .rightContents-point5 .usb {
  padding-bottom: 9rem;
  background: url(../img/bg_03.png) left 104px bottom no-repeat;
}

@media screen and (max-width: 767px) {
  main .rightContents-point5 .usb {
    padding-bottom: 0;
    background: none;
  }
}

main .rightContents-point5 .rightContents-image {
  width: 205px;
}

@media screen and (max-width: 767px) {
  main .rightContents-point5 .rightContents-image {
    width: 60%;
    margin: 0 auto;
  }
}

main .bnr {
  width: 700px;
  margin-bottom: 5rem;
}

@media screen and (max-width: 699px) {
  main .bnr {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  main .bnr {
    margin-bottom: 2rem;
  }
}


@media screen and (min-width: 320px) {
  main .hero {
    width: 100%;
  }
}

@media screen and (min-width: 960px) {
  main .hero {
    width: 960px;
  }
}


main .hero {
  padding: 2rem 0 7rem;
  margin: 0 auto;
  margin-bottom: 5rem;
  background: url(../img/hero_bg_01.png) center 0 no-repeat;
  background-size: cover;
}

@media screen and (max-width: 767px) {
  main .hero {
    padding: 1rem 0 1rem;
    margin-bottom: 2rem;
  }
}

main .hero-catch {
  width: 62.4%;
  margin-left: auto;
  margin-bottom: 1.3rem;
}

@media screen and (max-width: 767px) {
  main .hero-catch {
    width: 70%;
  }
}

main .hero-title {
  width: 18.269%;
  margin-left: auto;
  margin-bottom: 2.4rem;
}

@media screen and (max-width: 767px) {
  main .hero-title {
    width: 40%;
    margin-bottom: 1rem;
  }
}

main .hero-desc {
  width: 22.3%;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  main .hero-desc {
    width: 35%;
  }
}

main .importanceArea {
  padding-top: 3.5rem;
  padding-bottom: 2.4rem;
}

@media screen and (max-width: 767px) {
  main .importanceArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
}

main .importanceArea .text-desc {
  margin-bottom: 3.5rem;
}

main .importanceArea-detail {
  background: url(../img/bg_01.jpg) right 0 no-repeat;
}

@media screen and (max-width: 1039px) {
  main .importanceArea-detail {
    padding-right: 27%;
    background-size: 25%;
  }
}

@media screen and (max-width: 767px) {
  main .importanceArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
  main .importanceArea .text-desc {
    margin-bottom: 3rem;
  }
  main .importanceArea-detail {
    padding-right: 33%;
    background-size: 30%;
  }
}

@media screen and (max-width: 549px) {
  main .importanceArea-detail {
    padding-right: 0;
    background: none;
  }
  main .importanceArea .title-small + .text-interviewee {
    padding-left: 45%;
    background: url(../img/bg_01.jpg) 0 0 no-repeat;
    background-size: 40%;
  }
}

main .lifetimeArea {
  padding-top: 3.5rem;
  padding-bottom: 1.2rem;
}

@media screen and (max-width: 767px) {
  main .lifetimeArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
}

main #meritArea {
  padding-top: 3.5rem;
  padding-bottom: 1.9rem;
}

@media screen and (max-width: 767px) {
  main #meritArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
}

main #preventionArea {
  padding-top: 3.5rem;
  padding-bottom: 1.4rem;
}

@media screen and (max-width: 767px) {
  main #preventionArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
}

main .profileArea {
  margin-bottom: 8rem;
}

main .profileArea > .inner {
  zoom: 1;
}

main .profileArea > .inner:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 767px) {
  main .profileArea {
    margin-bottom: 2rem;
  }
}

main .profile {
  width: 47.11538%;
  float: left;
}

@media screen and (max-width: 767px) {
  main .profile {
    width: 100%;
    float: none;
    margin-bottom: 2rem;
  }
}

main .profile > dt {
  margin-bottom: 1rem;
}

main .profile-desc {
  font-size: 1.5rem;
  font-weight: bold;
}

main .profile-desc > em {
  font-size: 3.5rem;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  main .profile-desc {
    font-size: 1.1rem;
    margin-bottom: 1rem;
  }
  main .profile-desc > em {
    font-size: 2rem;
  }
}

main .profile-text {
  font-size: 1.38rem;
  line-height: 1.5;
  margin-bottom: 2rem;
}

@media screen and (max-width: 767px) {
  main .profile-text {
    font-size: 1.1rem;
    line-height: 1.7;
    margin-bottom: 1rem;
  }
}

main .profile-link {
  width: 260px;
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  main .profile-link {
    width: 50%;
    margin: 0 auto;
  }
}

main .profile-link > a {
  display: block;
  text-align: center;
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
  padding: 2rem 3rem;
  background-color: #2BA6E0;
}

@media screen and (max-width: 767px) {
  main .profile-link > a {
    font-size: 1.2rem;
    padding: 1rem 0rem;
  }
}

main .checkPoint {
  width: 48.46153%;
  float: right;
}

@media screen and (max-width: 767px) {
  main .checkPoint {
    width: 100%;
    float: none;
  }
}

main .checkPoint > dt {
  margin-bottom: 4.4rem;
}

@media screen and (max-width: 767px) {
  main .checkPoint > dt {
    margin-bottom: 1.5rem;
  }
}

main .checkPoint > dd {
  margin-left: 1.6rem;
}

@media screen and (max-width: 767px) {
  main .checkPoint > dd {
    width: 80%;
    margin: 0 auto;
  }
}

main .checkPoint-item {
  margin-top: 2.5rem;
}

main .checkPoint-item:first-child {
  margin-top: 0;
}

@media screen and (max-width: 767px) {
  main .checkPoint-item {
    margin-top: 1rem;
  }
}

main #recommendedArea {
  padding-top: 3rem;
  padding-bottom: 1.4rem;
}

@media screen and (max-width: 767px) {
  main #recommendedArea {
    padding-top: 2rem;
    padding-bottom: 1rem;
  }
}

main #recommendedArea > .inner {
  padding-left: 28.3rem;
  background: url(../img/bg_02.jpg) 0 0 no-repeat;
}

@media screen and (max-width: 767px) {
  main #recommendedArea > .inner {
    padding-left: 33%;
    background-size: 30%;
  }
}

@media screen and (max-width: 549px) {
  main #recommendedArea > .inner {
    padding-left: 0;
    background: none;
  }
  main #recommendedArea .text-interviewee:nth-child(3) {
    padding-right: 45%;
    background: url(../img/bg_02.jpg) right 0 no-repeat;
    background-size: 40%;
  }
}

main .text-desc {
  font-size: 1.4rem;
  line-height: 1.5;
  margin-bottom: 2rem;
}

@media screen and (max-width: 767px) {
  main .text-desc {
    font-size: 1.1rem;
    margin-bottom: 1rem;
    line-height: 1.7;
  }
}

main .text-interviewee, main .text-interviewer {
  font-size: 1.3rem;
  line-height: 1.4;
  margin-bottom: 1.6rem;
}

@media screen and (max-width: 767px) {
  main .text-interviewee, main .text-interviewer {
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 1rem;
  }
}

main .text-interviewee {
  color: #221F1F;
}

main .text-interviewer {
  color: #26A9E0;
}

main .title-big {
  font-size: 3.5rem;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 3.5rem;
  color: #26A9E0;
}

@media screen and (max-width: 767px) {
  main .title-big {
    font-size: 2rem;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
}

main .title-small {
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1;
  padding-left: 0.8rem;
  padding: 0.4rem 0 0.1rem 0.8rem;
  border-left: 9px solid #27A9E1;
  margin-bottom: 2.8rem;
}

@media screen and (max-width: 767px) {
  main .title-small {
    font-size: 1.4rem;
    line-height: 1.3;
    margin-bottom: 1rem;
  }
}

/*# sourceMappingURL=style.css.map */

#container {
  line-height: 1.3;
  font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo, sans-serif;
}