@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Noto+Sans+JP:500,700&subset=japanese");
html {
  color: #000;
  background: #FFF; }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0; }

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

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var {
  font-style: normal;
  font-weight: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

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

abbr, acronym {
  border: 0;
  font-variant: normal; }

sup {
  vertical-align: text-top; }

sub {
  vertical-align: text-bottom; }

input, textarea, select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  font-size: 100%;
    border: 1px solid #ccc;
}
input, textarea {
    font-size: 14px;
    padding: 5px;
}
textarea {
    width: calc(100% - 10px);
}

legend {
  color: #000; }

#yui3-css-stamp.cssreset {
  display: none; }

button,
input[type="submit"] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0;
  border: none;
  outline: none;
  background: transparent; }

input[type="radio"]:checked + label {
  background: #eee; }

.hero .text, .secTtl, .news .moreBtn, .recomItem .content .moreBtn, .productListItem .content .moreBtn, .productMain .moreRead, .corporateNews .moreBtn, .recomItem .content, .productListItem .content, .pageTop .content, .pageHeader .pageTitle .title, .productMain .text, .majorProducts .title, .handlingShop .title, .majorProducts .box .itemTitle, .handlingShop .btnBox .btn, .cardNav .box .item {
  /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  }

.hero .text,.pageTop .content {
    font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;}　 /*20190827ユーザー希望により追加*/
    
.br1200 {
  display: none; }
  @media screen and (max-width: 1200px) {
    .br1200 {
      display: block; } }

.br1000 {
  display: none; }
  @media screen and (max-width: 1000px) {
    .br1000 {
      display: block; } }

.br768 {
  display: none; }
  @media screen and (max-width: 768px) {
    .br768 {
      display: block; } }

@media screen and (max-width: 768px) {
  .br768del {
    display: none; } }

.br480 {
  display: none; }
  @media screen and (max-width: 480px) {
    .br480 {
      display: block; } }

@media screen and (max-width: 480px) {
  .br480del {
    display: none; } }

body {
  font-size: 14px;
  /*font-family: "Hiragino Kaku Gothic ProN",'Noto Sans JP',"游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
  font-weight: 500;
  width: 100%;
  color: #000;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}
@media screen and (max-width: 768px) {
    body { font-size: 14px; }
    body.glasses { padding-bottom: 60px; }
    body.contactlens { padding-bottom: 60px; }
}



strong {
  font-weight: bold; }

h2 {
  font-size: 24px;
  margin-bottom: 5px; }

img {
  font-family: "object-fit: cover;"; }
  
.headerNav ul li img {
    font-family: none;
}

a {
  text-decoration: none;
  color: currentColor;
  -webkit-transition: all 0.3s;
  transition: all 0.3s; }
  a:hover {
    opacity: .7; }

a, button {
  cursor: pointer; }

p {
  margin: 0;
  line-height: 1.8; }

strong {
  font-weight: bold; }

li {
  list-style-type: none; }

ul {
  padding: 0;
  margin: 0; }

.headerIn, .headerNav ul, .newsIn, .recom, .productList, .searchArea, .pageHeader, .productSlider, .productMain, .majorProducts, .handlingShop, .corporateNewsList, .blogMain, .blogSearch, .corporateContent, .shopListWrapper {
  max-width: 1200px;
  width: 96%;
  margin: 0 auto; }

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(-50%, 0);
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    -webkit-transform: translate(-50%, 20px);
    opacity: 0; } }
.mb {
  margin-bottom: 1em; }

.wrapper {
  overflow: hidden; }

.header {
  height: 150px;
  width: 100%;
  position: fixed;
  left: 0;
  right: 0;
  background: #fff;
  z-index: 50;
  -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
  transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
  @media screen and (max-width: 1000px) {
    .header {
      height: 64px; } }
  .header.hide {
    -webkit-transform: translateY(-100%);
            transform: translateY(-100%); }
    .header.hide.active {
      -webkit-transform: translateY(0);
              transform: translateY(0); }
  .headerIn {
    position: relative;
    height: 100px; }
    @media screen and (max-width: 1000px) {
      .headerIn {
        height: 100%; } }
    .headerIn .siteLogo {
      position: absolute;
      left: 50%;
      top: 36px;
      -webkit-transform: translate(-50%, 0);
              transform: translate(-50%, 0);
      z-index: 100;
      max-width: 232px;
      width: 100%;
      -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
      transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
      .hearing_aid .headerIn .siteLogo {
          top: 26px;
      }
      @media screen and (max-width: 1000px) {
          .headerIn .siteLogo { top: 18px; }
          .hearing_aid .headerIn .siteLogo { top: 8px; }
      }
      @media screen and (max-width: 768px) {
        .headerIn .siteLogo {
          max-width: 184px;
          top: 22px; }
        .hearing_aid .headerIn .siteLogo {
          max-width: 184px;
          top: 12px; }
      }
      .headerIn .siteLogo img {
        width: 100%;
        height: auto; }
      @media screen and (max-width: 1000px) {
        .headerIn .siteLogo.active {
          position: fixed;
          z-index: 150;
          top: 106px; } }
      @media screen and (max-width: 768px) {
        .headerIn .siteLogo.active {
          top: 190px; } }
    .headerIn .subLogoBox {
      height: 100%;
      position: relative;
      -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
      transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
      @media screen and (max-width: 1000px) {
        .headerIn .subLogoBox {
          position: fixed;
          top: 60px;
          left: 5%;
          right: 5%;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          z-index: 200;
          height: auto;
          border-bottom: solid 1px;
          -webkit-transform: translateY(-300px);
                  transform: translateY(-300px); }
          .headerIn .subLogoBox.active {
            -webkit-transform: translateY(0);
                    transform: translateY(0); } }
    .headerIn .subLogo {
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%); }
      @media screen and (max-width: 1000px) {
        .headerIn .subLogo {
          position: relative;
          -webkit-transform: translateY(0);
                  transform: translateY(0);
          margin-bottom: 20px; } }
      .headerIn .subLogo img {
        width: 100%;
        height: auto; }
      .headerIn .subLogo:nth-of-type(1) {
        max-width: 107px;
        left: 0; }
        @media screen and (max-width: 1000px) {
          .corporate .headerIn .subLogo:nth-of-type(1) {
            display: none; } }
      .headerIn .subLogo:nth-of-type(2) {
        right: 80px;
        max-width: 148px; }
        .corporate .headerIn .subLogo:nth-of-type(2) {
          -webkit-transform: translateY(0);
                  transform: translateY(0);
          top: 51%; }
        @media screen and (max-width: 1000px) {
          .headerIn .subLogo:nth-of-type(2) {
            right: auto; } }
      .headerIn .subLogo:nth-of-type(3) {
        right: 0;
        max-width: 57px; }
        @media screen and (max-width: 1000px) {
          .headerIn .subLogo:nth-of-type(3) {
            position: absolute;
            right: 0; } }
        @media screen and (max-width: 768px) {
          .headerIn .subLogo:nth-of-type(3) {
            right: auto;
            left: 60%; } }
      .headerIn .subLogo:nth-of-type(4) {
        max-width: 140px;
        bottom: 51%;
        top: auto;
        right: 80px;
        -webkit-transform: translateY(0);
                transform: translateY(0); }
        @media screen and (max-width: 1000px) {
          .headerIn .subLogo:nth-of-type(4) {
            right: auto; } }
    .headerIn .toggleBtn {
      position: absolute;
      top: 50%;
      left: 8px;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      height: 24px;
      width: 28px;
      display: none;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      z-index: 200; }
      @media screen and (max-width: 1000px) {
        .headerIn .toggleBtn {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex; } }
      .headerIn .toggleBtn span {
        height: 2px;
        width: 100%;
        background: #555;
        -webkit-transition: all 0.3s cubic-bezier(0.21, 0.47, 0.22, 0.99);
        transition: all 0.3s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
        .headerIn .toggleBtn span:nth-of-type(1) {
          -webkit-transform: translateY(-9px);
                  transform: translateY(-9px); }
        .headerIn .toggleBtn span:nth-of-type(3) {
          -webkit-transform: translateY(9px);
                  transform: translateY(9px); }
      .headerIn .toggleBtn.active span:nth-of-type(1) {
        -webkit-transform: translateY(100%) rotate(-45deg);
                transform: translateY(100%) rotate(-45deg); }
      .headerIn .toggleBtn.active span:nth-of-type(2) {
        -webkit-transform: rotate(405deg);
                transform: rotate(405deg); }
      .headerIn .toggleBtn.active span:nth-of-type(3) {
        -webkit-transform: translateY(-100%) rotate(45deg);
                transform: translateY(-100%) rotate(45deg); }
    .headerIn .contactSp {
      background: #005633;
      border-radius: 100%;
      width: 28px;
      height: 28px;
      display: none;
      position: absolute;
      right: 0;
      top: 20px;
      text-align: center; }
    .contactlens .headerIn .contactSp {
      right: 32px; }
    .headerIn .reserveSp {
      background: #005633;
      border-radius: 100%;
      width: 28px;
      height: 28px;
      display: none;
      position: absolute;
      right: 0;
      top: 20px;
      text-align: center; }
      .corporate .headerIn .contactSp,
      .corporate .headerIn .reserveSp {
        background: #603813; }
      .contact .headerIn .contactSp,
      .contact .headerIn .reserveSp {
        background: #3393FF; }
      @media screen and (max-width: 1000px) {
        .headerIn .contactSp {
          display: block;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center; }
        .headerIn .reserveSp {
          display: block;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center; }
          .headerIn .contactSp.active {
            display: none; }
          .headerIn .reserveSp.active {
            display: none; }
      .headerIn .contactSp img {
        width: 60%;
        height: auto; }
      .headerIn .reserveSp img {
        width: 90%;
          height: auto; }}
  .headerNav {
    height: 50px;
    background: #f6f6f6;
    -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
    transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
    @media screen and (max-width: 1000px) {
      .headerNav {
        background: #fff;
        padding: 5%;
        padding-top: 170px;
        z-index: 100;
        padding-bottom: 80px;
        -webkit-transform: translateY(-120%);
                transform: translateY(-120%);
        position: fixed;
        height: auto;
        top: 0;
        left: 0;
        right: 0; }
        .headerNav.active {
          -webkit-transform: translateY(0);
                  transform: translateY(0); } }
    @media screen and (max-width: 768px) {
      .headerNav {
        padding-top: 240px; } }
    .headerNav ul {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      height: 100%;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      position: relative; }

/*2019.0812*/
.headerNav ul li ul {
    display: block;
    position: absolute;
    top:32px;
    background-color: #f6f6f6;
    height: auto;
    width: 25em;
    visibility: hidden;
    opacity: 0;
    z-index: 1;
    transition: all .2s ease;
}
.headerNav ul li.menu_single:hover ul {
    top: 42px;
    visibility: visible;
    opacity: 1;
}
.contactlens .headerNav ul li.menu_single {
    margin-right: 90px;
}
@media screen and (max-width: 768px) {
    .headerNav ul li ul {
        display: none;
        position: static;
    }
}
.headerNav ul li ul li {
    border-top: 1px solid #ccc;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition:.5s;
}
.headerNav ul li ul li:hover {
    background-color: #ddd;
}
/*2019.0812ここまで*/

      @media screen and (max-width: 1000px) {
        .headerNav ul {
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center; } }
      @media screen and (max-width: 768px) {
        .headerNav ul {
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          -webkit-box-align: start;
              -ms-flex-align: start;
                  align-items: flex-start;
          -webkit-box-pack: start;
              -ms-flex-pack: start;
                  justify-content: flex-start; } }
      @media screen and (max-width: 1000px) {
        .headerNav ul li {
          width: 33.33%; } }
      @media screen and (max-width: 768px) {
        .headerNav ul li {
          width: auto; } }
      .headerNav ul li a {
        padding: 10px 5px;
        position: relative;
        margin-right: 20px;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        font-size: 15px; }
        @media screen and (max-width: 1000px) {
          .headerNav ul li a {
            margin-right: 0;
            display: block; } }
        .headerNav ul li a:before {
          content: '';
          position: absolute;
          top: 50%;
          -webkit-transform: translateY(-50%);
                  transform: translateY(-50%);
          right: 101%;
          width: 5px;
          height: 20px;
          -webkit-transition: all 0.3s;
          transition: all 0.3s;
          background: url(/img/arrow-head-menu.png) no-repeat center center/100%; }
        .headerNav ul li a:hover {
          opacity: .9; }
          .headerNav ul li a:hover:before {
            -webkit-transform: translate(50%, -50%);
                    transform: translate(50%, -50%); }
      .headerNav ul li:last-child a {
        font-size: 13px;
        display: block;
        padding: 0 18px;
        padding-left: 32px;
        line-height: 30px;
        position: absolute;
        right: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        color: #fff;
        border-radius: 1.5em;
        background: #005633 url(/img/mail.png) no-repeat 14% center/14px;
        margin-right: 0; }
        .corporate .headerNav ul li:last-child a {
          background: #603813 url(/img/mail.png) no-repeat 14% center/14px; }

        .corporate .headerNav ul li:last-child.store_c a {
          background: #603813 url(/img/contact.png) no-repeat 3% center/25px;
          padding: 0 10px 0 25px;}

/*2019.08.12*/
.headerNav ul li ul li a {
    display: block;
    margin-right: 0;
    padding: 15px;
    line-height: 1em;
}
.headerNav ul li ul li a::before {
    content: none;
}

      .headerNav ul li ul li:last-child a {
        font-size: 15px;
        display: block;
        padding: 15px;
        line-height: 1em;
        position: relative;
        -webkit-transform: none;
                transform: none;
        color:  inherit;
        border-radius: none;
        background: none;
        margin-right: 0; }
      .corporate .headerNav ul li ul li:last-child a {
        font-size: 15px;
        display: block;
        padding: 15px;
        line-height: 1em;
        position: relative;
        -webkit-transform: none;
                transform: none;
        color:  inherit;
        border-radius: none;
        background: none;
        margin-right: 0; }
      .contact .headerNav ul li ul li:last-child a {
        font-size: 15px;
        display: block;
        padding: 15px;
        line-height: 1em;
        position: relative;
        -webkit-transform: none;
                transform: none;
        color:  inherit;
        border-radius: none;
        background: none;
        margin-right: 0; }
/*2019.08.12ここまで*/

.contact .headerNav ul li:last-child a {
    background: #3393FF url(/img/contact.png) no-repeat 3% center/25px;
    padding: 0 10px 0 25px;
}
.contact .headerNav ul li:nth-last-child(2) a {
        font-size: 13px;
        display: block;
        padding: 0 10px;
        padding-left: 26px;
        line-height: 30px;
        position: absolute;
        right: 160px;
        top: 50%;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        color: #fff;
        border-radius: 1.5em;
        background: #3393FF url(/img/mail.png) no-repeat 9% center/14px;
        margin-right: 0;
}
.contact .headerNav ul li ul li:nth-last-child(2) a {
        font-size: 15px;
        display: block;
        padding: 15px;
        line-height: 1em;
        position: relative;
        -webkit-transform: none;
                transform: none;
        color:  inherit;
        border-radius: none;
        background: none;
        margin-right: 0;
        right: inherit;
}
.headerNav ul li:last-child a:before {
          display: none; }
.contact .headerNav ul li:nth-last-child(2) a:before {
          display: none; }

        @media screen and (max-width: 1000px) {
          .headerNav ul li:last-child a {
            position: absolute;
            left: 50%;
            -webkit-transform: translateX(-50%);
                    transform: translateX(-50%);
            top: 110%;
            right: auto; }
            
            .contact .headerNav ul li:last-child a {
                width: 120px;
                left: 72%;
                text-align: center;
            }
            .contact .headerNav ul li:nth-last-child(2) a {
                top: 117%;
                left: 8%;
                width: 80px;
            }
}
      .corporate .headerNav ul li:nth-of-type(1) a:before, .corporate .headerNav ul li:nth-of-type(2) a:before, .corporate .headerNav ul li:nth-of-type(3) a:before {
        display: none; }
      .corporate .headerNav ul li:nth-of-type(1) img {
        max-height: 17px;
        margin-top: 6px; }
      .corporate .headerNav ul li img {
        margin-top: 3px;
        max-height: 20px; }

main {
  display: block;
  margin-top: 150px; }
  @media screen and (max-width: 1000px) {
    main {
      margin-top: 64px; } }

.hero {
  position: relative; }
  .hero .heroItem {
    position: relative;
    max-height: 700px;
    min-height: 400px; }
    .hero .heroItem:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
            background: none;/*background: #000;*/
      opacity: .1;
        display: none;
}
      /*.corporate .hero .heroItem:after {
        background: white; }
      .glasses .hero .heroItem:after {
        background: #; }*/
      .contact .hero .heroItem:after {
        background: white;/*background: #0D0C3D;*/ }
      .corporate.hearing_aid .hero .heroItem:after {
        background: #3b220c;
        opacity: .6; }
  .hero .img {
    height: 100%;
    overflow: hidden;
      position: relative;
}
    .hero .img img {
      width: 100%;
      height: 100%;
      min-height: 400px;
      -o-object-fit: cover;
        object-fit: cover; }
/*.hero .img a {
    width: 100%;
    height: 100%;
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    cursor: grab;
    pointer-events: inherit;
}*/
.hero .t35th {padding-top: 20px;} /*2019.08.19*/
.hero .text {
    position: absolute;
    width: 96%;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    text-align: center;
    color: #000;
    background-color: rgba(255,255,255,0.5);
    z-index: 1;
    pointer-events: none; }
    @media screen and (max-width: 1200px) {
      .hero .text {
        padding-bottom: 0%;/*padding-bottom: 10%;*/ } }
    .hero .text .eng {
      font-size: 58px; 
            margin-top: 10px;}
      @media screen and (max-width: 768px) {
        .hero .text .eng {
          font-size: 48px; } }
    .hero .text .impact {
      margin-top: .5em;
      line-height: 1.2;
      font-size: 32px;
            margin-bottom: 15px; }
      @media screen and (max-width: 768px) {
        .hero .text .impact {
          font-size: 5.5vw; }
          .contact .hero .text .impact {
            font-size: 4.8vw; } }
  .hero .slick-dotted.slick-slider {
    margin-bottom: 0; }
  .hero .slick-dots {
    bottom: 15%;/*bottom: 30%;*/
    z-index: 1; }
    @media screen and (max-width: 1200px) {
      .hero .slick-dots {
        bottom: 15%;/*bottom: 25%;*/ }
        .contact .hero .slick-dots {
          bottom: 15%;/*bottom: 20%;*/ } }
    .hero .slick-dots li button {
      opacity: 1; }
      .hero .slick-dots li button:before {
        width: 12px;
        opacity: 1;
        height: 12px;
        font-size: 0;
        background: url(/img/circle.png) no-repeat center center/100%; }
    .hero .slick-dots li.slick-active button:before {
      border-radius: 100%;
      background: #fff;
      opacity: 1; }
  .hero .scroll {
    position: absolute;
    bottom: 5%;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    height: 20px;
    width: 20px;
    -webkit-animation: sdb 3.2s infinite;
            animation: sdb 3.2s infinite;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
    .hero .scroll img {
      width: 100%;
      height: auto; }

.midNav {
  background: #fff;
  height: 180px;
  text-align: center; }
  @media screen and (max-width: 768px) {
    .midNav {
      height: 204px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      flex-direction: column;}
      .corporate .midNav {
        height: 120px; } }
  .midNav ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    height: 65%; }
    @media screen and (max-width: 768px) {
      .midNav ul {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        height: 60%; }
        .corporate .midNav ul {
          -ms-flex-pack: distribute;
              justify-content: space-around;
          width: 90%; } }
    @media screen and (max-width: 768px) {
      .midNav ul li {
        width: calc(100% / 3);
        text-align: center; } }
    .midNav ul li a {
      display: block;
      padding: 10px;
      margin: 10px;
      font-size: 13px; }
      @media screen and (max-width: 768px) {
        .midNav ul li a {
          padding: 0;
          margin: 0;
          font-size: 12px; } }
      .midNav ul li a .img {
        width: 44px;
        height: 30px;
        text-align: center;
        margin: 0 auto 4px; }
        .midNav ul li a .img img {
          width: 100%;
          height: 100%;
          -o-object-fit: contain;
             object-fit: contain;
          font-family: "object-fit: contain;";
}
          .corporate .midNav ul li a .img img {
            max-height: 30px; }

.secTtl {
  text-align: center;
  font-size: 32px;
  margin-bottom: 1em; }
  @media screen and (max-width: 768px) {
    .secTtl { font-size: 24px; }
  }

.news, .recom, .productList {
  padding: 60px 0; }
  @media screen and (max-width: 768px) {
    .news, .recom, .productList {
      padding: 30px 0; } }

.news .moreBtn, .recomItem .content .moreBtn, .productListItem .content .moreBtn, .productMain .moreRead, .corporateNews .moreBtn, .recomBox .moreBtn, .midNav .moreBtn, .productList .moreBtn {
  font-size: 15px;
  position: relative;
  text-align: center;
  padding: 10px 20px;
  color: #005633;
  background: #fff;
  border: 1px solid;
  width: 300px;
  line-height: 1;
  display: block;
  margin: 0 auto; }
  .news .moreBtn:before, .recomItem .content .moreBtn:before, .productListItem .content .moreBtn:before, .productMain .moreRead:before, .corporateNews .moreBtn:before, .recomBox .moreBtn:before, .midNav .moreBtn:before, .productList .moreBtn:before {
    content: '→';
    position: absolute;
    top: 55%;
    -webkit-transform: translateY(-64%);
            transform: translateY(-64%);
    right: 10%;
    -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
    transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
  .news .moreBtn:hover:before, .recomItem .content .moreBtn:hover:before, .productListItem .content .moreBtn:hover:before, .productMain .moreRead:hover:before, .corporateNews .moreBtn:hover:before, .recomBox .moreBtn:hover:before, .midNav .moreBtn:hover:before, .productList .moreBtn:hover:before {
    -webkit-transform: translate(50%, -64%);
            transform: translate(50%, -64%); }

.news {
  display: block;
  background: #f1f1f1; }
  .newsIn {
    max-width: 850px; }
  .news .tabs {
    background: #fff;
    color: #4f5b61;
    margin-bottom: 40px; }
    @media screen and (max-width: 768px) {
      .news .tabs {
        margin-bottom: 20px; } }
    .news .tabs .tabItemWrap {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex; }
      @media screen and (max-width: 768px) {
        .news .tabs .tabItemWrap {
          overflow-x: scroll;
          -webkit-overflow-scrolling: touch; } }
    .news .tabs .tabItem {
      width: calc(100% / 4);
      min-width: 96px;
      height: 50px;
      -webkit-transition: all 0.3s;
      transition: all 0.3s;
      background: #005633;
      color: #fff;
      outline: 1px solid #fff;
      font-size: 13px;
      text-align: center;
      cursor: pointer;
      line-height: 1.1;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      padding: 0 .5em;
      font-weight: normal; }
      .contact .news .tabs .tabItem {
        background: #3393FF; }
      .news .tabs .tabItem span {
        width: 100%; }
      .news .tabs .tabItem:hover {
        opacity: .8; }
    .news .tabs .tabContent {
      display: none;
      width: 100%;
      -webkit-box-sizing: border-box;
              box-sizing: border-box; }
      .news .tabs .tabContentWrap {
        width: 100%; }
      .news .tabs .tabContent article {
        padding: 0 20px; }
        @media screen and (max-width: 768px) {
          .news .tabs .tabContent article {
            padding-right: 2px;
            padding-left: 10px; } }
        .news .tabs .tabContent article .articleItem {
          border-top: 1px solid #ccc; }
        .news .tabs .tabContent article:nth-of-type(1) .articleItem {
          border-top: 0; }
        .news .tabs .tabContent article:last-child {
          padding-bottom: 1px; }
      .news .tabs .tabContent .articleItem {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding-top: 20px;
        margin-bottom: 20px; }
        .news .tabs .tabContent .articleItem .img {
          width: 15%;
          position: relative;
          overflow: hidden;
          max-width: 100px;
          min-width: 80px; }
          .news .tabs .tabContent .articleItem .img:before {
            content: '';
            padding-top: 85%;
            display: block; }
          .news .tabs .tabContent .articleItem .img img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -webkit-transition: all 0.3s cubic-bezier(0.21, 0.47, 0.22, 0.99);
            transition: all 0.3s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
        .news .tabs .tabContent .articleItem:hover img {
          -webkit-transform: scale(1.05);
                  transform: scale(1.05); }
        .news .tabs .tabContent .articleItem .content {
          width: 84%;
          -webkit-box-sizing: border-box;
                  box-sizing: border-box;
          margin-left: 1em; }
          .news .tabs .tabContent .articleItem .content .info {
            font-size: 13px;
            margin-bottom: .8em;
            line-height: 20px; }
            @media screen and (max-width: 768px) {
              .news .tabs .tabContent .articleItem .content .info {
                margin-bottom: .2em; } }
            .news .tabs .tabContent .articleItem .content .info .date {
              margin-right: .5em; }
            .news .tabs .tabContent .articleItem .content .info .new {
              font-size: 10px;
              padding: 1px 6px;
              color: #fff;
              background: #f04a62;
              margin-right: .5em; }
          .news .tabs .tabContent .articleItem .content .title {
            margin-bottom: .8em; }
            @media screen and (max-width: 768px) {
              .news .tabs .tabContent .articleItem .content .title {
                margin-bottom: .2em; } }
          .news .tabs .tabContent .articleItem .content .shops {
            /*display: -webkit-box;
            display: -ms-flexbox;
            display: flex;*/
            display: block; }
            .news .tabs .tabContent .articleItem .content .shops .shop {
              margin-right: 1em;margin-top:5px;
              padding: 1px 6px;
              border: 1px solid;
              font-size: 10px;display: inline-block; }
    .news .tabs .tabContent.active {
      display: block; }
    .news .tabs .tabItem.active {
      background: #fff;
      color: #005633; }
  .contact .news .moreBtn, .midNav .moreBtn  {
    color: #3393FF;
    border-color: #3393FF; }
  .contact .recomBox .moreBtn {
    color: #3393FF;
    border-color: #3393FF;margin-top:20px; }

@media screen and (max-width: 768px) {
    .news .tabs .tabContent .articleItem .content .shops {
        display: block;
    }
    .news .tabs .tabContent .articleItem .content .shops .shop {
        margin-top: 5px;
        display: inline-table;
    }
}

.recom, .productList {
  width: 100%; }
  .recomBox, .productListBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
.corporate .recomBox {
    background-color: #fff;
}
  .recomItem, .productListItem {
    width: calc(100% /3);
    margin-bottom: 60px;
    display: block;
    position: relative;
}
    @media screen and (max-width: 768px) {
        .midNav .moreBtn {
            margin-top: 15px;
            width: 240px;
        }
      .recomItem, .productListItem {
        margin-bottom: 30px;
        width: 100%; } }
    .recomItem .img, .productListItem .img {
      overflow: hidden;
      position: relative; }
      .recomItem .img:before, .productListItem .img:before {
        display: block;
        content: '';
        padding-top: 75%; }
      .recomItem .img img, .productListItem .img img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto;
        -o-object-fit: cover;
           object-fit: cover;
        -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
        transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
    .recomItem:hover .img img, .productListItem:hover .img img {
      -webkit-transform: scale(1.05);
              transform: scale(1.05); }
.contact .recomItem .img img,
.contact .productListItem .img img {
    height: auto;
    right: 0;
    bottom: 0;
    margin: auto;
}

.corporate .recomItem .img img {
    height: auto;
    right: 0;
    bottom: 0;
    margin: auto;
}

.glasses .recomItem a, .glasses .productListItem a {
    display: flex;
    flex-direction: column;
    position: relative;
    height: 100%;
}
    .recomItem .content, .productListItem .content {
      background: #fff;
      width: 90%;
      margin: 0 auto;
      margin-top: -30px;
      position: relative;
      z-index: 1;
      padding: 1.5em;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
}
.corporate .recomItem .content {
    z-index: 0;
}
.recomItem a .posBottom, .productListItem a .posBottom {
    margin-top: auto;
    position: relative;
}
      .recomItem .content .title, .productListItem .content .title {
        font-size: 16px;
        font-weight: bold;
        margin-bottom: .1em; }
      .recomItem .content p, .productListItem .content p {
        margin-bottom: 2em; }
.recomItem .moreBtn, .productListItem .moreBtn {
    font-size: 13px;
    width: 30%;
    position: absolute;
    bottom: 0;
    left: calc(35% - 1.5em);
    z-index: 1;
}
.recomItem .content .moreBtn, .productListItem .content .moreBtn {
    font-size: 13px;
    width: 30%;
    position: absolute;
    bottom: 0;
    left: calc(35% - 1.5em);
    z-index: 1;
}

.footer {
  background: url(/img/footer-bg.png) no-repeat center center/100% 100%;
  background-size: cover;
  position: relative; }
  .footer:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5); }
  .footerIn {
    padding: 60px 0;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 768px) {
      .footerIn {
        padding-bottom: 120px;
        padding-top: 20px; } }
  .footer .footerNav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    color: #fff; }
    @media screen and (max-width: 768px) {
      .footer .footerNav {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        width: 90%;
        max-width: 300px;
        margin: 0 auto; } }
    .footer .footerNav .col {
      margin-right: 120px; }
      @media screen and (max-width: 768px) {
        .footer .footerNav .col {
          width: 100%;
          margin-right: 0;
          border: 1px solid white;
          padding: 0 1em;
          margin-top: -1px;
          -webkit-box-sizing: border-box;
                  box-sizing: border-box; } }
      .footer .footerNav .col:last-child {
        margin-right: 0; }
      .footer .footerNav .col:nth-of-type(1) .img {
        max-width: 153px; }
      .footer .footerNav .col:nth-of-type(2) .img {
        max-width: 155px; }
      .footer .footerNav .col:nth-of-type(3) .img {
        max-width: 200px; }
    .footer .footerNav .open {
      width: 16px;
      height: 16px;
      position: absolute;
      right: 50%;
      -webkit-transform: translate(140px, 16px);
              transform: translate(140px, 16px);
      display: none; }
      @media screen and (max-width: 768px) {
        .footer .footerNav .open {
          display: block; } }
      .footer .footerNav .open img {
        width: 100%;
        height: auto; }
    .footer .footerNav .img {
      display: block;
      margin-bottom: 20px;
      margin-top: 20px; }
      .footer .footerNav .col:nth-of-type(1) .img:nth-of-type(1) {
          margin-left: -30px;
          margin-top: 17px; }
      .footer .footerNav .col:nth-of-type(3) .img {
        margin-top: 13px; }
      @media screen and (max-width: 768px) {
        .footer .footerNav .img {
          text-align: center;
          cursor: pointer;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
          min-height: 45px;
          position: relative;
          max-width: 230px;
          margin: 0 auto; }
          .footer .footerNav .col:nth-of-type(1) .img:nth-of-type(1) {
              margin-left: auto;
              margin-top: 0; }
          .footer .footerNav .col:nth-of-type(3) .img {
              margin-top: 0; }
}
      @media screen and (max-width: 768px) {
        .footer .footerNav .img.out {
          position: absolute;
          bottom: 2%;
          left: 50%;
          margin-bottom: 20px;
          -webkit-transform: translateX(-50%);
                  transform: translateX(-50%);
          max-width: 162px; }
          .footer .footerNav .img.out:after {
            display: none; } }
      .footer .footerNav .img img {
        width: 100%;
        height: auto; }
    @media screen and (max-width: 768px) {
      .footer .footerNav ul {
        display: none;
        margin-top: 10px; } }
    .footer .footerNav ul li {
      position: relative;
      margin-bottom: 5px; }
      .footer .footerNav ul li:before {
        content: '・';
        font-size: 12px; }
  .footer .copy {
    line-height: 70px;
    font-size: 12px;
    text-align: center;
    background: #000;
    color: #fff;
    position: relative;
    z-index: 1; }

.footer #toTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
    opacity: 0.8;
    display: none;
}
.footer #toTop a {
    display: block;
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 40px;
    text-align: center;
    line-height: 40px;
    border: 1px solid #ccc;
}
@media screen and (max-width: 768px) {
    .footer #toTop {
        bottom: 10px;
        right: 10px;
    }
    .footer #toTop a {
        width: 30px;
        height: 30px;
        border-radius: 30px;
        line-height: 30px;
    }
}
.pageTop {
  height: 450px;
  position: relative;
  margin-bottom: 20px; }
  .pageTop.short {
    height: 250px; }
  .pageTop.veryShort {
    height: 200px; }
  @media screen and (max-width: 768px) {
    .pageTop, .pageTop.short {
      height: auto; } }
  .pageTop .img {
    height: 100%;
    position: relative; }
    @media screen and (max-width: 768px) {
      .pageTop .img {
        height: 200px; } }
    .pageTop .img:after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: rgba(0, 0, 0, 0.3); }
    .pageTop .img img {
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover; }
  .pageTop .content {
    position: absolute;
    width: 100%;
    top: 50%;
    text-align: center;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    z-index: 1;
    color: #fff; }
 .pageTop.veryShort .content {
      top: 60%; }
    @media screen and (max-width: 768px) {
        .corporate .pageTop.veryShort .img img {
            width: auto;
            margin-left: -20%;
        }
      .pageTop .content {
        position: relative;
        -webkit-transform: translateY(0);
                transform: translateY(0);
        top: auto; } }
    .pageTop .content .title {
      font-size: 30px;
      padding-bottom: 2em;
      position: relative; }
      @media screen and (max-width: 768px) {
        .pageTop.veryShort .content {
            top: auto; }
        .pageTop .content .title {
          position: absolute;
          top: -134px;
          width: 100%;
          text-align: center;
          font-size: 26px; } }
      .pageTop .content .title:after {
        content: '';
        position: absolute;
        bottom: 1em;
        width: 50px;
        height: 1px;
        background: #fff;
        left: 50%;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%); }
    .pageTop .content .text {
      font-size: 18px; }
      @media screen and (max-width: 768px) {
        .pageTop .content .text {
          font-size: 14px;
          color: #333;
          padding: 1.5em;
          /*font-family: "Hiragino Kaku Gothic ProN", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
          　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
          text-align: left; }
          .pageTop.short .content .text {
              padding-bottom: 0;
          }
          .pageTop.short .content .text p br {
              display: none;
          }
}

.searchArea form .searchBox, .blogSearch .searchBox {
  padding: .5em;
  border: solid 1px #aaa;
  max-width: 420px;
  margin: 0 auto;
  width: 96%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 40px; }
  @media screen and (max-width: 768px) {
    .searchArea form .searchBox, .blogSearch .searchBox {
      margin-bottom: 20px; } }
  .searchArea form .searchBox .box, .blogSearch .searchBox .box {
    border: none;
    width: 100%;
    outline: none; }
  .searchArea form .searchBox .btn, .blogSearch .searchBox .btn {
    width: 20px;
    height: 20px;
    background: url(/img/search.png) no-repeat center center/100%; }

.searchArea {
  border: 1px solid #eee;
  border-radius: 4px;
  padding: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin-bottom: 0px;
  padding-bottom: 20px; }
  .searchArea.blog {
    margin-bottom: 20px; }
  @media screen and (max-width: 768px) {
    .searchArea {
      padding: 16px;
      padding-bottom: 8px; } }
  .searchArea form .check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .searchArea form .check .title {
      min-width: 50px;
      display: inline-block;
      margin-right: .5em;
      font-size: 16px; }
      @media screen and (max-width: 768px) {
        .searchArea form .check .title {
          font-size: 14px;
          margin-right: 0; } }
      .searchArea form .check .title:after {
        content: '：'; }
    .searchArea form .check input {
      opacity: 0;
      position: absolute; }
      .searchArea form .check input:checked + label {
        background: #005633;
        color: #fff;
        border-color: #005633; }
    .searchArea form .check label {
      cursor: pointer;
      border: 1px solid #666;
      margin-bottom: 10px;
      font-size: 12px;
      padding: 4px;
      display: inline-block;
      margin-right: .5em; }
    .searchArea form .check label:hover{opacity: .7;}
      @media screen and (max-width: 768px) {
        .searchArea form .check label {
          font-size: 11px;
          padding: 2px; } }

.productList .display {
  width: 96%;
  margin: 0 auto 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .productList .display .title {
    min-width: 50px;
    margin-top: 5px; }
  .productList .display .box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .productList .display .box .item {
      background: #005633;
      color: #fff;
      margin-right: .5em;
      margin-bottom: 10px;
      padding: 4px;
      font-size: 12px; }
      @media screen and (max-width: 768px) {
        .productList .display .box .item {
          font-size: 11px; } }

.pager {
  margin-top: -20px; }
  @media screen and (max-width: 768px) {
    .pager.mt {
      margin-top: 20px; } }
  .pager ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    .pager ul li a {
      border: 1px solid #ccc;
      background: #fff;
      height: 40px;
      min-width: 40px;
      padding: 0 10px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      text-align: center;
      margin-right: .7em;
      display: block;
      line-height: 40px;
      -webkit-transition: all 0.3s;
      transition: all 0.3s; }
      .pager ul li a:hover {
        border-color: #005633; }
    .pager ul li span {
      display: block;
      text-align: center;
      margin-right: .7em;
      min-width: 0; }
    .pager ul li.now a {
      background: #005633;
      color: #fff;
      border-color: #005633; }

.contact .pager ul li.now a {
      background: #3393FF;
      color: #fff;
      border-color: #3393FF; }
.corporate .pager ul li.now a {
      background: #603813;
      color: #fff;
      border-color: #603813; }


.breadcrumb {
  padding-top: .5em; }
  .breadcrumb ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; }
    .breadcrumb ul li {
      position: relative;
      margin-right: .5em;
      font-size: 12px; }
      @media screen and (max-width: 768px) {
        .breadcrumb ul li {
          font-size: 10px; } }
      .breadcrumb ul li:after {
        content: ' >'; }
      .breadcrumb ul li:last-child:after {
        display: none; }
      .breadcrumb ul li a {
        text-decoration: underline; }

.pageHeader .pageTitle {
  text-align: center; }
  .pageHeader .pageTitle .title {
    font-size: 24px;
    text-align: center;
    margin-top: 40px;
    position: relative;
    display: inline-block;
    max-width: 600px;
    padding-bottom: .9em;
    margin-bottom: 0; }
@media screen and (max-width: 768px) and (max-width: 768px) {
  .pageHeader .pageTitle .title {
    font-size: 22px; } }

    .pageHeader .pageTitle .title:before {
      position: absolute;
      bottom: .5em;
      width: 460px;
      height: 1px;
      background: #333;
      content: '';
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%); }
.pageHeader .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }
.pageHeader .cat {
  text-align: center;
  margin-top: 60px; }
  @media screen and (max-width: 768px) {
    .pageHeader .cat {
      margin-top: 20px; } }
  .pageHeader .cat a {
    background: #005633;
    color: #fff;
    font-size: 13px;
    padding: 2px 2em; }

.contact .pageHeader .cat a {
    background: #3393FF;
}
.corporate .pageHeader .cat a {
    background: #603813;
}

  .pageHeader .cat + .pageTitle .title {
    /*margin-top: 30px;*/ }
    @media screen and (max-width: 768px) {
      .pageHeader .cat + .pageTitle .title {
        margin-top: 20px; } }
.pageHeader .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 60px; }
  @media screen and (max-width: 768px) {
    .pageHeader .tags {
      margin-bottom: 20px;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; } }
  .pageHeader .tags .item {
    border: 1px solid;
    padding: 2px 4px;
    font-size: 12px;
    margin-right: .5em; }
    @media screen and (max-width: 768px) {
      .pageHeader .tags .item {
        margin-bottom: 10px; } }

.sns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex; }
  .sns li {
    margin-right: 2px; }
.sns li .fb-share-button span {
    vertical-align: top !important;
    margin-right: 1px;
}

.productSlider {
  max-width: 900px;
  margin-bottom: 60px; }
  @media screen and (max-width: 768px) {
    .productSlider {
      margin-bottom: 30px; } }
  .productSlider .mainSlider {
    position: relative;
    margin-bottom: 10px; }
    .productSlider .mainSliderItem img {
      width: 100%;
      height: auto; }
  .productSlider .navSlider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /*align-items: center;*/
}
    .productSlider .navSliderItem {
      max-width: 140px;
      /*border: 1px solid #ccc*/;
      margin-right: 8px; }
      .productSlider .navSliderItem img {
        width: 100%;
        height: auto; }
  .productSlider .slick-next,
  .productSlider .slick-prev {
    height: 60px;
    width: 40px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }
    .productSlider .slick-next:hover,
    .productSlider .slick-prev:hover {
      opacity: .8; }
    @media screen and (max-width: 768px) {
      .productSlider .slick-next,
      .productSlider .slick-prev {
        width: 30px;
        height: 45px; } }
    .productSlider .slick-next:before,
    .productSlider .slick-prev:before {
      display: none; }
  .productSlider .slick-next {
    right: 0; }
    .productSlider .slick-next:after {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      content: '';
      background: url(/img/slider-next.png) no-repeat center center/100%; }
    .productSlider .slick-next:hover {
      background: url(/img/slider-next.png) no-repeat center center/100%; }
  .productSlider .slick-prev {
    left: 0;
    z-index: 1; }
    .productSlider .slick-prev:after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      bottom: 0;
      background: url(/img/slider-prev.png) no-repeat center center/100%; }
    .productSlider .slick-prev:hover {
      background: url(/img/slider-prev.png) no-repeat center center/100%; }

