@charset "UTF-8";
/* Scss Document */
/* CSS Document */
@media screen and (max-width: 768px) {
  .pc_ver {
    display: none; } }

@media screen and (min-width: 769px) {
  .sp_ver {
    display: none; } }

/*
10px　71.4%
12px　85.7%
16px　114.3%
18px　128.6%
20px　142.8% 
24px　171.4%
28px　200%;
32px　228.6%;
36px　257.1%;
42px　300%;
54px　385.7%;
60px　428.6%;
*/
/**
 * SVG画像をアイコンに使いたい的ないろいろ
 *
 *  [Html] SVG塗りつぶしの色をBackground-Imageとして扱うときに変更する
 * https://code.i-harness.com/ja/q/cbfa3c
 */
/**
 * 下記SVGを変更した場合、インポートする側のCSSもアップする必要があります。注意してください。
 *
*/
/* Scss Document */
/* CSS Document */
@media screen and (max-width: 768px) {
  .pc_ver {
    display: none; } }

@media screen and (min-width: 769px) {
  .sp_ver {
    display: none; } }

/*
10px　71.4%
12px　85.7%
16px　114.3%
18px　128.6%
20px　142.8% 
24px　171.4%
28px　200%;
32px　228.6%;
36px　257.1%;
42px　300%;
54px　385.7%;
60px　428.6%;
*/
/**
 * SVG画像をアイコンに使いたい的ないろいろ
 *
 *  [Html] SVG塗りつぶしの色をBackground-Imageとして扱うときに変更する
 * https://code.i-harness.com/ja/q/cbfa3c
 */
/**
 * 下記SVGを変更した場合、インポートする側のCSSもアップする必要があります。注意してください。
 *
*/
@media screen and (min-width: 769px) {
  body {
    padding-top: 120px; } }
@media screen and (max-width: 768px) {
  body {
    padding-top: 80px; } }

header {
  position: fixed;
  top: 0;
  z-index: 100;
  width: 100%;
  background-color: #000;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap; }
  @media screen and (min-width: 769px) {
    header {
      padding: 2em 5% 0 0;
      height: 120px; } }
  @media screen and (max-width: 768px) {
    header {
      padding: .5em 5% 0 0;
      height: 80px; } }
  header #hlogo {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 5%;
    display: flex;
    justify-content: flex-start;
    align-items: center; }
    @media screen and (min-width: 769px) {
      header #hlogo img {
        height: 60px; } }
    @media screen and (max-width: 768px) {
      header #hlogo img {
        height: 45px; } }
    header #hlogo img + img {
      display: inline-block; }
      @media screen and (min-width: 769px) {
        header #hlogo img + img {
          margin-left: 20px;
          height: 20px;
          transform: translateY(8px); } }
      @media screen and (max-width: 768px) {
        header #hlogo img + img {
          margin-left: 15px;
          height: 16px;
          transform: translateY(5px); } }

#spmenu {
  margin-top: 8px;
  position: fixed;
  top: 20px;
  right: 5%;
  z-index: 300; }
  @media screen and (min-width: 769px) {
    #spmenu {
      display: none; } }
  #spmenu .menu-trigger,
  #spmenu .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box; }
  #spmenu .menu-trigger {
    position: relative;
    width: 25px;
    height: 22px; }
  #spmenu .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #FFF;
    border-radius: 4px; }
  #spmenu .menu-trigger span:nth-of-type(1) {
    top: 0; }
  #spmenu .menu-trigger span:nth-of-type(2) {
    top: 10px; }
  #spmenu .menu-trigger span:nth-of-type(3) {
    bottom: 0; }
  #spmenu .menu-trigger.active span:nth-of-type(1) {
    -webkit-transform: translateY(10px) rotate(-315deg);
    transform: translateY(10px) rotate(-315deg);
    background-color: #FFF; }
  #spmenu .menu-trigger.active span:nth-of-type(2) {
    opacity: 0; }
  #spmenu .menu-trigger.active span:nth-of-type(3) {
    -webkit-transform: translateY(-10px) rotate(315deg);
    transform: translateY(-10px) rotate(315deg);
    background-color: #FFF; }

#gmenu {
  position: fixed;
  z-index: 101;
  /* PC版メニュー */
  /* SP版メニュー */ }
  @media screen and (min-width: 769px) {
    #gmenu {
      top: 1.5em;
      right: 5%; } }
  @media screen and (max-width: 768px) {
    #gmenu {
      top: 0;
      left: -100%;
      background-color: #000;
      width: 100%;
      height: 100vh;
      color: #FFF; }
      #gmenu a {
        color: #FFF; } }
  #gmenu.closed {
    left: -100%;
    transition: left 0.2s ease 0s; }
  #gmenu.active {
    left: 0%;
    transition: left 0.2s ease 0s; }
  @media screen and (min-width: 769px) {
    #gmenu {
      display: flex;
      flex-direction: column; }
      #gmenu ul {
        display: flex;
        justify-content: flex-end; }
      #gmenu > ul > li {
        margin-left: 1em; }
      #gmenu > ul > li:first-child {
        margin-left: 0; }
      #gmenu a {
        color: #FFF; }
      #gmenu ul#menu1 {
        order: 3;
        margin-top: 10px; }
        #gmenu ul#menu1 a {
          display: block;
          position: relative;
          padding-left: 1.7em;
          line-height: 1.5;
          text-align: left;
          font-weight: 900; }
        #gmenu ul#menu1 a:before {
          display: block;
          position: absolute;
          left: 0;
          top: 10px;
          content: "";
          width: 1.2em;
          height: 2px;
          background-color: #d71518; }
        #gmenu ul#menu1 a:hover:before {
          background-color: #FFF;
          transition: background-color 0.5s ease 0s; }
      #gmenu ul#menu2 {
        order: 1;
        font-size: 85.7%;
        padding-right: 60px; } }
  @media screen and (max-width: 768px) {
    #gmenu {
      padding-top: 60px; }
      #gmenu ul#menu1, #gmenu ul#menu2 {
        width: 90%;
        margin: 0 auto; }
      #gmenu a {
        text-align: left;
        font-weight: 900;
        display: block;
        color: #FFF;
        position: relative; }
      #gmenu #menu1 a {
        padding-left: 25px;
        font-size: 128.6%;
        padding-top: 15px;
        padding-bottom: 15px; }
      #gmenu #menu1 a:before {
        display: block;
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 15px;
        height: 3px;
        background-color: #d71518;
        content: ""; }
      #gmenu #menu2 a {
        font-size: 114.3%;
        padding-top: 10px;
        padding-bottom: 10px; }
      #gmenu #menu2 a:before {
        display: inline-block;
        width: 1em;
        height: 2em;
        color: #d71518;
        content: ">";
        font-weight: 0; } }
  #gmenu .snsmenu {
    order: 2;
    z-index: 300; }
    @media screen and (min-width: 769px) {
      #gmenu .snsmenu {
        top: 1.8em;
        right: 5%;
        justify-content: flex-end; } }
    @media screen and (max-width: 768px) {
      #gmenu .snsmenu {
        margin-top: 40px;
        margin-left: 5%;
        margin-right: 5%;
        justify-content: flex-start; } }