.productMain .contact .btn, .handlingShop .btnBox .btn, .cardNav .box .item .moreBtn, .blogNav a {
  position: relative; }
  .productMain .contact .btn:before, .handlingShop .btnBox .btn:before, .cardNav .box .item .moreBtn:before, .blogNav a:before {
    content: '→';
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    right: 16px; }

.productMain {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 16px;
  margin-bottom: 50px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }
  @media screen and (max-width: 768px) {
    .productMain {
      margin-bottom: 30px; } }
  .productMain .text {
    width: 60%; }
    @media screen and (max-width: 1000px) {
      .productMain .text {
        width: 100%; } }
  .productMain .contact {
    width: 36%; }
    .productMain .contact .contactIn {
      padding: 30px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      border: 1px solid #ccc; }
    @media screen and (max-width: 1000px) {
      .productMain .contact {
        width: 100%; } }
    .productMain .contact .btn {
      display: block;
      width: 100%;
      text-align: center;
      padding: .9em 0;
      background: #005633;
      color: #fff;
      position: relative;
      margin: 0 auto 1em;
      max-width: 400px; }
  .productMain .moreRead {
    color: #333;
    border-color: #ccc;
    width: 100%;
    display: none;
    margin: 10px 0; }
    @media screen and (max-width: 768px) {
      .productMain .moreRead {
        display: block; } }
    .productMain .moreRead:before {
      content: '↓'; }
    .productMain .moreRead span:nth-of-type(2) {
      display: none; }
    .productMain .moreRead.active:before {
      content: '↑'; }
    .productMain .moreRead.active span:nth-of-type(1) {
      display: none; }
    .productMain .moreRead.active span:nth-of-type(2) {
      display: block; }
    .productMain .moreRead.active + .hideText {
      display: block; }
  @media screen and (max-width: 768px) {
    .productMain .hideText {
      display: none; } }

.majorProducts .title, .handlingShop .title {
  font-size: 30px;
  text-align: center; }
  .majorProducts .title span, .handlingShop .title span {
    background: #fff;
    padding: 0 .2em; }
    @media screen and (max-width: 768px) {
      .majorProducts .title span, .handlingShop .title span {
        padding: 0; } }
  @media screen and (max-width: 768px) {
    .majorProducts .title, .handlingShop .title {
      font-size: 26px;
      margin-bottom: -8px; } }

.majorProducts {
  margin-bottom: 50px; }
  @media screen and (max-width: 768px) {
    .majorProducts {
      margin-bottom: 10px; } }
  .majorProducts .box {
    margin-top: -30px;
    border: 1px solid #ccc;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    padding: 60px 90px 50px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    @media screen and (max-width: 768px) {
      .majorProducts .box {
        padding: 20px;
        margin-top: 0;
        border: 0; } }
    .majorProducts .box .item {
      width: 30%; }
      @media screen and (max-width: 768px) {
        .majorProducts .box .item {
          width: 100%;
          margin-bottom: 1.5em; } }
      .majorProducts .box .item .img {
        /*border: solid 1px #ccc;*/
        margin-top:.7em;
        margin-bottom: .5em; }
        .majorProducts .box .item .img img {
          width: 100%;
          height: auto; }
      .majorProducts .box .itemTitle {
        text-align: center;
        font-size: 16px; }

.handlingShop {
  margin-bottom: 50px; }
  @media screen and (max-width: 768px) {
    .handlingShop {
      margin-bottom: 30px; } }
  .handlingShop .title {
    margin-bottom: 1em; }
    @media screen and (max-width: 768px) {
      .handlingShop .title {
        margin-bottom: 6px; } }
  .handlingShop p {
    font-size: 16px; }
  .handlingShop .btnBox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
    @media screen and (max-width: 768px) {
      .handlingShop .btnBox {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column; } }
    .handlingShop .btnBox .btn {
      display: block;
      margin: 20px;
      max-width: 370px;
      width: 100%;
      text-align: center;
      background: #005633;
      color: #fff;
      padding: 18px 0;
      font-size: 14px; }
      @media screen and (max-width: 768px) {
        .handlingShop .btnBox .btn {
          margin: 10px 0;
          max-width: 100%; } }

.cardNav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 70px; }
  @media screen and (max-width: 768px) {
    .cardNav {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      margin-top: 24px; } }
  .cardNav .box {
    width: 100%;
    position: relative;
    height: 450px;
    padding: 25px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; }
    @media screen and (max-width: 768px) {
      .cardNav .box {
        height: 375px; } }
    .cardNav .box .img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
      .cardNav .box .img:after {
        background: rgba(0, 0, 0, 0.5);
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0; }
      .cardNav .box .img img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover; }
    .cardNav .box .item {
      background: rgba(255, 255, 255, 0.85);
      display: block;
      padding: 40px;
      width: 100%;
      max-width: 550px;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      height: 100%;
      position: relative;
      font-size: 16px; }
      @media screen and (max-width: 768px) {
        .cardNav .box .item {
          padding: 20px;
          margin: 0 auto; } }
      @media screen and (max-width: 480px) {
        .cardNav .box .item .logo {
          margin: 20px 0; } }
      .cardNav .box .item .logo img {
        width: 100%;
        height: auto; }
        @media screen and (max-width: 480px) {
          .cardNav .box .item .logo img {
            -webkit-transform: scale(1.4);
                    transform: scale(1.4); } }
      .cardNav .box .item .moreBtn {
        display: block;
        max-width: 290px;
        width: 100%;
        position: absolute;
        bottom: 40px;
        left: 50%;
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
        background: #3393FF;
        line-height: 45px;
        text-align: center;
        color: #fff; }
        @media screen and (max-width: 768px) {
          .cardNav .box .item .moreBtn {
            max-width: 90%;
            bottom: 20px; } }
    .cardNav .box:nth-of-type(1) .item {
      margin-left: auto; }
      .cardNav .box:nth-of-type(1) .item .moreBtn {
        background: #005633; }

.corporateNews {
  margin-bottom: 90px; }
  @media screen and (max-width: 768px) {
    .corporateNews {
      margin-bottom: 60px; } }
  .corporateNews .secTtl {
    margin-top: 1em; }
  .corporateNewsList {
    max-width: 800px;
    margin-bottom: 60px; }
    @media screen and (max-width: 768px) {
      .corporateNewsList {
        margin-bottom: 30px; } }
    .corporateNewsList article a {
      padding: 1em 0;
      border-bottom: 1px solid #ccc;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99);
      transition: all 0.6s cubic-bezier(0.21, 0.47, 0.22, 0.99); }
      @media screen and (max-width: 768px) {
        .corporateNewsList article a {
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column; } }
      .corporateNewsList article a:hover {
        background: #f9f9f9; }
      .corporateNewsList article a .date {
        min-width: 90px; }

.blogMain {
  margin-top: 30px;
  margin-bottom: 80px;max-width:900px; }
  @media screen and (max-width: 768px) {
    .blogMain {
      margin-top: 20px;
      margin-bottom: 60px; } }
  .blogMain .mb {
    margin-bottom: 2em; }
  .blogMain .img {
    width: 50%;
    margin-right: 2em;
    /*float: left;*/ }
    @media screen and (max-width: 768px) {
      .blogMain .img {
        width: 100%; } }
    .blogMain .img img {
      width: 100%;
      height: auto; }
  .blogMain + div, .blogMain section {
    clear: both; }

.blogNav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }
  .blogNav a {
    line-height: 65px;
    background: #005633;
    color: #fff;
    text-align: center;
    width: 48%;
    max-width: 270px;
    margin: 40px 20px; }
    @media screen and (max-width: 768px) {
      .blogNav a {
        line-height: 50px;
        margin: 20px 10px; } }
    .blogNav a:nth-of-type(1):before {
      content: '←';
      right: auto;
      left: 16px; }

.contact .blogNav a {
    background: #3393FF;
}

.corporate .blogNav a {
    background: #603813;
}

.blogSearch .checkBoxWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 850px;
  margin: 0 auto 20px; }
  @media screen and (max-width: 768px) {
    .blogSearch .checkBoxWrap {
      overflow-x: scroll;
      margin-bottom: 10px; } }
  .blogSearch .checkBoxWrap input {
    opacity: 0;
    position: absolute; }
    .blogSearch .checkBoxWrap input:checked + label {
      background: #fff;
      color: #005633;
      border-color: #005633; }
  .blogSearch .checkBoxWrap label {
    border: 1px solid #005633;
    margin-right: 1px;
    margin-bottom: 10px;
    font-size: 13px;
    display: inline-block;
    height: 50px;
    background: #005633;
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
    @media screen and (max-width: 768px) {
      .blogSearch .checkBoxWrap label {
        font-size: 11px;
        padding: 2px;
        height: 40px;
        min-width: 96px; } }

/*-------------------------------
	Corporate pages
-------------------------------*/
.corpNav {
    max-width: 800px;
    margin: 50px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.corpNav li {
    width: 32%;
}
.corpNav.four li {
    width: 24%;
}
.corpNav li a {
    position: relative;
    display: block;
    border: #ddd 1px solid;
    width: 100%;
    text-align: center;
    padding: 10px 0;
}
.corpNav li a i {
    position: absolute;
    top: 13px;
    right: 15px;
}
.corpNav li a:hover {
    opacity: 1;
    background-color: #eee;
}
.corpNav li a.cr {
    cursor: inherit;
    background-color: #603813;
    color: #fff;
}
.corpNav li a.cr:hover {
    opacity: 1;
}
@media screen and (max-width: 420px) {
    .corpNav {
        margin: 30px auto 50px;
    }
    .corpNav li a i {
        right: 10px;
    }
    .corporate .corpNav li a {
        font-size: 12px;
    }
    .corporate .corpNav li a i {
        right: 5px;
    }
}
@media screen and (max-width: 320px) {
    .corporate .corpNav li a {
        font-size: 11px;
    }
    .corporate .corpNav li:first-child a {
        letter-spacing: -1px;
    }
}
/*2019.08.13*/
.shopNav {
    width: 96%;
    max-width: 1200px;
    margin: 50px auto 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.shopNav li a {
    position: relative;
    display: block;
    border: #ddd 1px solid;
    width: 180px;
    text-align: center;
    padding: 10px 0;
    margin-top: 2px;
}
.shopNav li a i {
    position: absolute;
    top: 25px;
    right: 10px;
}
.shopNav li a:hover {
    opacity: 1;
    background-color: #eee;
}
.shopNav li a.cr {
    cursor: inherit;
    background-color: #603813;
    color: #fff;
}
.shopNav li a.cr:hover {
    opacity: 1;
}
@media screen and (max-width: 420px) {
    .shopNav {
        margin: 30px auto 10px;
    }
    .shopNav li {
        width: 49%;
    }
    .shopNav li a {
        width: 100%;
    }
    .corporate .shopNav li {
        width: 100%;
    }
    .corporate .shopNav li a {
        font-size: 13px;
        width: 100%;
    }
}
/*2019.08.13ここまで*/

table.corporateInfo {
    max-width: 800px;
    margin: 0 auto 30px; /*2019.08.14*/
}
table.corporateInfo th,
table.corporateInfo td {
    vertical-align: top;
    border-bottom: #ccc 1px solid;
    padding: 20px 0;
}
table.corporateInfo th {
    width: 20%;
}
table.corporateInfo td {
    width: 80%;
}
table.corporateInfo td a {
    text-decoration: underline;
}
table.corporateInfo td a:hover {
    text-decoration: none;
}
@media screen and (max-width: 768px) {
    table.corporateInfo {
        margin-top: 0;
        margin-bottom: 20px; /*2019.08.14*/
    }
    table.corporateInfo th,
    table.corporateInfo td {
        display: block;
        width: 100%;
    }
    table.corporateInfo th {
        font-weight: bold;
        border-bottom: none;
        padding-bottom: 0;
    }
    table.corporateInfo tr:first-child th {
        padding-top: 0;
    }
}
/*2019.08.14*/
div.hakken {
    text-align: center;
    margin-bottom: 50px;
}
div.hakken img {
    width: 320px;
    height: auto;
    display: block;
    margin: 0 auto 10px;
}
div.hakken.engage img {
    width: 200px;
}
div.hakken a span {
    text-decoration: underline;
}
div.hakken a:hover span {
    text-decoration: none;
}
@media screen and (max-width: 768px) {
    div.hakken {
        width: 96%;
        margin: 0 auto 30px;
    }
    div.hakken img {
        width: 100%;
    }
}
/*2019.08.14ここまで*/
.corporateContent .box {
    max-width: 800px;
    margin: 50px auto;
}
@media screen and (max-width: 768px) {
    .corporateContent .box {
        margin-top: 30px;
    }
}
.corporateContent h2 {
    text-align: center;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.corporateContent.telContact h2 {
    margin-top: 60px;
}
.corporateContent .box h3 {
    font-size: 24px;
    padding-bottom: 10px;
    border-bottom: #ddd 1px solid;
    margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
    .corporateContent .box h3 {
        margin-bottom: 20px;
    }
}
.corporateContent .box p {
    margin-bottom: 20px;
    line-height: 2em;
}
.corporateContent .box strong {
    font-size: 18px;
}
.corporateContent .box p.pName {
    text-align: right;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.corporateContent .box p.pName span {
    font-size: 20px;
}
main .shopList:nth-child(odd) {
    background-color: #f1f1f1;
}
.corporate main .shopList:nth-child(odd) {
    background-color: #fff;
}
.shopListWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 50px 0;
}
.detail .shopListWrapper {
    padding-top: 0;
}
.shopListText,
.shopListMap {
    width: 48%;
}
@media screen and (max-width: 768px) {
    .shopListWrapper {
        display: block;
        padding: 50px 0;
    }
    .shopListText,
    .shopListMap {
        width: 100%;
    }
}
/*2019.08.13*/
.shopListGmap {
    width: 96%;
    max-width: 960px;
    height: 500px;
    margin: 0 auto 60px;
}
@media screen and (max-width: 768px) {
    .shopListWrapper {
        display: block;
        padding: 30px 0 20px;
    }
    .shopListText,
    .shopListMap {
        width: 100%;
    }
    .shopListGmap {
        height: 400px;
        margin-bottom: 30px;
    }
}
/*2019.08.13ここまで*/
ul.tagList {
    display: flex;
    flex-wrap: wrap; /*2019.08.13*/
    border-bottom: #ccc 1px solid; /*2019.08.13*/
    margin-bottom: 20px;
}
ul.tagList li {
    margin-right: .5em;
    margin-bottom: 10px; /*2019.08.13*/
}
ul.tagList li span {
    border: 1px solid #666;
    background-color: #fff;
    font-size: 12px;
    padding: 4px;
}
ul.tagList li a {
    display: block;
}
@media screen and (max-width: 320px) {
    ul.tagList li {
        margin-right: .3em;
    }
    ul.tagList li span {
        font-size: 11px;
    }
}
/*2019.08.13*/
.shopIcon img {
    width: auto;
    height: 15px;
    margin-left: 5px;
    margin-right: 7px;
}
.shopIcon img.large {
    width: auto;
    height: 18px;
}
.shopListText h2 {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    padding-bottom: 10px;
    position: relative;
}
.shopListText h2.newopen {
    padding-left: 65px;
    padding: 15px 0 20px 65px;
}
.shopListText h2.newopen::before {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 10px;
    width: 60px;
    height: 60px;
    background: url("img/icon-newopen.png") no-repeat;
    background-size: 60px 60px;
}
@media screen and (max-width: 768px) {
    .shopListText h2.newopen {
        padding: 5px 0 10px 65px;
    }
    .shopListText h2.newopen::before {
        top: 7px;
    }
}
/*2019.08.13ここまで*/
.shopListText p {
    margin-bottom: 20px;
}
.shopListMap p {
    font-size: 13px;
    line-height: 1.6em;
}
a.toDetail {
    display: block;
    position: relative;
    width: 240px;
    color: #fff;
    background-color: #603813;
    text-align: center;
    padding: 10px 0;
    margin-bottom: 10px;
}
.glasses a.toDetail {
    background-color: #005633;
}
.contact a.toDetail {
    background-color: #3393FF;
}
a.toDetail i {
    position: absolute;
    top: 13px;
    right: 15px;
}
a.toDetail:hover {
    opacity: 0.7;
}

.sapporolp {
    background-color: #58c03f;
}



@media screen and (max-width: 768px) {
    a.toDetail {
        margin: 0 auto 15px;
    }

    a.toDetail.lapsille {

    }
}
.corporate .pageHeader .pageTitle .title {
    font-size: 28px;
}
/*2019.08.13*/
.corporate .pageHeader .pageTitle .title.newopen {
    position: relative;
    padding-left: 65px;
}
.corporate .pageHeader .pageTitle .title.newopen::after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: 20px;
    width: 60px;
    height: 60px;
    background: url("img/icon-newopen.png") no-repeat;
    background-size: 60px 60px;
}
@media screen and (max-width: 768px) {
    .corporate .pageHeader .pageTitle .title.newopen {
        text-align: left;
    }
    .corporate .pageHeader .pageTitle .title.newopen::after {
        top: 7px;
    }
}
/*2019.08.13ここまで*/
.corporate .secTtl {
    font-size: 28px;
}
@media screen and (max-width: 768px) {
    .corporate .secTtl {
        font-size: 24px;
    }
}
h3.lead {
    text-align: center;
    font-size: 24px;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    margin-bottom: 30px;
}
.corporateContent p.explain {
    max-width: 900px;
    margin: 0 auto 20px;
}
.detail .shopListText {
    width: 38%;
}
.detail .shopListMap {
    width: 58%;
}
.shopListText p.access {
    border: 1px solid #ccc;
    padding: 1em;
}
ul.snsBtn {
    max-width: 900px;
    margin: 0 auto 30px;;
    display: flex;
    justify-content: flex-end;
}
ul.snsBtn li {
    margin-left: 10px;
}
@media screen and (max-width: 768px) {
    .detail .shopListText, .detail .shopListMap {
        width: 100%;
    }
    ul.snsBtn {
        margin-bottom: 20px;
    }
}
.corporate .news .moreBtn,
.corporate .recomItem .content .moreBtn,
.corporate .corporateNews .moreBtn {
    color: #603813;
}
.corporateContent.telContact .box {
    display: flex;
    max-width: 1000px;
    justify-content: space-between;
    margin-bottom: 70px;
}
.telContactLogo {
    width: 35%;
}
.telContactLogo img {
    width: 80%;
    height: auto;
}
.telContactText {
    width: 65%;
}
@media screen and (max-width: 768px) {
    .corporateContent.telContact .box {
        display: block;
    }
    .telContactLogo, .telContactText {
        width: 100%;
    }
    .telContactLogo {
        text-align: center;
        margin-bottom: 20px;
    }
    .telContactLogo img {
        width: 70%;
    }
}

table.contactForm {
    max-width: 800px;
    margin: 0 auto 50px;
}
table.contactForm th,
table.contactForm td {
    vertical-align: top;
    border-bottom: #ccc 1px solid;
    padding: 20px 0;
}
table.contactForm th {
    width: 40%;
}
table.contactForm td {
    width: 73%; /*2019.08.14*/
}
table.contactForm td a {
    text-decoration: underline;
}
table.contactForm td a:hover {
    text-decoration: none;
}
@media screen and (max-width: 768px) {
    table.contactForm {
        margin-top: 0;
    }
    table.contactForm th,
    table.contactForm td {
        display: block;
        width: 100%;
    }
    table.contactForm th {
        font-weight: bold;
        border-bottom: none;
        padding-bottom: 0;
    }
    table.contactForm tr:first-child th {
        padding-top: 0;
    }
}
span.required {
    font-size: 12px;
    padding: 3px;
    color: #fff;
    border: 1px solid #603813;
    background-color: #603813;
}
span.any {
    font-size: 12px;
    padding: 3px;
    color: #603813;
    border: 1px solid #603813;
    background-color: #fff;
}
.formBtn {
    text-align: center;
}
.formBtn input {
    padding: 10px 20px;
    color: #fff;
    border: 1px solid #603813;
    background-color: #603813;
}

.captcha {
    text-align: center;
}

.captcha .g-recaptcha {
    margin-left: 30%;
    margin-bottom: 30px;
}

/*-------------------------------
	Hearing aid
-------------------------------*/
.messageBox {
    max-width: 800px;
    margin: 50px auto;
    text-align: center;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 18px;
}
.messageBox p:first-child {
    margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
    .messageBox {
        margin: 30px 10px;
        text-align: left;
        font-size: 16px;
    }
}
.maker {
    padding: 50px 0;
    background-color: #f1f1f1;
}
/*2019.08.18*/
.makerWrapper {
    width: 700px;
    margin: 0 auto;
}
.makerObi {
    background-color: #011eb8;
    color: #fff;
    padding: 10px 10px 10px 100px;
    position: relative;
    margin-top:5px;
    margin-bottom:5px;    
}
.makerObi::before {
    content: " ";
    width: 80px;
    height: 64px;
    position: absolute;
    top: 20px; left: 10px;
    background: url("img/hearing_panasonic.png") no-repeat left top;
    background-size: cover;
}

.makerObi.beltone {
    background-color: #008080;
}
.beltone::before {
    content: " ";
    width: 80px;
    height: 80px;
    position: absolute;
    top: 13px; left: 10px;
    background: url("img/hearing_beltone.png") no-repeat left top;
    background-size: cover;
}

.makerObi.unitron {
    background-color: #008080;
}
.unitron::before {
    content: " ";
    width: 80px;
    height: 80px;
    position: absolute;
    top: 13px; left: 10px;
    background: url("img/hearing_unitron.png") no-repeat left top;
    background-size: cover;
}

.makerObi h3 {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 20px;
    margin-bottom: 5px;
}
.makerObi span.round {
    display: inline-block;
    background-color: #fff;
    color: #011eb8;
    line-height: 1em;
    padding: 5px;
    font-size: 13px;
    border-radius: 20px;
    margin-right: 10px;
}
.makerObi h3 span {
    display: block;
    font-size: 18px;
    /*font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
}
.makerOsusume {
    padding: 20px 20px 30px;
    background: url("img/hearing_panasonic2.jpg") no-repeat #fff;
    background-position: right 20px top 20px;
    background-size: 100px 114px;
    padding-right: 120px
}
.makerOsusume h4 {
    font-size: 18px;
    margin-bottom: 10px;
}
.makerOsusume ul {
    display: flex;
    flex-wrap: wrap;
}
.makerOsusume ul li {
    list-style: disc;
    margin-left: 1em;
    margin-right: 2em;
    margin-bottom: 10px;
}
.makerButton {
    margin-top: 30px;
}
.makerButton a {
    margin: 0 auto;
}
@media screen and (max-width: 768px) {
    .makerWrapper {
        width: 96%;
    }
    .makerObi span.round {
        font-size: 12px;
    }
}
.kikoeNayami {
    padding: 50px 0;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}
.kikoeNayami h3 {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 24px;
    text-align: center;
}
.kikoeNayami h3 span {
    background: linear-gradient(transparent 60%, #ffcc33 60%);
}
.kikoeNayami ul {
width: 100%;
max-width: 900px;
margin: 30px auto 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.kikoeNayami ul li {
display: inline-block;
width: 120px;
height: 120px;
text-align: center;
border-radius: 50%;
border: solid 1px #754c24;
color: #754c24;
font-size: 14px;
position: relative;
line-height: 1.3em;
cursor: pointer;
    margin: 0 10px 10px;
}
.kikoeNayami ul li span {
position: absolute;
top: 35px;
left: 0;
right: 0;
width: 100%;
}
.kikoeNayami ul li.l2 span {
    top: 43px;
}
.kikoeNayami p {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    width: 96%;
    max-width: 800px;
    margin: 20px auto 0;
    text-align: center;
    font-size: 16px;
}
.kikoeNayami p span {
    font-size: 12px;
}
.kikoeNayami div {
    width: 240px;
    margin: 30px auto 0;
    text-align: center;
    padding: 10px 0;
    background-color: #ffcc33;
    font-size: 18px;
    position: relative;
}
.kikoeNayami div::after{
  content: "";
  position: absolute;
  right: 0;
  bottom: -20px;
  left: 0;
  width: 0px;
  height: 0px;
  margin: auto;
  border-style: solid;
  border-color: #ffcc33 transparent transparent transparent;
  border-width: 20px 20px 0 20px;
}
.hearingStore {
    padding: 50px 0;
    background-color: #f1f1f1;
}
.hearingStore .box {
    width: 96%;
    max-width: 900px;
    margin: 0 auto;
}
.hearingStore .box .recruitCareerLink h3 {
    font-size: 24px;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.hearingStore .box .recruitCareerLink li {
    /*width: calc(33% - 6em - 2px);*/
    width: calc(25% - 6em - 2px);
    background-color: #fff;
}
.hearingStore .box ul.recruitCareerLink li a.on {
    width: 160px;
}
@media screen and (max-width: 768px) {
    .hearingStore .box .recruitCareerLink li {
        width: calc(100% - 4em);
        padding: 2em;
    }
}
/*2019.08.18ここまで*/
.hearingFlow {
    margin: 50px auto;
}
.hearingFlowWrapper {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.hearingFlowText {
    width: 67%;
    /*font-family: Century,serif;*/
    /*font-weight: bold;*/
}
.hearingFlowPhoto {
    width: 30%;
}
.hearingFlowPhoto img {
    width: 100%;
    height: auto;
}
.hearingFlowStep {
    font-size: 20px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    color: #603813;
}
.hearingFlowStep span {
     font-size: 28px;
}
.hearingFlowText p {
    font-size: 16px;
}
.hearingFlowText .down {
    text-align: center;
    font-size: 40px;
    margin-bottom: 20px;
    color: #999;
}
.hearingFlow a.toDetail {
    width: 280px;
}
@media screen and (max-width: 768px) {
    .hearingFlowWrapper {
        display: block;
    }
    .hearingFlowText {
        width: 90%;
        margin: 0 5% 20px;
    }
    .hearingFlowPhoto {
        width: 90%;
        margin: 0 5%;
    }
    .hearingFlowText .down {
        margin-bottom: 0;
    }
}

@media screen and (max-width: 768px) {
    .corporate.hearing_aid .pageTop.veryShort .img img {
        width: auto;
        margin-left: -100%;
    }
}
.faq ul {
    max-width: 900px;
    width: 96%;
    margin: 20px auto 0;
    border-right: 1px solid #ccc;
    display: flex;
}
.faq ul li {
    width: 33.3%;
}
.faq ul li a {
    display: block;
    text-align: center;
    padding: 10px;
    background-color: #f0f4ff;
    border: 1px solid #ccc;
    border-width: 1px 0 1px 1px;
}
@media screen and (max-width: 600px) {
    .faq ul {
        display: block;
    }
    .faq ul li {
        width: 100%;
    }
}
.faq ul li a:hover {
    opacity: 1;
    background-color: #d7e0ff;
}
.faq ul li a.cr {
    background-color: #3393FF;
    color: #fff;
    cursor: default;
}
.faq ul li a.cr:hover {
    opacity: 1;
}
.faqWrapper {
    max-width: 900px;
    width: 96%;
    margin: 50px auto;
}
.faqWrapper dl {
    border-bottom: 1px solid #ddd;
    font-size: 16px;
    line-height: 2em;
    margin-bottom: 30px;
    padding-bottom: 30px;
}
.faqWrapper dt {
    font-size: 17px;
    color: #874f1b;
    padding-left: 2em;
    position: relative;
    margin-bottom: 20px;
}
.glasses .faqWrapper dt {
    color: #005633;
}
.contact .faqWrapper dt {
    color: #235ee2;
}
.faqWrapper dt::before {
    content: "Q. ";
    font-size: 22px;
    position: absolute;
    top: 0;
    left: 0;
    /*font-family: 游明朝,"Yu Mincho",YuMincho,HGS明朝E,メイリオ,Meiryo,serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.faqWrapper dd {
    padding-left: 2em;
    position: relative;
}
.faqWrapper dd::before {
    content: "A. ";
    font-size: 22px;
    position: absolute;
    top: 0;
    left: 0;
    /*font-family: 游明朝,"Yu Mincho",YuMincho,HGS明朝E,メイリオ,Meiryo,serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.faqWrapper dd ul {
    margin-top: 1em;
    display: block;
    width: 100%;
    border-right: none;
}
.faqWrapper dd ul li {
    list-style: disc;
    margin-left: 1em;
}
.faqWrapper dd ol {
    margin-top: 1em;
}
.faqWrapper dd ol li {
    list-style: decimal;
    margin-left: 1.5em;
}
.faqWrapper#tab02, .faqWrapper#tab03, .faqWrapper#tab04 {
    display: none;
}
/*-------------------------------
	Choice
-------------------------------*/
.choicePoint .secTtl {
    margin-bottom: 10px;
}
.choiceFlow {
    max-width: 1000px;
    width: 96%;
    margin: 50px auto;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.choiceFlow p {
    text-align: center;
    font-size: 18px;
    margin-bottom: 30px;
}
.choiceFlow ul {
    display: flex;
    justify-content: space-between;
}
.choiceFlow ul li {
    position: relative;
}
.choiceFlow ul li a {
    border: 3px solid #ddd;
    display: block;
    padding: 20px;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: 18px;
    width: 15px;
    height: 148px;
    line-height: 1em;
    font-weight: 600;
}
.choiceFlow ul li i {
    font-size: 30px;
    margin-top: 30px;
}
.choiceFlow ul li a:hover {
    opacity: 1;
    border: 3px solid #82ac9b;
}
.choiceFlow ul li:first-child a {
    cursor: default;
}
.choiceFlow ul li:first-child a:hover {
    border: 3px solid #ddd;
}
@media screen and (max-width: 768px) {
    .choiceFlow ul li a {
        width: auto;
        padding: 20px 10px;
    }
}
@media screen and (max-width: 420px) {
    .choiceFlow ul {
        display: block;
    }
    .choiceFlow ul li {
        text-align: center;
    }
    .choiceFlow ul li a {
        padding: 15px 0;
        -ms-writing-mode: tb-rl;
        writing-mode: initial;
        width: calc(100% - 6px);
        height: auto;
    }
    .choiceFlow ul li i {
        margin: 0;
        transform: rotate(90deg);
        color: #999;
    }
}
.choicePoint {
    border-top: 1px solid #ccc;
    padding: 60px 0;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.choicePoint p.lead {
    text-align: center;
    font-size: 20px;
    margin-bottom: 50px;
    font-weight: 600;
}
.choiceBox {
    max-width: 1000px;
    width: 96%;
    margin: 0 auto 40px;
    display: flex;
    justify-content: space-between;
}
.choiceBoxText {
    width: 50%;
    font-size: 16px;
    order: 1;
}
.choiceBoxText p {
    margin-bottom: 1.5em;
}
.choiceBoxText p:last-child {
    margin-bottom: 0;
}
.choiceBoxPhoto {
    width: 45%;
    order: 2;
}
.choiceBoxPhoto img {
    width: 100%;
    height: auto;
}
.choicePoint h3 {
    text-align: center;
    font-size: 28px;
}
.choicePoint h3 span {
    background-color: #fff;
    padding: 0 .2em;
}
@media screen and (max-width: 768px) {
    .choicePoint {
        padding: 40px 0;
    }
    .choicePoint p.lead {
        font-size: 18px;
        margin-bottom: 30px;
    }
    .choiceBox {
        display: block;
        margin-bottom: 30px;
    }
    .choiceBoxText,.choiceBoxPhoto {
        width: 100%;
    }
    .choiceBoxPhoto {
        margin-bottom: 20px;
    }
}
.topicBox {
    /*font-family: "游ゴシック体", YuGothic, sans-serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
    font-weight: normal;
    max-width: 960px;
    width: calc(96% - 40px);
    padding: 40px 20px 20px;
    margin: 0 auto;
    border: 1px solid #bbb;
    margin-top: -15px;
}
.topicBox ul {
    border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    font-size: 16px;
}
.topicBox ul li {
    display: inline-block;
    margin-right: 20px;
    margin-bottom: 10px;
}
.topicBox ul li a i {
    color: #005633;
}
.topicBox ul li a:hover {
    opacity: 1;
    text-decoration: underline;
}
.topicBox h4 {
    margin: 40px 0 20px;
    font-size: 24px;
}
.topicBox h4 span {
    background-color: #005633;
    color: #fff;
    padding: 10px;
    font-size: 20px;
    margin-right: 15px;
}
.topicBox h4 small {
    font-size: 16px;
}
.topicBox p {
    font-size: 16px;
}
.topicBox h5 {
    margin: 20px 0 5px;
    font-size: 16px;
    font-weight: bold;
}
@media screen and (max-width: 768px) {
    .topicBox h4 {
        margin-top: 30px;
        font-size: 20px;
    }
    .topicBox h4 span {
        display: block;
        margin-right: 0;
        text-align: center;
        margin-bottom: 10px;
        font-size: 18px;
    }
    .topicBox h4 small {
        display: block;
    }
}
table.chart {
    width: 600px;
    margin: 50px auto 0;
    /*font-family: "游ゴシック体", YuGothic, sans-serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
    font-size: 16px;
}
table.chart td {
    text-align: center;
    position: relative;
}
table.chart td.gray {
    background-color: #eee;
    border: 1px solid #ccc;
    padding: 10px 0;
}
table.chart td.line {
    background: url("/img/choice_td_gray.gif") repeat-y center top;
}
table.chart td.syoho1 {
    padding: 10px 0;
    background-color: #d7eee0;
    border: 1px solid #ccc;
    width: 300px;
}
table.chart td.syoho2 {
    padding: 10px 0;
    background-color: #f8f0aa;
    border: 1px solid #ccc;
    width: 300px;
}
.tdBox {
    background-color: #ffebe4;
    border: 1px solid #ccc;
    padding-bottom: 20px;
}
.tdBox .h {
    background-color: #ffdcc9;
    padding: 5px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
}
.tdBox .l {
    background: url("/img/choice_td_line.gif") repeat-y center top;
}
@media screen and (max-width: 640px) {
    table.chart {
        width: 96%;
        margin-top: 30px;
    }
    table.chart td.syoho1,
    table.chart td.syoho2 {
        width: 50%;
    }
}
table.price {
    font-size: 16px;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
}
table.price td, table.price th {
    padding: 8px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
table.price th {
    background-color: #f4f4f4;
    font-weight: 600;
}
table.price td {
    text-align: right;
    width: 120px;
}
@media screen and (max-width: 640px) {
    table.price {
        width: 100%;
    }
    table.price td,table.price th {
        display: block;
        width: calc(100% - 16px);
    }
}

/*-------------------------------
	Kids
-------------------------------*/
.kids .pageTop {
    margin-bottom: 0;
}
.kidsMessage {
    background-color: #f1f1f1;
    padding: 60px 0;
}
.kidsMessage p {
    max-width: 1000px;
    width: 96%;
    margin: 0 auto;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    text-align: center;
    font-size: 16px;
}
@media screen and (max-width: 768px) {
    .kidsMessage {
        padding: 30px 0;
    }
    .kidsMessage p {
        /*font-family: "Hiragino Kaku Gothic ProN", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif;  
        font-size: 14px;
        text-align: left;
    }
}
@media screen and (max-width: 420px) {
    .kids .pageTop {
        height: 340px;
    }
    .kidsMessage {
        padding: 1.5em 0;
    }
    .kidsMessage p {
        width: 90%;
        line-height: 1.8;
    }
}
.kidsArea {
    padding-top: 50px;
}
.kidsBox {
    max-width: 1000px;
    width: 96%;
    margin: 0 auto 50px;
    display: flex;
    justify-content: space-between;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.kidsText {
    width: 48%;
}
.kidsText h2 {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
}
.kidsText p {
    font-size: 16px;
}
.kidsText p a {
    text-decoration: underline;
}
.kidsPhoto {
     width: 48%;
}
.kidsPhoto img {
    width: calc(100% - 10px);
    height: auto;
    border: 5px solid #e4e001;
}
.kidsArea .kidsBox:nth-child(even) .kidsText {
    order: 2;
}
.kidsArea .kidsBox:nth-child(even) .kidsPhoto {
    order: 1;
}
@media screen and (max-width: 420px) {
    .kidsArea {
        padding-top: 40px;
    }
    .kidsBox {
        display: block;
        margin-bottom: 40px;
    }
    .kidsText {
        width: 100%;
        margin-bottom: 10px;
    }
    .kidsPhoto {
        width: 100%;
    }
}
.kidsClub {
    background-color: #fbffda;
    padding: 60px 0;
}
.kidsClubBox {
    max-width: 1000px;
    width: 96%;
    margin: 0 auto;
}
.kidsClubBox .lead {
    font-size: 16px;
    margin-bottom: 20px;
}
.kidsClubBox h3 {
    background-color: #018a76;
    color: #fff;
    padding: 5px 0;
    font-size: 16px;
    width: 6em;
    margin-bottom: 20px;
    text-align: center
}
.kidsClubBoxWrapper {
    display: flex;
    justify-content: space-between;
}
.kidsClubBoxWrapper ul {
    width: 48%;
}
.kidsClubBoxWrapper ul li {
    list-style: disc;
    margin-left: 1em;
    margin-bottom: 10px;
}
.kidsClubBoxPhoto {
    width: 48%;
}
.kidsClubBoxPhoto img {
    width: 100%;
    height: auto;
}
@media screen and (max-width: 420px) {
    .kidsClub {
        padding: 30px 0;
    }
    .kidsClubBoxWrapper {
        display: block;
    }
    .kidsClubBoxWrapper ul {
        width: 100%;
        margin-bottom: 20px;
    }
    .kidsClubBoxPhoto {
        width: 100%;
    }
}
.kidsHoken {
    background-color: #f4f4f4;
    padding: 60px 0;
}
.kidsHokenWrapper {
    max-width: 1000px;
    width: 96%;
    margin: 0 auto;
}
.kidsHokenH3 {
    background-color: #fff;
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
    cursor: pointer;
}
.kidsHokenH3:hover {
opacity:0.7;
}
.kidsHokenH3.rev i {
    transform: rotateX(180deg);
}
.kidsHokenWrapper .accordion {
    display: none;
}
.kidsHokenWrapper .accordion p {
    margin-bottom: 1em;
}
.kidsHokenWrapper .accordion table {
    border-top: 1px solid #999;
    border-left: 1px solid #999;
    width: 50%;
    margin-bottom: 10px;
}
.kidsHokenWrapper .accordion table td {
    border-bottom: 1px solid #999;
    border-right: 1px solid #999;
    padding: 5px;
}
.txt_kids1 {
    margin-bottom: 20px;
}
.txt_kids1 strong {
    color: green;
}
.kidsHokenWrapper .accordion p.txt_kids1.lastChild {
    margin-bottom: 30px;
}
@media screen and (max-width: 420px) {
    .kidsHoken {
        padding: 30px 0;
    }
    .kidsHokenWrapper .accordion table {
        width: 100%;
    }
}

/*-------------------------------
	Reserve
-------------------------------*/
.corporateContent.reserve01 h2 {
    margin: 60px auto 60px;
    position: relative;
    width: 20em;
}
.corporateContent.reserve01 h2 br {
    display: none;
}
.corporateContent.reserve01 h2::after {
    display: inline-block;
    position: absolute;
    top: -35px;
    right: -100px;
    content: '';
    width: 100px;
    height: 100px;
    background-image: url("/img/contact_reserve_five.png");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}
@media screen and (max-width: 767px) {
    .corporateContent.reserve01 h2 {
        width: 11em;
        line-height: 1.2em;
    }
    .corporateContent.reserve01 h2 br {
        display: block;
    }
    .corporateContent.reserve01 h2 br.sp {
        display: none;
    }
}
@media screen and (max-width: 420px) {
    .corporateContent.reserve01 h2 {
        width: 10em;
        font-size: 22px;
        margin: 30px auto 30px;
    }
    .corporateContent.reserve01 h2 br.sp {
        display: block;
    }
    .corporateContent.reserve01 h2::after {
        top: 0px;
        right: -70px;
        width: 80px;
        height: 80px;
    }
}
section.reserve01b {
    padding: 0 0 50px;
}
@media screen and (max-width: 420px) {
    section.reserve01b {
        padding-bottom: 30px;
    }
}
.reserveWrapper {
    width: 96%;
    max-width: 800px;
    margin: 0 auto;
}
section.reserve01b .box {
    border: 1px solid #999;
    padding: 20px;
    margin-bottom: 20px;
}
section.reserve01b strong {
    color: #ed1e79;
    font-size: 18px;
}
section.reserve01c {
    background-color: #f5f8fa;
    padding: 50px 0;
    margin-bottom: 50px;
}
@media screen and (max-width: 420px) {
    section.reserve01c {
        padding: 30px 0;
        margin-bottom: 30px;
    }
}
section.reserve01c h3 {
    color: #3393ff;
    font-weight: bold;
    font-size: 18px;
    margin-top: 1.5em;
    margin-bottom: 1em;
}
section.reserve01c h3:first-child {
    margin-top: 0;
}
.corporateContent.reserve02 .box p a {
    text-decoration: underline;
}
input.zip {
    width: 6em;
}
.reserve02 span.required {
    border: 1px solid #3393FF;
    background-color: #3393FF;
}
.reserve02 span.any {
    color: #3393FF;
    border: 1px solid #3393FF;
}
.reserve02 .formBtn input {
    border: 1px solid #3393FF;
    background-color: #3393FF;
}
.policy {
    background-color: #f4f4f4;
    padding: 50px 0;
}
.policy h2 {
    text-align: center;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    margin-bottom: 30px;
}
.policy .box {
    max-width: 800px;
    width: 96%;
    margin: 0 auto;
}
.policy p {
    margin-bottom: 1em;
}
.policy .frame {
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    height: 200px;
    overflow-y: scroll;
}
.policy ol li {
    list-style: decimal;
    margin-left: 2em;
    margin-bottom: 10px;
}
.policy .box ol li h6 {
    font-weight: bold;
    margin-bottom: 1em;
}
.policy ul {
    margin: 10px 0;
}
.policy ul li {
    list-style: disc;
    margin-left: 2em;
}
.corporateContent .box ol li {
    list-style: decimal;
    margin-left: 2em;
    margin-bottom: 10px;
}
.corporateContent .box ol li h6 {
    font-weight: bold;
    margin-bottom: 1em;
}
.corporateContent .box ol li ul {
    margin: 10px 0;
}
.corporateContent .box ol li ul li {
    list-style: disc;
    margin-left: 2em;
}
br.sp {
    display: none;
}
@media screen and (max-width: 768px) {
    br.sp {
        display: block;
    }
}
@media screen and (max-width: 420px) {
    br.pc, span.pc {
        display: none;
    }
}

/*-------------------------------
コンタクト製品情報
-------------------------------*/
#mainvisualArea {
background-color: #f1f1f1;
height: 479px;
padding: 30px 0 0 0;
box-sizing: border-box;
overflow: hidden;
}
#mainvisualArea #image-bloc {
height: 396px;
}
#mainvisualArea .bx-viewport {
overflow: visible!important;
width: 1026px!important;
}
#mainvisualArea .slider {
list-style: none;
margin: 0;
padding: 0;
}
#mainvisualArea .slider li {
width: 640px!important;
margin: 0;
padding: 0;
}
@media screen and (max-width: 630px) {
    #mainvisualArea {
        height: 279px;
    }
    #mainvisualArea #image-bloc {
        height: 198px;
    }
    #mainvisualArea .slider li {
        width: 320px !important;
    }
    .bx-wrapper img {
        height: auto;
    }
}

.midCircle {
    text-align: center;
    padding: 60px 0 30px;
}
@media screen and (max-width: 630px) {
    .midCircle {
        padding: 30px 0 20px;
    }
}
.midCircle ul {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.midCircle ul li {
    margin: 0 10px 10px;
}
.midCircle ul li a {
  display: inline-block;
  width: 110px;
  height: 110px;
  text-align:center;
  border-radius: 50%;
  border: solid 1px #3393ff;
    color: #3393ff;
    font-size: 14px;
    position: relative;
    line-height: 1.3em;
    cursor: pointer;
}
.midCircle ul li a:hover {
    background-color: #e1f6ff;
}
.midCircle ul li a span {
    position: absolute;
    top:35px;
    left: 0; right: 0;
    width: 100%;
}
.midCircle ul li a span.l1 {
    top:48px;
}
@media screen and (max-width: 630px) {
    .midCircle ul li {
        margin: 0 5px 5px;
    }
    .midCircle ul li a {
        width: 80px;
        height: 80px;
        font-size: 11px;
        letter-spacing: -0.3px;
    }
    .midCircle ul li a span {
        top:25px;
    }
    .midCircle ul li a span.l1 {
        top:34px;
    }
}
/*2019.08.30追加ここから*/
.ct-alert{
border:1px solid #CCC;
padding:10px;
width: 100%;
max-width: 900px;
margin: 0 auto;
background-color: #fff;
text-align:center;
justify-content: space-between;
}
.ct-midashi{
padding:10px;
width: 100%;
max-width: 900px;
margin: 0 auto;
background-color: #fff;
text-align:center;
justify-content: space-between;
margin-bottom:10px;

}/*2019.08.30追加ここまで*/
.onePush {
    padding: 50px 0 60px;
    background: #87e0fd;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM4N2UwZmQiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDVhYmUwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-radial-gradient(center, ellipse cover,  #87e0fd 0%, #05abe0 100%);
    background: -webkit-radial-gradient(center, ellipse cover,  #87e0fd 0%,#05abe0 100%);
    background: radial-gradient(ellipse at center,  #87e0fd 0%,#05abe0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#87e0fd', endColorstr='#05abe0',GradientType=1 );
    color: #fff;
}
.onePushWrapper {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    background-color: #fff;
    padding: 30px;
    display: flex;
    justify-content: space-between;
}
.onePushPhoto {
    width: 39%;
}
.onePushPhoto img {
    width: 100%;
    height: auto;
}
.onePushText {
    width: 59%;
    color: #000;
    font-weight: normal;
    padding-top: 1em;
}
@media screen and (max-width: 630px) {
    .onePush {
        padding: 30px 0;
    }
    .onePushWrapper {
        display: block;
        padding: 20px;
        width: calc(100% - 40px);
    }
    .onePushPhoto {
        width: 100%;
    }
    .onePushText {
        width: 100%;
    }
}
.recomBox.contactList {
    justify-content: space-between;
}
.contactList .recomItem {
    width: calc(24% - 20px);
    margin-bottom: 30px;
    background-color: #fff;
    padding: 10px;
    display: flex;
    flex-direction: column;
}
.contactList .recomItem.noitem::after {
    content: url("img/dammy.png");
}
@media screen and (max-width: 630px) {
    .recomBox.contactList {
        display: block;
    }
    .contactList .recomItem {
        width: calc(96% - 20px);
        margin: 0 auto 30px;
    }
    .recomBox.contactList.underBox {
        display: none;
    }
    .contactList .noitem{
        display: none;
    }

}
.contactList .recomItem .content {
    width: 100%;
    margin-top: 0;
    padding: 0 0.5em;
}
.contactList .recomItem .content .title {
    margin-bottom: 1em;
}
.contactList .recomItem .content .title .pname {
    font-weight:bold;
    font-size:17px;
}/*20190828追加*/
.contactList .recomItem .content .title .mname {
    font-weight:normal;
    font-size:12px;
}/*20190918追加*/
.contactList .recomItem .content p {
    margin-bottom: 1em;
}
.contactList .recomItem .posBottom {
    margin-top: auto;
}
.listIcon {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 1em 0 0;
}
@media screen and (max-width: 630px) {
    .listIcon {
        margin-top: 1em;
    }
}
.listIcon li {
    width: 18%;
    margin-right: 5px;
}
.productMain .listIcon {
    margin-bottom: 1em;
}
.productMain .listIcon li {
    width: 50px;
}
.productMain .listIcon li.senkou,
.productMain .listIcon li.osusume {
    padding-top: 10px;
}
.productMain .listIcon li.plan {
    padding-top: 10px;
}
.listIcon li img {
    width: 100%;
    height: auto;
    object-fit: contain;
    font-family: 'object-fit: contain;';   /*IE対策*/
}
.recomItem.new .img::after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    display: inline-block;
    width: 50px;
    height: 50px;
    background-image: url("/img/contact-new.png");
    background-size: contain;
    vertical-align: middle;
}
.recomItem.senkou .img::after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    display: inline-block;
    width: 50px;
    height: 36px;
    background-image: url("/img/contact-senkou.png");
    background-size: contain;
    vertical-align: middle;
}
.recomItem.osusume .img::after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    display: inline-block;
    width: 50px;
    height: 35px;
    background-image: url("/img/contact-osusume.png");
    background-size: contain;
    vertical-align: middle;
}
.recomItem.plan .img::after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    display: inline-block;
    width: 50px;
    height: 50px;
    background-image: url("/img/contact-plan.png");
    background-size: contain;
    vertical-align: middle;
}
.contact main .recomWapper:nth-child(even) {
    background-color: #f1f1f1;
}
.carousel {
    background-color: #f0fcff;
    padding: 50px 0;
}
@media screen and (max-width: 767px) {
    .carousel {
        padding: 30px 40px;
    }
    .carousel .banner li img {
        width: 100%;
        height: auto;
        
    }
}
@media screen and (max-width: 630px) {
    .carousel .banner li {
        width: 300px !important;
    }
    .carousel .banner li img {
        width: 100%;
        height: auto;
    }
}
article .pageHeader .pageTitle .title {
    position: relative;
}
article .pageHeader .pageTitle .title.new::after {
    position: absolute;
    top: -5px;
    left: -60px;
    content: '';
    display: inline-block;
    width: 50px;
    height: 50px;
    background-image: url("/img/contact-new.png");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}
article .pageHeader .pageTitle .title.senkou::after {
    position: absolute;
    top: -15px;
    left: -55px;
    content: '';
    display: inline-block;
    width: 50px;
    height: 36px;
    background-image: url("/img/contact-senkou.png");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}
article .pageHeader .pageTitle .title.osusume::after {
    position: absolute;
    top: -15px;
    left: -55px;
    content: '';
    display: inline-block;
    width: 50px;
    height: 36px;
    background-image: url("/img/contact-osusume.png");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}
article .pageHeader .pageTitle .title.plan::after {
    position: absolute;
    top: -15px;
    left: -55px;
    content: '';
    display: inline-block;
    width: 50px;
    height: 36px;
    background-image: url("/img/contact-plan.png");
    background-repeat: no-repeat;
    background-size: contain;
    vertical-align: middle;
}
article .pageHeader .subTitle {
    text-align: center;
    font-size: 16px;
    margin-bottom: 1.2em;
}
@media screen and (max-width: 630px) {
    article .pageHeader .pageTitle .title.new {
        padding-left: 55px;
    }
    article .pageHeader .pageTitle .title.new::after {
        top: -8px;
        left: 0;
    }
    article .pageHeader .pageTitle .title.senkou,
    article .pageHeader .pageTitle .title.osusume {
        padding-left: 56px;
    }
    article .pageHeader .pageTitle .title.plan {
        padding-left: 56px;
    }
    article .pageHeader .pageTitle .title.senkou::after,
    article .pageHeader .pageTitle .title.osusume::after {
        top: 0;
        left: 0;
    }
    article .pageHeader .pageTitle .title.plan::after {
        top: 0;
        left: 0;
    }
}

.contact .handlingShop .btnBox .btn {
    background: #3393FF;
}
.contact .productMain .contact .btn {
    background: #3393FF;
}

/*-------------------------------
コンタクト初めての方へ
-------------------------------*/
.firsttime-txt {
    padding: 50px 0;
    text-align: center;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 24px;
}
.firsttime-txt p {
    color: #3393FF;
    border: 3px solid #3393FF;
    width: 96%;
    max-width: 30em;
    margin: 0 auto;
    line-height: 1.2em;
    padding: 1em 0 0.8em;
}
@media screen and (max-width: 420px) {
    .firsttime-txt {
        padding: 30px 0;
    }
    .firsttime-txt p {
        padding-left: 1em;
        padding-right: 1em;
        width: calc(96% - 2em);
    }
}
.firsttime-flw01 {
    padding: 30px 0 50px;
}
.firsttime-flw02 {
    padding: 50px 0;
    background-color: #f5f8fa;
}
@media screen and (max-width: 420px) {
    .firsttime-flw01,.firsttime-flw02 {
        padding: 30px 0;
    }
}
.firsttimeWrapper {
    margin: 0 auto;
    width: 96%;
    max-width: 800px;
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.firsttime-flw01 h2,
.firsttime-flw02 h2 {
    color: #3393FF;
    font-size: 26px;
    margin-bottom: 1em;
}
.firsttime-flw01 h2 span,
.firsttime-flw02 h2 span {
    font-size: 30px;
    margin-right: 5px;
    background-color: #3393FF;
    color: #fff;
    padding: 0 5px;
}
.firsttime-flw01 p.msg,
.firsttime-flw02 p.msg {
    font-size: 18px;
}
.firsttime-flw01 .roundBox {
    background-color: #f5f8fa;
    padding: 20px;
    margin-top: 30px;
}
.firsttime-flw02 .roundBox {
    background-color: #fff;
    padding: 20px;
    margin-top: 30px;
}
.firsttime-flw01 .roundBox h3,
.firsttime-flw02 .roundBox h3{
    color: #3085E2;
    font-size: 22px;
    border-bottom: 1px solid #3085E2;
    padding-bottom: 0.3em;
    margin-bottom: 1em;
}
.firsttime-flw01 .roundBox p,
.firsttime-flw02 .roundBox p{
    font-size: 16px;
}
.firsttime-flw02 table {
    width: 100%;
}
.firsttime-flw02 table th {
    width: 30%;
    text-align: center;
    padding: 10px;
    font-weight: bold;
    background-color: #4bc6e9;
    color: #fff;
    border-bottom: 1px solid #fff;
    font-size: 16px;
}
.firsttime-flw02 table td {
    width: 70%;
    padding: 10px;
    background-color: #e8f2fb;
    border-bottom: 1px solid #fff;
}
/*@media screen and (max-width: 420px) {
    .firsttime-flw02 table th,
    .firsttime-flw02 table td {
        display: block;
        width: calc(100% - 20px);
        border-bottom: none;
        text-align: left;
    }
}*/

.firsttime-flw01 .firsttimeWrapper h3,
.firsttime-flw02 .firsttimeWrapper h3{
    color: #3085E2;
    font-size: 22px;
    border-bottom: 1px solid #3085E2;
    padding-bottom: 0.3em;
    margin-bottom: 1em;
}

/*-------------------------------
フローティングメニュー
-------------------------------*/
#iconArea {
    position: fixed;
    bottom: 100px;
    right: 0;
    z-index: 999;
    display: none;
}
#iconArea a {
    display: block;
    color: #fff;
    font-size: 10px;
    text-align: center;
    min-width: 60px;
    height: 60px;
    padding: 5px;
    line-height: 1em;
}
.glasses #iconArea a {
    background-color: #005633;
    border-bottom: 1px solid #5c9b89;
}
.contactlens #iconArea a {
    background-color: #3393FF;
    border-bottom: 1px solid #83C0D6;
}
#iconArea a:last-child {
    border-bottom: none;
}
#iconArea a img {
    display: block;
    width: 34px;
    height: auto;
    margin: 5px auto 5px;
}
@media screen and (max-width: 768px) {
    #iconArea {
        bottom: 0px;
        left: 0px;
        text-align: center;
    }
    .glasses #iconArea {
        background-color: #005633;
    }
    .contactlens #iconArea {
        background-color: #3393FF;
    }
    #iconArea a {
        display: inline-block;
        height: 50px;
    }
    .glasses #iconArea a {
        border-right: 1px solid #5c9b89;
    }
    .contactlens #iconArea a {
        border-right: 1px solid #83C0D6;
    }
    #iconArea a img {
        width: 30px;
        margin-bottom: 3px;
    }
    #iconArea a:last-child {
        border-right: none;
    }
}
/*2019.08.16*/
p.recruitMsg {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 24px;
    text-align: center;
    padding: 50px 0;
}
ul.recruitLink {
    /*display: flex;
    flex-wrap: wrap;*/
}
ul.recruitLink li {
    width: 100%;
    height: auto;
    background: url("img/corporate-recruit-02.jpg") no-repeat center center;
    background-size: cover;
    text-align: center;
    margin-bottom: 30px;
}
ul.recruitLink li:nth-child(2) {
    background: url("img/corporate-recruit-01.jpg") no-repeat center center;
    background-size: cover;
}
ul.recruitLink li:nth-child(3) {
    background: url("img/corporate-recruit-03.jpg") no-repeat center center;
    background-size: cover;
}
ul.recruitLink li h2 {
    font-size: 26px;
    color: #fff;
}
ul.recruitLink li div {
    background-color: rgba(96,56,19,0.50);
    padding: 4em 0;
}
ul.recruitLink li a.recruitLinkDetail {
    display: block;
    width: 200px;
    margin: 1em auto 0;
    padding: 10px;
    color: #fff;
    border: 1px solid #fff;
    position: relative;
}
ul.recruitLink li a.recruitLinkDetail i {
    position: absolute;
    top: 13px;
    right: 15px;
}
ul.recruitLink li a.recruitLinkDetail:hover {
    opacity: 1;
    background-color: #603813;
    border: 1px solid #603813;
}
@media screen and (max-width: 768px) {
    p.recruitMsg {
        padding: 0;
        font-size: 20px;
    }
    p.recruitMsg br {
        display: none;
    }
    ul.recruitLink {
        display: block;
    }
    ul.recruitLink li {
        margin-bottom: 20px;
    }
    ul.recruitLink li div {
        padding: 2em 0;
    }
    ul.recruitLink li a.recruitLinkDetail {
        width: 140px;
    }
}
ul.recruitCareerLink {
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid #ddd;
    border-left: 1px solid #ddd;
}
ul.recruitCareerLink li {
    width: calc(50% - 6em - 2px);
    height: auto;
    text-align: center;
    padding: 3em;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}