.snsmenu {
  display: flex; }
  @media screen and (min-width: 769px) {
    .snsmenu {
      position: fixed;
      justify-content: flex-end; } }
  @media screen and (max-width: 768px) {
    .snsmenu {
      margin-top: 40px;
      justify-content: flex-start; } }
  @media screen and (min-width: 769px) {
    .snsmenu li {
      margin-left: 10px !important; } }
  @media screen and (max-width: 768px) {
    .snsmenu li {
      margin-left: 20px; } }
  .snsmenu li:first-child {
    margin-left: 0; }
  .snsmenu a {
    display: block;
    width: 24px;
    height: 24px;
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: center center; }
  .snsmenu .facebook {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%20256px%3B%20height%3A%20256px%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M256%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C256%2C256s256-114.615%2C256-256S397.385%2C0%2C256%2C0z%20M327.211%2C159.859\a 		l-27.096%2C0.012c-21.246%2C0-25.36%2C10.096-25.36%2C24.912v32.67h50.671l-6.598%2C51.171h-44.073v131.3h-52.842v-131.3h-44.185v-51.171\a 		h44.185v-37.737c0-43.793%2C26.746-67.64%2C65.814-67.64c18.713%2C0%2C34.796%2C1.393%2C39.485%2C2.016V159.859z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }
  .snsmenu .instagram {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20503.8%20503.8%22%20style%3D%22width%3A%20256px%3B%20height%3A%20256px%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M256%2C49.5c67.3%2C0%2C75.2.2%2C101.8%2C1.4%2C24.6%2C1.2%2C37.9%2C5.3%2C46.8%2C8.7a77.6%2C77.6%2C0%2C0%2C1%2C28.9%2C18.9%2C77.6%2C77.6%2C0%2C0%2C1%2C18.9%2C28.9c3.4%2C8.9%2C7.5%2C22.2%2C8.7%2C46.8%2C1.2%2C26.6%2C1.4%2C34.5%2C1.4%2C101.8s-.2%2C75.2-1.4%2C101.8c-1.2%2C24.6-5.3%2C37.9-8.7%2C46.8a84.3%2C84.3%2C0%2C0%2C1-47.8%2C47.8c-8.9%2C3.4-22.2%2C7.5-46.8%2C8.7-26.6%2C1.2-34.5%2C1.4-101.8%2C1.4s-75.2-.2-101.8-1.4c-24.6-1.2-37.9-5.3-46.8-8.7a77.6%2C77.6%2C0%2C0%2C1-28.9-18.9%2C77.6%2C77.6%2C0%2C0%2C1-18.9-28.9c-3.4-8.9-7.5-22.2-8.7-46.8-1.2-26.6-1.4-34.5-1.4-101.8s.2-75.2%2C1.4-101.8c1.2-24.6%2C5.3-37.9%2C8.7-46.8A77.6%2C77.6%2C0%2C0%2C1%2C78.5%2C78.5a77.6%2C77.6%2C0%2C0%2C1%2C28.9-18.9c8.9-3.4%2C22.2-7.5%2C46.8-8.7%2C26.6-1.2%2C34.5-1.4%2C101.8-1.4m0-45.4c-68.4%2C0-77%2C.3-103.9%2C1.5S107%2C11.1%2C91%2C17.3A122.8%2C122.8%2C0%2C0%2C0%2C46.4%2C46.4%2C122.8%2C122.8%2C0%2C0%2C0%2C17.3%2C91c-6.2%2C16-10.5%2C34.3-11.7%2C61.1S4.1%2C187.6%2C4.1%2C256s.3%2C77%2C1.5%2C103.9S11.1%2C405%2C17.3%2C421a122.8%2C122.8%2C0%2C0%2C0%2C29.1%2C44.6A122.8%2C122.8%2C0%2C0%2C0%2C91%2C494.7c16%2C6.2%2C34.3%2C10.5%2C61.1%2C11.7s35.5%2C1.5%2C103.9%2C1.5%2C77-.3%2C103.9-1.5%2C45.1-5.5%2C61.1-11.7A129.4%2C129.4%2C0%2C0%2C0%2C494.7%2C421c6.2-16%2C10.5-34.3%2C11.7-61.1s1.5-35.5%2C1.5-103.9-.3-77-1.5-103.9S500.9%2C107%2C494.7%2C91a122.8%2C122.8%2C0%2C0%2C0-29.1-44.6A122.8%2C122.8%2C0%2C0%2C0%2C421%2C17.3c-16-6.2-34.3-10.5-61.1-11.7S324.4%2C4.1%2C256%2C4.1Z%22%20transform%3D%22translate%28-4.1%20-4.1%29%22%2F%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M256%2C126.6A129.4%2C129.4%2C0%2C1%2C0%2C385.4%2C256%2C129.5%2C129.5%2C0%2C0%2C0%2C256%2C126.6ZM256%2C340a84%2C84%2C0%2C1%2C1%2C84-84A84%2C84%2C0%2C0%2C1%2C256%2C340Z%22%20transform%3D%22translate%28-4.1%20-4.1%29%22%2F%3E%3Ccircle%20fill%3D%22%23FFF%22%20cx%3D%22386.4%22%20cy%3D%22117.4%22%20r%3D%2230.2%22%2F%3E%3C%2Fsvg%3E"); }
  .snsmenu .twitter {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%20256px%3B%20height%3A%20256px%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M256%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C256%2C256s256-114.615%2C256-256S397.385%2C0%2C256%2C0z%20M260.926%2C217.391\a c0.084%2C0.004%2C0.164%2C0.021%2C0.25%2C0.025c-0.875-3.752-1.328-7.664-1.328-11.682c0-28.307%2C22.951-51.258%2C51.262-51.258\a%20c14.742%2C0%2C28.063%2C6.225%2C37.414%2C16.188c9.6-1.89%2C18.684-5.174%2C27.129-9.523c1.781-0.864%2C3.566-1.723%2C5.32-2.674%20c-3.039%2C9.334-8.744%2C17.412-16.141%2C23.532c-2.004%2C1.576-4.062%2C3.098-6.326%2C4.344c0.154-0.018%2C0.304-0.052%2C0.457-0.071%20c-0.15%2C0.093-0.275%2C0.22-0.428%2C0.312c8.402-1.005%2C16.459-3.051%2C24.111-5.942c1.715-0.592%2C3.428-1.191%2C5.127-1.852%20c-6.842%2C10.159-15.453%2C19.095-25.375%2C26.259c0.098%2C2.197%2C0.148%2C4.406%2C0.148%2C6.631c0%2C67.736-51.558%2C145.842-145.844%2C145.842%20c-28.947%2C0-55.891-8.484-78.576-23.028c4.01%2C0.473%2C8.092%2C0.715%2C12.229%2C0.715c19.136%2C0%2C37.014-5.269%2C52.383-14.34\a%20c3.871-2.23%2C7.658-4.639%2C11.273-7.365c-0.098-0.002-0.187-0.026-0.285-0.028c0.094-0.073%2C0.196-0.136%2C0.289-0.209%20c-19.422-0.358-36.184-11.539-44.574-27.747c-1.25-2.489-2.32-5.096-3.164-7.831c3.086%2C0.58%2C6.246%2C0.898%2C9.5%2C0.898%20c3.391%2C0%2C6.666-0.436%2C9.871-1.063c1.197-0.168%2C2.406-0.308%2C3.586-0.502c-0.156-0.032-0.293-0.1-0.449-0.133%20c0.162-0.042%2C0.336-0.056%2C0.496-0.1c-23.449-4.709-41.119-25.428-41.119-50.262c0-0.196%2C0.002-0.387%2C0.004-0.58l0.024-0.055%20c5.521%2C3.064%2C11.693%2C5.092%2C18.23%2C5.94c1.609%2C0.269%2C3.221%2C0.516%2C4.832%2C0.657c-0.11-0.074-0.205-0.164-0.314-0.238%20c0.152%2C0.006%2C0.297%2C0.036%2C0.447%2C0.041c-13.754-9.191-22.803-24.883-22.803-42.666c0-8.142%2C1.988-15.787%2C5.367-22.623%20c0.539-1.028%2C1.018-2.078%2C1.637-3.074c22.711%2C27.822%2C55.516%2C46.971%2C92.801%2C52.15c4.16%2C0.605%2C8.332%2C1.144%2C12.553%2C1.388%20C260.934%2C217.443%2C260.932%2C217.416%2C260.926%2C217.391z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }

footer {
  color: #FFF;
  background-color: #000;
  text-align: left; }
  @media screen and (min-width: 769px) {
    footer > .inner {
      padding: 40px 5%;
      display: flex;
      justify-content: flex-start;
      align-items: center; } }
  @media screen and (max-width: 768px) {
    footer > .inner {
      padding: 70px 5% 70px; } }
  footer .leftpart {
    font-size: 257.1%;
    font-weight: 900;
    line-height: 1.4;
    width: 300px; }
    @media screen and (max-width: 768px) {
      footer .leftpart {
        display: none; } }
  @media screen and (max-width: 768px) {
    footer .rightpart {
      text-align: center; } }
  footer #flogo {
    display: flex;
    justify-content: flex-start;
    align-items: center; }
  footer #flogo img {
    height: 60px; }
  footer #flogo img + img {
    display: inline-block; }
    @media screen and (min-width: 769px) {
      footer #flogo img + img {
        margin-left: 20px;
        height: 20px;
        transform: translateY(8px); } }
    @media screen and (max-width: 768px) {
      footer #flogo img + img {
        margin-left: 15px;
        height: 16px;
        transform: translateY(5px); } }
  footer .phones {
    display: block;
    color: #FFF !important;
    font-weight: 900;
    margin-top: 20px;
    font-size: 142.8%;
    line-height: 1; }
  footer dl {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    font-size: 85.7%;
    margin: 10px auto 0;
    text-align: left; }
    footer dl dt {
      width: 6em; }
    footer dl dt:after {
      padding-left: .5em;
      content: "："; }
    footer dl dd {
      width: calc(100% - 6em); }
  @media screen and (min-width: 769px) {
    footer .snsmenu {
      display: none; } }
  @media screen and (max-width: 768px) {
    footer .snsmenu {
      margin: 20px auto;
      justify-content: center; } }
  footer #copyright {
    width: 100%;
    padding: 1em;
    background-color: #000;
    color: #FFF;
    font-size: 85.7%;
    text-align: center; }

/* パン屑リスト
======================================== */
#bread_crumb {
  width: 100%;
  text-align: left;
  padding: 10px 5% 0;
  font-size: 0;
  color: #333; }
  #bread_crumb a {
    color: #333 !important;
    text-decoration: none; }

#bread_crumb ol {
  margin-top: 0; }

#bread_crumb ol > li {
  font-size: 12px;
  line-height: 1.8;
  display: inline-block;
  vertical-align: top;
  padding-left: 0;
  text-indent: 0; }

#bread_crumb ol > li + li {
  margin-left: 1em;
  padding-left: 1.3em; }

#bread_crumb ol > li + li:before {
  display: inline-block;
  counter-increment: none;
  content: ">";
  text-align: left;
  width: 1em; }

#bread_crumb ol li:before {
  display: inline-block;
  content: ""; }

#bread_crumb ol li:last-child {
  color: #333; }

/* ============================
main
============================ */
main#page404 {
  max-width: 1400px;
  text-align: left; }
  @media screen and (min-width: 769px) {
    main#page404 {
      margin: 200px auto;
      padding: 0 5%; } }
  @media screen and (max-width: 768px) {
    main#page404 {
      margin: 100px auto;
      padding: 0 5%; } }
  main#page404 h1 {
    line-height: 1.4; }
    @media screen and (min-width: 769px) {
      main#page404 h1 {
        font-size: 28px;
        letter-spacing: .2em; } }
    @media screen and (max-width: 768px) {
      main#page404 h1 {
        font-size: 24px; } }
  main#page404 h1 + p {
    margin-top: .5em;
    font-size: large;
    font-weight: 900; }
  main#page404 div {
    margin-top: 40px; }