ul.recruitCareerLink li a.off {
    display: block;
    width: 200px;
    margin: 1em auto 0;
    padding: 10px;
    color: #000;
    background-color: #eee;
    position: relative;
}
ul.recruitCareerLink li a.on {
    display: block;
    width: 200px;
    margin: 1em auto 0;
    padding: 10px;
    color: #fff;
    background-color: #f7931e;
    position: relative;
}
ul.recruitCareerLink li a.on i {
    position: absolute;
    top: 13px;
    right: 15px;
}
@media screen and (max-width: 768px) {
    ul.recruitCareerLink {
        display: block;
    }
    ul.recruitCareerLink li {
        width: calc(100% - 4em);
        padding: 2em;
    }
    ul.recruitCareerLink li a {
        width: 140px;
    }
}
table.application {
    width: 100%;
}
table.application tr {
    border-bottom: 1px solid #ddd;
}
table.application th {
    white-space: nowrap;
    padding: 1.5em 2em 1.5em 0;
    font-weight: bold;
}
table.application td {
    padding: 1.5em 0 1.5em 0;
}
.btn a {
    display: block;
    text-align: center;
    width: 200px;
    margin: 1em auto 0;
    padding: 10px;
    color: #fff;
    background-color: #f7931e;
    position: relative;
}
.btn a i {
    position: absolute;
    top: 13px;
    right: 15px;
}
@media screen and (max-width: 768px) {
    table.application th {
        word-wrap:break-word;
        padding: 1em 0 0.5em 0;
        display: block;
        width: 100%;
    }
    table.application tr:first-child th {
        padding-top: 0;
    }
    table.application td {
        word-wrap:break-word;
        padding: 0 0 1em 0;
        display: block;
        width: 100%;
    }
}
.privacyBox {
    padding: 0 20px 0 0;
    height: 280px;
    overflow-y: scroll;
    margin-bottom: 40px;
}
.corporateContent .box .privacyBox dt strong {
    font-size: 14px;
}
.corporateContent .box .privacyBox dd {
    font-weight: normal;
    margin: 1em 0 2em 1em;
}
@media screen and (max-width: 768px) {
    table.contactForm {
        margin-bottom: 30px;
    }
    .privacyBox {
        margin-bottom: 30px;
    }
}