/* ボタンの体裁
======================================== */
.backbt {
  margin-top: 100px;
  margin-bottom: 100px; }
  .backbt a:link {
    text-decoration: none;
    color: #FFF; }
  .backbt a:visited {
    text-decoration: none;
    color: #FFF; }
  .backbt a:hover {
    text-decoration: none;
    color: #FFF; }
  .backbt a:active {
    text-decoration: none;
    color: #FFF; }
  .backbt span {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M255.992%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C255.992%2C256C397.385%2C512%2C512%2C397.385%2C512%2C256%20S397.385%2C0%2C255.992%2C0z%20M232.213%2C389.57l-44.097-44.106L277.572%2C256l-89.456-89.464l44.097-44.097L365.782%2C256L232.213%2C389.57z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-size: 12px 12px;
    padding-left: 20px;
    background-repeat: no-repeat;
    background-position: left 45%; }
    @media screen and (min-width: 769px) {
      .backbt span {
        background-size: 14px 14px;
        font-size: large; } }
  .backbt.lines {
    border-top: solid 1px #333;
    border-bottom: solid 1px #333; }
    @media screen and (min-width: 769px) {
      .backbt.lines {
        padding: 40px 0px; } }
    @media screen and (max-width: 768px) {
      .backbt.lines {
        padding: 20px 0px; } }

@media screen and (min-width: 769px) {
  .backlists {
    margin-top: 80px; } }
@media screen and (max-width: 768px) {
  .backlists {
    margin-top: 40px; } }
.backlists a {
  display: block;
  padding: 2em 1em;
  background-color: #111;
  border-radius: 6px; }
.backlists a:hover {
  background-color: #212121;
  transition: background-color 0.5s ease 0s; }
.backlists span {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M255.992%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C255.992%2C256C397.385%2C512%2C512%2C397.385%2C512%2C256%20S397.385%2C0%2C255.992%2C0z%20M232.213%2C389.57l-44.097-44.106L277.572%2C256l-89.456-89.464l44.097-44.097L365.782%2C256L232.213%2C389.57z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-size: 12px 12px;
  padding-left: 20px;
  background-repeat: no-repeat;
  background-position: left 45%; }
.backlists a:link {
  text-decoration: none;
  color: #FFF; }
.backlists a:visited {
  text-decoration: none;
  color: #FFF; }
.backlists a:hover {
  text-decoration: none;
  color: #FFF; }
.backlists a:active {
  text-decoration: none;
  color: #FFF; }

.more {
  display: table;
  width: 220px;
  text-align: right;
  position: relative;
  padding-right: 30px;
  color: #666 !important;
  border-bottom: solid 1px #CFCFCF;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-size: 128.6%;
  font-weight: 900;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23999%22%20d%3D%22M255.992%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C255.992%2C256C397.385%2C512%2C512%2C397.385%2C512%2C256%20S397.385%2C0%2C255.992%2C0z%20M232.213%2C389.57l-44.097-44.106L277.572%2C256l-89.456-89.464l44.097-44.097L365.782%2C256L232.213%2C389.57z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-size: 12px 12px;
  background-repeat: no-repeat;
  background-position: right 40%; }

.more:hover {
  color: #d71518 !important;
  border-bottom: solid 1px #d71518;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23d71518%22%20d%3D%22M255.992%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C255.992%2C256C397.385%2C512%2C512%2C397.385%2C512%2C256%20S397.385%2C0%2C255.992%2C0z%20M232.213%2C389.57l-44.097-44.106L277.572%2C256l-89.456-89.464l44.097-44.097L365.782%2C256L232.213%2C389.57z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }

.mailicon {
  display: inline-block;
  color: #FFF !important;
  background-color: #d71518;
  margin-top: 20px;
  font-size: 85.7%;
  font-weight: 900; }
  .mailicon span {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A%20256px%3B%20height%3A%20256px%3B%20opacity%3A%201%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M432.469%2C0.01H79.531C35.61%2C0.01%2C0%2C35.62%2C0%2C79.541v0.232l219.118%2C199.838%20c10.505%2C9.572%2C23.592%2C14.271%2C36.872%2C14.29c13.301-0.02%2C26.368-4.718%2C36.873-14.29L512%2C79.773v-0.232%20C512%2C35.62%2C476.389%2C0.01%2C432.469%2C0.01z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22%23FFF%22%20d%3D%22M255.99%2C353.55c-27.532%2C0.019-55.279-10-77.064-29.863L0%2C160.508v271.951c0%2C43.92%2C35.61%2C79.531%2C79.531%2C79.531%20h352.938c43.92%2C0%2C79.531-35.611%2C79.531-79.531V160.508L333.056%2C323.687C311.289%2C343.55%2C283.543%2C353.568%2C255.99%2C353.55z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-size: 14px 14px;
    padding-left: 24px;
    background-repeat: no-repeat;
    background-position: left 50%; }
  @media screen and (min-width: 769px) {
    .mailicon {
      padding: .4em 3%;
      min-width: 220px;
      border-bottom: solid 2px #dd9e9f; } }
  @media screen and (max-width: 768px) {
    .mailicon {
      text-align: center;
      padding: .8em 5%;
      width: 80%;
      border-bottom: solid 2px #dd9e9f; } }

#pagetopbt {
  background-color: #333; }
  @media screen and (min-width: 769px) {
    #pagetopbt {
      padding: 40px 0 55px; } }
  @media screen and (max-width: 768px) {
    #pagetopbt {
      padding: 10px 0 25px; } }
  #pagetopbt a {
    color: #FFF;
    display: block;
    text-align: center;
    font-weight: 900;
    padding-top: 36px;
    position: relative;
    min-height: 50px; }
    @media screen and (min-width: 769px) {
      #pagetopbt a {
        font-size: 142.8%; } }
    @media screen and (max-width: 768px) {
      #pagetopbt a {
        font-size: 114.3%; } }
  #pagetopbt a:before {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20327.8%20512%22%20width%3D%22327.8%22%20height%3D%22512%22%20preserveAspectRatio%3D%22xMinYMid%22%3E%3Cpolygon%20fill%3D%22%23FFF%22%20points%3D%2271.8%200%200%2071.8%20184.2%20256%200%20440.2%2071.8%20512%20327.8%20256%2071.8%200%22%2F%3E%3C%2Fsvg%3E");
    background-size: 24px 24px;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
    top: 0;
    left: 50%;
    content: "";
    width: 36px;
    height: 36px;
    transform: rotate(-90deg) translateY(-18px); }
  #pagetopbt a:hover:before {
    top: -8px;
    transition: top 0.25s ease 0s; }

.bt01 {
  display: table;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  min-width: 300px;
  padding: 26px 40px;
  background-color: #333;
  color: #FFF !important;
  font-size: 128.6%;
  line-height: 1.2;
  text-align: left; }

.bt01.radiusbt {
  border-radius: 40px; }

.bt01.arw, .bt02.arw {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20256.2%20115.7%22%20width%3D%22256.2%22%20height%3D%22115.7%22%20preserveAspectRatio%3D%22xMinYMid%22%3E%3Cpolygon%20fill%3D%22%23FFF%22%20points%3D%22256.2%2096.2%20256%2096%20256%2095.7%20255.6%2095.7%20160%200%20145.8%2014.1%20227.4%2095.7%200%2095.7%200%20115.7%20256%20115.7%20256%2096.3%20256.2%2096.2%22%2F%3E%3C%2Fsvg%3E");
  background-size: 24px 24px;
  padding-left: 20px;
  padding-right: 60px;
  background-repeat: no-repeat;
  background-position: right 10px top 45%; }

.bt01.nexts, .bt02.nexts {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20327.8%20512%22%20width%3D%22327.8%22%20height%3D%22512%22%20preserveAspectRatio%3D%22xMinYMid%22%3E%3Cpolygon%20fill%3D%22%23FFF%22%20points%3D%2271.8%200%200%2071.8%20184.2%20256%200%20440.2%2071.8%20512%20327.8%20256%2071.8%200%22%2F%3E%3C%2Fsvg%3E");
  background-size: 12px 12px;
  padding-left: 20px;
  padding-right: 60px;
  background-repeat: no-repeat;
  background-position: right 16px top 50%; }

/* hover 処理 */
.bt01:hover, .bt02:hover {
  opacity: 0.7;
  transition: opacity .25s ease 0s; }

/* ボタンカラー */
.bt01.red, .bt02.red {
  background-color: #d71518; }

/* テキスト位置 */
.bt01.ctr {
  text-align: center;
  padding-left: 60px;
  padding-left: 60px; }

/* ボタン位置 */
.bt01.left {
  margin-left: 0;
  margin-right: auto; }

.bt01.right {
  margin-left: auto;
  margin-right: 0; }

/* サイズ */
.bt01.large {
  width: 100;
  padding-top: 40px;
  padding-bottom: 40px; }
  @media screen and (min-width: 769px) {
    .bt01.large {
      min-width: 600px; } }

.bt01.radiusbt.large {
  height: 100px;
  border-radius: 50px; }

.bt01.small {
  min-width: 145px;
  padding-top: 14px;
  padding-bottom: 14px; }

.bt01.radiusbt.small {
  height: 48px;
  border-radius: 24px; }

/* ============================
アイキャッチ
============================ */
.hicatch {
  position: relative; }
  @media screen and (min-width: 769px) {
    .hicatch {
      padding-top: .75em; } }
  @media screen and (max-width: 768px) {
    .hicatch {
      text-align: center;
      padding-top: .5em; } }

.hicatch:before {
  position: absolute;
  width: 30px;
  height: 5px;
  background-color: #d71518;
  content: ""; }
  @media screen and (min-width: 769px) {
    .hicatch:before {
      top: 0;
      left: 0; } }
  @media screen and (max-width: 768px) {
    .hicatch:before {
      top: 0;
      left: 50%;
      transform: translateX(-50%); } }

/* ============================
下層共通
============================ */
main.def {
  padding-bottom: 120px; }
  main.def .mainimage {
    width: 100%;
    padding-bottom: 24.8%;
    position: relative;
    overflow: hidden; }
    main.def .mainimage h1 {
      position: absolute;
      color: #FFF;
      z-index: 2; }
      @media screen and (min-width: 769px) {
        main.def .mainimage h1 {
          font-size: 385.7%;
          top: 50%;
          left: 5%;
          transform: translateY(-50%); } }
      @media screen and (max-width: 768px) {
        main.def .mainimage h1 {
          font-size: 142.8%;
          width: 90%;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%); } }
    main.def .mainimage > picture, main.def .mainimage img {
      z-index: -1;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: auto;
      height: auto;
      min-width: 100%;
      min-height: 100%; }
    @media screen and (min-width: 769px) {
      main.def .mainimage .hicatch:before {
        width: 1.5em;
        height: 10px; } }
  main.def .mainimage #topSwiper {
    position: absolute;
    width: 100vw;
    height: 100%;
    z-index: -1; }
  main.def strong {
    color: #d71518;
    font-weight: 900; }
  main.def ul.def {
    margin-top: 40px; }
  main.def table.def, main.def dl.def {
    margin-top: 60px; }

p.read {
  line-height: 1.8;
  color: #d71518;
  text-align: left; }
  @media screen and (min-width: 769px) {
    p.read {
      font-size: 171.4%; } }
  @media screen and (max-width: 768px) {
    p.read {
      font-size: 142.8%; } }

main .inner.max {
  max-width: 1600px;
  padding: 0 5%;
  margin-left: auto;
  margin-right: auto; }

main .inner.mid {
  max-width: 1200px;
  padding: 0 5%;
  margin-left: auto;
  margin-right: auto; }

main .inner.min {
  max-width: 880px;
  margin-left: auto;
  margin-right: auto; }
  @media screen and (min-width: 769px) {
    main .inner.min {
      padding: 70px 5%; } }
  @media screen and (max-width: 768px) {
    main .inner.min {
      padding: 0 5%; } }

main .inner section h2 {
  text-align: left; }
  @media screen and (min-width: 769px) {
    main .inner section h2 {
      padding-top: 80px;
      font-size: 200%;
      padding-bottom: .5em;
      border-bottom: solid 5px #d71518; } }
  @media screen and (max-width: 768px) {
    main .inner section h2 {
      padding-top: 40px;
      font-size: 142.8%;
      padding-bottom: .5em;
      border-bottom: solid 3px #d71518; } }
main .inner section h3 {
  text-align: left;
  position: relative; }
  @media screen and (min-width: 769px) {
    main .inner section h3 {
      margin-top: 60px;
      font-size: 171.4%;
      padding-left: .5em;
      padding-bottom: .5em;
      border-bottom: solid 1px #E6E6E6; } }
  @media screen and (max-width: 768px) {
    main .inner section h3 {
      margin-top: 30px;
      font-size: 128.6%;
      padding-left: .5em;
      padding-bottom: .5em;
      border-bottom: solid 1px #E6E6E6; } }
main .inner section h3:before {
  display: block;
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  left: 0;
  width: 5px;
  height: 1em;
  background-color: #d71518;
  content: ""; }
main .inner section h4 {
  text-align: left; }
  @media screen and (min-width: 769px) {
    main .inner section h4 {
      margin-top: 40px;
      font-size: 142.8%;
      padding-left: .5em;
      padding-bottom: .5em;
      border-bottom: solid 1px #d71518; } }
  @media screen and (max-width: 768px) {
    main .inner section h4 {
      margin-top: 40px;
      font-size: 114.3%;
      padding-left: .5em;
      padding-bottom: .5em;
      border-bottom: solid 1px #d71518; } }
main .inner section h5 {
  text-align: left;
  position: relative;
  line-height: 1.1;
  margin-top: 2em;
  padding-left: .5em; }
  @media screen and (min-width: 769px) {
    main .inner section h5 {
      font-size: 128.6%; } }
  @media screen and (max-width: 768px) {
    main .inner section h5 {
      font-size: 114.3%; } }
main .inner section h5:before {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 1em;
  background-color: #d71518;
  content: ""; }
main .inner section h6 {
  text-align: left;
  position: relative;
  line-height: 1.1;
  color: #d71518;
  margin-top: 1.5em;
  font-weight: 700; }
main .inner section p {
  text-align: left; }
@media screen and (min-width: 769px) {
  main .inner section * + p {
    margin-top: 40px; } }
@media screen and (max-width: 768px) {
  main .inner section * + p {
    margin-top: 20px; } }
@media screen and (min-width: 769px) {
  main .inner section h2 + p, main .inner section h2 + .clm2 {
    margin-top: 40px; } }
@media screen and (max-width: 768px) {
  main .inner section h2 + p, main .inner section h2 + .clm2 {
    margin-top: 20px; } }
main .inner section h3 + p, main .inner section h3 + .clm2 {
  margin-top: 20px; }
main .inner section h4 + p, main .inner section h5 + p, main .inner section h4 + .clm2, main .inner section h5 + .clm2 {
  margin-top: 1em; }
main .inner section h6 + p, main .inner section h6 + .clm2 {
  margin-top: .5em; }

div.clm2 {
  display: flex;
  justify-content: space-between; }
  div.clm2 .photos img, div.clm2 .photos picture {
    max-width: 90%;
    display: inline;
    margin-top: 0; }
  div.clm2.imgR .texts {
    order: 1;
    text-align: left; }
  div.clm2.imgR .photos {
    order: 2;
    text-align: right; }
  div.clm2.imgL .texts {
    order: 2;
    text-align: left; }
  div.clm2.imgL .photos {
    order: 1;
    text-align: left; }
  div.clm2 .texts.w50 {
    width: 50%; }
  div.clm2 .texts.w50 + .photos {
    width: 50%; }
  div.clm2 .texts.w60 {
    width: 60%; }
  div.clm2 .texts.w60 + .photos {
    width: 40%; }
  div.clm2 .texts.w70 {
    width: 70%; }
  div.clm2 .texts.w70 + .photos {
    width: 30%; }
  @media screen and (max-width: 768px) {
    div.clm2.imgR.sp1clm, div.clm2.imgL.sp1clm {
      flex-wrap: wrap; }
      div.clm2.imgR.sp1clm .texts, div.clm2.imgL.sp1clm .texts {
        order: 1;
        text-align: left;
        width: 100%; }
      div.clm2.imgR.sp1clm .photos, div.clm2.imgL.sp1clm .photos {
        order: 2;
        text-align: center;
        width: 100%;
        margin-top: 30px; }
      div.clm2.imgR.sp1clm .photos img, div.clm2.imgR.sp1clm .photos picture, div.clm2.imgL.sp1clm .photos img, div.clm2.imgL.sp1clm .photos picture {
        max-width: 100%; } }

/* ============================
画像のみのブロック
============================ */
main .inner > img, main .inner > picture,
main .inner section > img, main .inner > section > picture,
main .inner div > img, main .inner > div > picture {
  display: block;
  margin: 60px auto;
  max-width: 100%; }

main .imgclm2 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; }
  main .imgclm2 div, main .imgclm2 li {
    width: 41.6%;
    margin-right: 50px;
    margin-top: 40px; }
  main .imgclm2 div + div, main .imgclm2 li + li {
    margin-right: 0; }

main .imgclm3 {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap; }
  main .imgclm3 > div, main .imgclm3 > li {
    width: 31.3%;
    margin-right: 3%;
    margin-top: 40px; }
  main .imgclm3 > div:nth-child(3n), main .imgclm3 li:nth-child(3n) {
    margin-right: 0; }

main .imgclm4 {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap; }
  main .imgclm4 > div, main .imgclm4 > li {
    width: 23%;
    margin-right: 2.6%;
    margin-top: 30px; }
  main .imgclm4 > div:nth-child(4n), main .imgclm4 li:nth-child(4n) {
    margin-right: 0; }

main .imgclm2 img, main .imgclm3 img, main .imgclm4 img,
main .imgclm2 picture, main .imgclm3 picture, main .imgclm4 picture {
  display: inline;
  margin: 0 !important; }

@media screen and (max-width: 768px) {
  main .imgclm2.sp1clm > div, main .imgclm2.sp1clm > li, main .imgclm3.sp1clm > div, main .imgclm3.sp1clm > li, main .imgclm4.sp1clm > div, main .imgclm4.sp1clm > li {
    width: 100%;
    margin-top: 30px;
    margin-right: 0; }
    main .imgclm2.sp1clm > div img, main .imgclm2.sp1clm > li img, main .imgclm3.sp1clm > div img, main .imgclm3.sp1clm > li img, main .imgclm4.sp1clm > div img, main .imgclm4.sp1clm > li img {
      max-width: 100%; } }

/* ============================
記事一覧
============================ */
.articles {
  margin-top: 60px; }
  .articles li + li {
    margin-top: 40px; }
  .articles li a {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    text-align: left; }
  .articles a:link {
    text-decoration: none;
    color: #FFF; }
  .articles a:visited {
    text-decoration: none;
    color: #FFF; }
  .articles a:hover {
    text-decoration: none;
    color: #FFF; }
  .articles a:active {
    text-decoration: none;
    color: #FFF; }
  .articles .info {
    font-size: x-small; }
  .articles h3 {
    margin-top: 0;
    margin-bottom: .5em;
    font-size: large;
    font-weight: 900;
    position: relative; }
  .articles * + h3 {
    margin-top: .5em; }
  .articles.faq h3 {
    padding-left: 46px;
    min-height: 36px; }
  .articles.faq h3:before {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    content: "Q";
    color: #FFF;
    background-color: #000;
    text-align: center;
    font-size: 18px;
    line-height: 32px;
    width: 36px;
    height: 36px;
    border-radius: 6px; }
  .articles.myblog h3 {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cg%3E%3Cpath%20fill%3D%22%23000%22%20d%3D%22M255.992%2C0C114.615%2C0%2C0%2C114.615%2C0%2C256s114.615%2C256%2C255.992%2C256C397.385%2C512%2C512%2C397.385%2C512%2C256%20S397.385%2C0%2C255.992%2C0z%20M232.213%2C389.57l-44.097-44.106L277.572%2C256l-89.456-89.464l44.097-44.097L365.782%2C256L232.213%2C389.57z%22%3E%3C%2Fpath%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    background-size: 12px 12px;
    padding-left: 20px;
    background-repeat: no-repeat;
    background-position: left .5em; }
  .articles .categories {
    display: inline-block;
    padding: .5em;
    line-height: 1;
    background-color: #000;
    font-size: small; }
  .articles .desc {
    margin-top: 1em;
    font-size: small; }

/* ============================
記事詳細
============================ */
main.singles h2 {
  font-size: x-large;
  position: relative;
  line-height: 1.4;
  color: #000;
  text-align: left; }
  @media screen and (min-width: 769px) {
    main.singles h2 {
      padding-left: 3em; } }
@media screen and (min-width: 769px) {
  main.singles h2:before {
    content: '';
    position: absolute;
    top: .7em;
    left: 0;
    display: inline-block;
    width: 2.5em;
    height: 3px;
    background-color: #000; } }
@media screen and (max-width: 768px) {
  main.singles h2:before {
    display: none; } }
main.singles * + h2 {
  margin-top: 3em; }
main.singles h3 {
  margin-top: 2.5em;
  font-size: large;
  line-height: 1.4;
  text-align: left; }
main.singles p {
  text-align: left;
  line-height: 2.5em; }
main.singles h2 + p {
  margin-top: 2.5em; }
main.singles * + P {
  margin-top: 1.5em; }
main.singles p + p {
  margin-top: 2em; }
main.singles > img, main.singles p > img {
  display: block;
  text-align: center;
  margin: 20px auto 0px;
  padding-bottom: 10px; }
main.singles * + img {
  margin-top: 3em; }
main.singles dl, main.singles table, main.singles ul {
  text-align: left; }
main.singles dl.def, main.singles table.def {
  margin-top: 3em; }
main.singles a {
  text-decoration: underline; }

aside #author {
  font-size: small; }
  aside #author .profile {
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 768px) {
      aside #author .profile {
        align-items: center; } }
    aside #author .profile .photos {
      width: 30%; }
    aside #author .profile .texts {
      width: 66%;
      line-height: 1.4; }
  aside #author img {
    display: block;
    text-align: center;
    margin: 0 auto; }
  aside #author h2 {
    font-size: large;
    border: none;
    padding: 0;
    line-height: 1;
    margin-top: 10px; }
  aside #author #career {
    margin-top: 15px;
    border-top: solid 1px #333;
    padding-top: 20px; }
  aside #author #profileSotfList {
    margin-top: 20px; }
    aside #author #profileSotfList li {
      width: 30px;
      height: 30px; }

.newsArea section h2.ttl {
  padding-top: 15px !important; }
.newsArea ul.date {
  padding-top: 70px;
  display: flex;
  justify-content: flex-start; }
  .newsArea ul.date li {
    margin-right: 1.5em; }

@media screen and (max-width: 768px) {
  .newslist {
    margin-top: 30px; } }
.newslist li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  border-bottom: 1px dotted #ccc;
  text-align: left; }
  @media screen and (max-width: 768px) {
    .newslist li {
      flex-wrap: wrap; } }
  @media screen and (min-width: 769px) {
    .newslist li {
      padding-top: 25px;
      padding-bottom: 25px; } }
  @media screen and (max-width: 768px) {
    .newslist li {
      padding-top: 15px;
      padding-bottom: 15px; } }
@media screen and (min-width: 769px) {
  .newslist .dates {
    width: 10em; } }
@media screen and (max-width: 768px) {
  .newslist .dates {
    width: 6em; } }
.newslist .categories {
  padding-left: 15px;
  position: relative; }
  @media screen and (min-width: 769px) {
    .newslist .categories {
      width: 12em; } }
  @media screen and (max-width: 768px) {
    .newslist .categories {
      margin-left: 1em; } }
  .newslist .categories:before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    content: "";
    width: 10px;
    height: 2px;
    background-color: #999; }
@media screen and (max-width: 768px) {
  .newslist .categories + * {
    width: 100%; } }
.newslist a {
  text-decoration: none; }
.newslist a:hover {
  color: #666; }

.icontext {
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  padding: 6px 6px;
  border-radius: 6px;
  color: #FFF;
  background-color: #000; }
  .icontext.reds {
    background-color: #d71518; }

.swiper-container {
  width: 100%;
  height: 100%; }

.swiper-container img {
  width: 100%;
  height: auto; }

.swiper-pagination-bullet-active {
  opacity: 1;
  background: #d71518; }

@media screen and (min-width: 769px) {
  .recommends {
    margin-top: 120px; } }
@media screen and (max-width: 768px) {
  .recommends {
    margin-top: 80px; } }
.recommends .recoTitle {
  display: inline-block;
  text-align: center;
  font-size: 142.8%;
  padding-bottom: 1em;
  border-bottom: solid 2px #000; }
@media screen and (min-width: 769px) {
  .recommends .linkarea {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 40px; } }
@media screen and (max-width: 768px) {
  .recommends .linkarea {
    padding-top: 40px; } }
@media screen and (min-width: 769px) {
  .recommends .linkarea li {
    width: 33.333%; } }
.recommends .linkarea a {
  display: block;
  position: relative;
  color: #FFF; }
  @media screen and (min-width: 769px) {
    .recommends .linkarea a {
      padding-bottom: 61.7%;
      font-size: 200%; } }
  @media screen and (max-width: 768px) {
    .recommends .linkarea a {
      padding-bottom: 30.8%;
      font-size: 142.8%; } }
.recommends .linkarea h3 {
  position: absolute; }
  @media screen and (min-width: 769px) {
    .recommends .linkarea h3 {
      bottom: 30px;
      left: 20px;
      padding-top: 40px; } }
  @media screen and (max-width: 768px) {
    .recommends .linkarea h3 {
      bottom: 15px;
      left: 10px;
      padding-top: 10px; } }
@media screen and (max-width: 768px) {
  .recommends .linkarea .hicatch:before {
    top: 0;
    left: 0%;
    transform: translateX(0%); } }
.recommends .linkarea a:hover .hicatch:before {
  width: 100%;
  transition: width 0.25s ease 0s; }
.recommends .park {
  background: url("/common/img/top/photo3.jpg") center center no-repeat;
  background-size: cover; }
.recommends .clinic {
  background: url("/common/img/top/photo6.jpg") center center no-repeat;
  background-size: cover; }
.recommends .items {
  background: url("/common/img/top/photo2.jpg") center center no-repeat;
  background-size: cover; }
.recommends .goods {
  background: url("/common/img/top/photo4.jpg") center center no-repeat;
  background-size: cover; }
.recommends .sale {
  background: url("/common/img/top/photo5.jpg") center center no-repeat;
  background-size: cover; }