.contactAboutWrapper {
    width: 96%;
    margin:  50px auto;
    max-width: 800px;
}
.contactAboutWrapper img {
    float: right;
    margin-left: 20px;
}
.contactAboutWrapper p {
    /*font-family: Garamond, "Times New Roman", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS 明朝E", "MS P明朝", "MSPMincho", serif;　20190827ユーザー希望により一旦変更*/
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
    font-size: 18px;
    margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
    .contactAboutWrapper {
        margin-top: 30px;
    }
    .contactAboutWrapper img {
        float: none;
        width: 100%;
        margin: 0 auto 20px;
    }
    .contactAboutWrapper p {
        margin-bottom: 20px;
    }
}
.contactNav {
    max-width: 800px;
    width: 96%;
    margin: 50px auto 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.contactNav li a {
    position: relative;
    display: block;
    border: #ddd 1px solid;
    width: 150px;
    text-align: center;
    padding: 10px 0;
}
.contactNav li a i {
    position: absolute;
    top: 13px;
    right: 15px;
}
.contactNav li a:hover {
    opacity: 1;
    background-color: #eee;
}
@media screen and (max-width: 420px) {
    .contactNav {
        margin: 30px auto 0;
        border-right: #ddd 1px solid;
        border-bottom: #ddd 1px solid;
    }
    .contactNav li {
        width: 50%;
    }
    .contactNav li a {
        width: 100%;
        border-right: none;
        border-bottom: none;
    }
    .contactNav li a i {
        right: 10px;
    }
}
.contactFlow {
    max-width: 600px;
    width: 96%;
    margin: 50px auto;
    font-family: "メイリオ", Meiryo, "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ＭＳ ゴシック", sans-serif; 
}
.contactFlow ul {
    display: flex;
    justify-content: space-between;
}
.contactFlow ul li {
    position: relative;
}
.contactFlow ul li a {
    border: 3px solid #ddd;
    display: block;
    padding: 20px;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: 18px;
    width: 15px;
    height: 180px;
    line-height: 1em;
    font-weight: 600;
}
.contactFlow ul li a.twoline {
    width: 30px;
}
.contactFlow ul li i {
    font-size: 30px;
    margin-top: 30px;
}
.contactFlow ul li a:hover {
    opacity: 1;
    border: 3px solid #8DC1FF;
}
@media screen and (max-width: 768px) {
    .contactFlow ul li a {
        width: auto;
        padding: 20px 10px;
    }
}
@media screen and (max-width: 420px) {
    .contactFlow {
        margin: 30px auto 10px;
    }
    .contactFlow ul {
        display: block;
    }
    .contactFlow ul li {
        text-align: center;
    }
    .contactFlow ul li a,
    .contactFlow ul li a.twoline {
        padding: 15px 0;
        -ms-writing-mode: tb-rl;
        writing-mode: initial;
        width: calc(100% - 6px);
        height: auto;
    }
    .contactFlow ul li i {
        margin: 0;
        transform: rotate(90deg);
        color: #999;
    }
}
.aftercare-01 {
    margin: 50px auto;
}
.firsttimeWrapper ol li {
    padding-left: 1.3em;
    text-indent: -1.3em;
    margin-bottom: 1.5em;
    font-size: 16px;
}
.firsttimeWrapper ol.small li {
    font-size: 14px;
    margin-bottom: 1em;
}
.firsttime-flw01 table {
    width: 100%;
}
.firsttime-flw01 table th {
    width: 30%;
    text-align: center;
    padding: 10px;
    font-weight: bold;
    background-color: #4bc6e9;
    color: #fff;
    border-bottom: 1px solid #fff;
    font-size: 16px;
}
.firsttime-flw01 table td {
    padding: 10px;
    text-align: center;
    background-color: #e8f2fb;
    border-bottom: 1px solid #fff;
    font-size: 16px;
}
.firsttime-flw01 table td.koukanText {
    text-align: left;
    background-color: #fff;
    font-size: 13px;
}

.firsttime-flw02 table td {
    font-size: 16px;
}

.firsttimeWrapper h4 {
    margin-top: 30px;
    color: #3393FF;
    font-size: 18px;
    border-bottom: 1px solid #3393FF;
    padding-bottom: 0.3em;
    margin-bottom: 1em;
}
.firsttimeWrapper .kinshi {
    width: 100px;
    text-align: center;
    color: #fff;
    background-color: tomato;
    padding: 5px 0;
    margin-top: 30px;
    margin-bottom: 10px;
}
.firsttimeWrapper .caution {
    border: 1px solid tomato;
    padding: 20px;
    background-color: #fff;
    margin-top: 20px;
}
.firsttimeWrapper p::after {
    content: ".";   
    display: block;   
    height: 0;   
    clear: both;   
    visibility: hidden;
}
.firsttimeWrapper p img.eyeCatch {
    width: 200px;
    height: auto;
    float: right;
}
@media screen and (max-width: 420px) {
    .firsttimeWrapper p img.eyeCatch {
        width: 140px;
    }
}
.firsttimeWrapper p.tsukaisute {
    margin-bottom: 20px;
}
.firsttimeWrapper p.tsukaisute strong {
    color: red;
    font-size: 16px;
}
.firsttime-flw02 table.igai td {
    width: inherit;
    text-align: center;
}
.firsttime-flw02 table.igai td.koukanText {
    text-align: left;
    background-color: #fff;
    font-size: 13px;
}
/*2019.08.16ここまで*/

/*2019.09.02追加*/
.underBox {
	display: none;
}
/*2019.09.02ここまで*/
/*
@media screen and (max-width: 768px) {
	.underBox {
		display: none;
	}
}
@media screen and (max-width: 420px) {
}
*/

.imgright{float:right;margin-left:10px;}
.imgleft{float:left;margin-right:10px;}
.clearfix::after {content: "";display: block;clear: both;}

@media screen and (max-width: 768px) {
    .imgright{
        float:none;
        margin-left:0;
        margin-bottom: 10px;
    }
    .imgleft{
        float:none;
        margin-right:0;
        margin-bottom: 10px;
    }
    .imgright img,.imgleft img {
        width: 100%;
        height: auto;
    }
}
.bx-wrapper .banner li img {
    font-family: none;
}

/*採用情報　2019.09.21*/

.recruitlist {
    width: calc(100%/1) ;
}
.recruitlist .img {
width: 50%;
/*height: 100%;*/
float: left;
}
.recontent {
background: #fff;
width: 50%;
position: relative;
z-index: 1;
padding: 1.5em;
-webkit-box-sizing: border-box;
box-sizing: border-box;
float: right;
}

.grayarea {
-webkit-filter: grayscale(1); /* Webkit */
filter: gray; /* IE6-9 */
filter: grayscale(1); /* W3C */
&:hover {
-webkit-filter: grayscale(0); /* Webkit */
filter: none; /* IE6-9 */
filter: grayscale(0); /* W3C */
color:gray;
	}
}
.grayarea .title ,.grayarea p{
color:gray;
}

/*会社沿革　2023*/
.history_wrapper {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto;
  background: url("img/history/history_line.png") left top repeat-y;
}
.history_content {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 3em;
}
.history_point {
  width: 70px;
}
.history_year {
  width: 10em;
  white-space: nowrap;
  font-size: 16px;
  line-height: 1.8em;
  margin-bottom: 0.5em;
  color: #603813;
}
.history_month {
  width: 2em;
  white-space: nowrap;
  font-size: 16px;
  line-height: 1.8em;
  margin-bottom: 0.5em;
  text-align: right;
  padding-right: 1em;
  color: #603813;
}
.history_text {
  width: calc(100% - 70px - 13em);
}
.history_text p {
  font-size: 16px;
  line-height: 1.8em;
  margin-bottom: 0.5em;
}
.history_image,
.history_image_two {
  margin-bottom: 1em;
}
.history_image img {
  width: 100%;
  height: auto;
  max-width: 400px;
  
}
.history_image_two img {
  width: 100%;
  height: auto;
  max-width: 380px;
}
.history_image_two img:first-child {
  margin-right: 10px;
}
.history_mesage {
  width: 90%;
  height: auto;
  max-width: 1060px;
  margin: 40px auto;
  padding: 20px;
  border: 1px solid #603813;
  text-align: center;
}
.history_mesage img {
  width: 100%;
  height: auto;
  max-width: 200px;
  margin-bottom: 20px;
}
.history_mesage p {
  font-size: 18px;
  line-height: 2em;
}
.history_banner {
  width: 90%;
  max-width: 600px;
  height: auto;
  margin: 25px auto 20px;
}
.history_banner img {
  width: 100%;
  height: auto;
}

.history_movie {
    width: 55%;
    margin: 20px auto;
}

.YouTube {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    text-align: center;
}

.history_movie iframe {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

@media screen and (max-width: 768px) {
  .history_content {
    flex-wrap: wrap;
  }
  .history_text {
    width: calc(100% - 70px);
    padding-left: 70px;
  }
  .history_mesage img {
    max-width: 150px;
  }
  .history_year.blank {
    display: none;
  }
}