@charset "utf-8";

/*
----------------------------------------
750
----------------------------------------
*/

@media screen and ( max-width: 750px ) {

  html[lang=ja] {
    margin-top: 0 !important;
  }

  #wpadminbar {
    display: none;
  }

  .pc-none {
    display: block;
  }

  .sp-none {
    display: block;
  }

  /* form */

  input[type=text],
  input[type=search],
  input[type=tel],
  input[type=tel],
  input[type=url],
  input[type=email],
  input[type=password],
  input[type=date],
  textarea, select {
    width: 100%;
    margin: 5px 0;
    min-width: 0;
  }

  input[type=email],
  input[type=tel],
  input.l {
    margin: 5px 0;
  }

  textarea {
    margin: 5px 0 !important;
  }

  body {
    font-size: 1.3rem;
  }

  body.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    min-height: 100%;
    overflow: hidden;
  }

  #wrapper {
    padding-top: 60px;
  }

  #wrapper > header {
    background: #fff;
    z-index: 999999;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /*padding-top: 2rem; */
  }

  #wrapper > header h1 {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    line-height: 2rem;
  }

  .wrap {
    padding: 0;
  }

  #wrapper > header .wrap {
    -js-display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
  }

  #wrapper > header .nav-wrap > .wrap {
    padding: 10px;
    /*background: #fff;*/
  }

  #wrapper > header .identity {
    padding: 5px;
  }

  #wrapper > header .identity img {
    max-height: 30px;
  }

  #wrapper > header .h-cont,
  #wrapper > header .h-tel {
    display: none;
  }

  /* sp-btn */

  #sp-btn {
    display: block;
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    position: fixed;
    right: 10px;
    top: 10px;
    z-index: 99999999;
    transition: all .6s;
  }

  #sp-btn span {
    display: inline-block;
    box-sizing: border-box;
    transition: all .5s;
  }

  #sp-btn span {
    position: absolute;
    left: 10px;
    right: 10px;
    height: 2px;
    background: #000;
  }

  #sp-btn span:nth-of-type(1) {
    top: 12px;
  }

  #sp-btn span:nth-of-type(2) {
    top: 19px;
  }

  #sp-btn span:nth-of-type(3) {
    top: 26px;
  }

  #sp-btn p {
    font-family: 'Roboto', sans-serif;
    font-size: 1.1rem;
    line-height: .9;
    text-transform: uppercase;
    margin: 0;
  }

  header.active #sp-btn span:nth-of-type(1) {
    -webkit-transform: translateY(7px) rotate(-45deg);
    transform: translateY(7px) rotate(-45deg);
  }
  header.active #sp-btn span:nth-of-type(2) {
    opacity: 0;
  }
  header.active #sp-btn span:nth-of-type(3) {
    -webkit-transform: translateY(-7px) rotate(45deg);
    transform: translateY(-7px) rotate(45deg);
  }

  header.active #sp-btn {
    position: fixed;
    top: 20px;
    right: 0;
  }

  header.active .fixed #sp-btn {
    top: 0;
  }

  #overlay {
    display: block;
    background: rgba( 0,0,0,.85 );
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    z-index: -999;
    transition: all .6s;
  }

  header.active #overlay {
    z-index: 99999;
    opacity: 1;
    visibility: visible;
  }

  /* g-anv */

  #g-nav,
  #g-nav.fixed {
    padding: 60px 0;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    right: 0;
    left: 120vw;
    bottom: 0;
    overflow: auto;
    background: #fafafa;
    color: #000;
    transition: all .6s;
  }

  .nav-wrap.fixed #g-nav {
    padding: 40px 0 60px;
  }

  header.active #g-nav {
    left: 20vw;
  }

  #g-nav > ul.wrap {
    flex-direction: column;
    padding: 0;
    border: none;
    border-top: solid 1px #ddd;
  }

  #g-nav > ul > li {
    display: block;
    width: 100%;
    border: none;
    border-bottom: solid 1px #ddd;
    text-align:left;
  }

  #g-nav > ul::before,
  #g-nav > ul > li::before {
    display:none;
  }

  #g-nav > ul > li > a {
    color: #000;
    background: #fff;
    padding-left: 20px;
  }

  #g-nav > ul > li.home > a::before {
    display:none;
  }

  /* sub-menu */

  #g-nav li ul {
    position: relative;
    top: 0;
    left: 0;
    visibility: visible;
    opacity: 1;
    transition: all 0s;
  }

  #g-nav li a[href='#'],
  #g-nav li a[href='#']:hover {
    background: #fafafa url( ../img/common/arrow-bottom.svg ) right 15px center / 10px no-repeat;
  }

  #g-nav li a[href='#'].active {
    background: #fafafa url( ../img/common/arrow-top.svg ) right 15px center / 10px no-repeat;
  }

  #g-nav li:last-child ul {
    left: 0;
  }

  #g-nav li:hover ul {
    top: 0;
  }

  #g-nav li ul li {
    border-top: solid 1px #ccc;
    border-bottom: 0;
  }

  #g-nav li ul li:first-child {
    border-top: 0;
  }

  #g-nav li ul a,
  #g-nav li ul a:hover {
    text-align: center;
    white-space: normal;
    background: #eee;
    color: #000;
  }

  /* page-ttl */

  #page-ttl {
    padding: 30px 15px;
  }

  #page-ttl .box {
    padding: 15px 30px;
  }

  #page-ttl .box h2 {
    font-size: 2rem;
  }

  #page-ttl .box p.en {
    font-size: 1.5rem;
  }

  /* topic-path */

  .topic-path {
    padding: 5px 15px;
    margin-top: 10px;
    margin-bottom: 0;
    font-size: 1.2rem;
  }

  .contents h1,
  .contents h2,
  .contents h3,
  .contents h4,
  .contents h5,
  .contents h6 {
    margin-bottom: 10px;
  }

  .contents h1 {
    font-size: 2rem;
  }

  .contents h2 {
    font-size: 1.8rem;
  }

  .contents h3 {
    font-size: 1.6rem;
  }

  .contents h4,
  .contents h5,
  .contents h6 {
    font-size: 1.5rem;
  }

  .contents .heading-01,
  .contents .heading-02,
  .contents .heading-03 {
    margin-bottom: 15px;
  }

  .contents .heading-01 {
    font-size:1.8rem;
      }

  .contents .heading-02 {
    font-size: 1.8rem;
    padding: 8px 0;
    border-top: 4px double #74ddbe;
    border-bottom: 4px double #74ddbe;
  }

  .contents .heading-01.ranking span{
    margin-left: 20px;
  }

  .contents .heading-01.ranking::before,
  .contents .heading-01.tag::before {
    left:10px;
  }

  .contents .heading-01.ranking::before {
    margin-top: -7px;
    width: 20px;
    height: 12px;
  }

  .contents .heading-01.tag::before {
    margin-top: -7px;
    width: 20px;
    height: 12px;
  }

  .ttl-box-01 .ttl {
    font-size: 1.6rem;
    min-height:48px;
    box-sizing: border-box;
    padding-left: 65px;
  }

  .ttl-box-01 .num i {
    font-size: 1.5rem;
  }
  .ttl-box-01 .num {
    font-size: 1.1rem;
    width: 48px;
    min-height: 48px;
  }

  .ttl-box-02 time {
    font-size:1.3rem;
  }


  .search-msg {
    margin: 15px 0;
  }

  /* layout */

  #contents {
    display: block;
    margin-top: 0;
    padding-bottom: 0;
  }

  #main-contents {
    width: 100%;
    padding: 0;
    margin-bottom: 0;
  }

  #main-contents section {
    margin-bottom: 15px;
  }

  #sidebar {
    width: 100%;
    background: #fafafa;
    padding: 0;
    box-sizing: border-box;
  }
  #sidebar h2.ttl.rank::before {
    margin-top: -5px;
    width: 15px;
    height: 10px;
  }
  #sidebar h2.ttl.special::before {
    margin-top: -5px;
    width: 15px;
    height: 10px;
  }
  #sidebar h2.ttl.feature::before {
    margin-top: -5px;
    width: 15px;
    height: 10px;
  }
/*
  #sidebar > div {
    margin: 0;
  }
*/
  #sidebar > .search-form {
    padding: 15px;
    margin: 0;
    border-bottom: solid 1px #ccc;
  }

  #sidebar h2 {
    background-color: black;
    border: none;
    padding: 10px 15px;
    border-bottom: solid 1px #ccc;
    color: white;
  }

  #sidebar h2 .en {
    right: 15px;
    bottom: 10px;
  }

  #sidebar .rank-list {
    margin: 20px auto;
    width: 90%;
  }

  #sidebar .rank-list a {
    padding: 15px;
  }

  #sidebar .rank-box .btn-01 a {
    font-size: 1.4rem;
    width: 90%;
  }

  #sidebar h2.ttl {
    font-size: 1.4rem;
    padding: 8px 10px;
  }

  #sidebar .article-list {
      width: 90%;
    margin: 20px auto;
  }

/*
  #sidebar .rank-list figure {
    width: 80px;
    line-height: .8;
    margin: 0;
  }

  #sidebar .rank-list .txt {
    width: calc( 100% - 80px );
  }

  #sidebar .rank-list a::before {
    top: 0;
    left: 0;
    border-radius: 0;
  }
*/
  .menu-list > ul {
    margin: 0;
  }

  .menu-list a {
    padding: 15px;
  }

  #sidebar .back-link {
    margin: 15px;
  }

  #sidebar .bnr {
    padding: 15px;
    margin: 0;
  }

  #sidebar .bnr figcaption {
    font-size: 1.2rem;
  }

  .menu-list.box-menu {
    display: none;
  }

  footer {
    background: #eee;
  }

  footer .wrap {
    padding: 0;
  }

  footer #bottom-nav > * {
    width: 100%;
  }

  footer .store-info {
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
  }

  footer .store-info .sns {
    line-height: 1.2;
  }

  footer .footer-contents.flex {
    flex-direction: column-reverse;
    margin: 0;
  }

  footer .store-img {
    max-width: 100%;
    padding-bottom: 0;
  }

  footer #bottom-nav {
    width: 100%;
    padding: 0;
  }

  footer #bottom-nav h2 {
    padding: 5px 15px;
    margin: 0;
    border: none;
    text-align: center;
    font-size: 1.4rem;
    background: #555;
    color: #fff;
  }

  footer #bottom-nav .bottom-menu {
    flex-direction: column;
    background: #fff;
    margin: 0;
  }

  footer #bottom-nav .bottom-menu > li {
    margin: 0;
    border-bottom: solid 1px #ccc;
  }


  footer #bottom-nav .bottom-menu > li ul li{
    border-top: solid 1px #ccc;
  }

  footer #bottom-nav li li a {
    display: block;
    font-size: 1.3rem;
     margin-left: 0;
     padding: 10px 10px 10px 4.5rem;
  }

  footer #bottom-nav .bottom-menu > li > a {
    display: block;
    padding: 15px 30px 15px 15px;
    background: url( ../img/common/arrow-right.svg ) right 15px center / 8px no-repeat;
  }

  footer #bottom-nav .sub-menu {
    margin: 0;
  }

  footer #bottom-nav .sub-menu li {
    border-top: solid 1px #ccc;
  }

  footer #bottom-nav .sub-menu a {
    margin: 0;
    text-decoration: none;
    display: block;
    padding: 15px 30px 15px 15px;
    background: #fafafa url( ../img/common/arrow-right.svg ) right 15px center / 8px no-repeat;
  }

  .copyright {
    padding: 10px 15px 50px;
  }

  .copyright small {
    font-size: 1.2rem;
  }

  #bottom-fix {
    left: inherit;
    right: 0;
    bottom: 0;
    align-items: center;
    background: #fafafa;
    width:80px;
  }

  #bottom-fix .tel {
    display: block;
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 1.3rem;
  }

  #bottom-fix .tel a {
    display: block;
    line-height: 1;
  }

  #bottom-fix .tel span {
    display: block;
    font-size: 2rem;
  }

  #bottom-fix .mail {
    display: block;
  }

  /* column */

  .flex .box.pic {
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
  }

  .flex.reverce .box.pic {
    padding: 0;
  }

  .flex .box.txt {
    width: 100%;
  }

  .flex.box-02 .box,
  .flex.box-03 .box,
  .flex.box-04 .box,
  .flex.box-05 .box,
  .flex.box-06 .box {
    width: 100%;
  }

  /* flow */

  .flow.flex .box {
    padding: 30px 0 0 0;
    margin-top: 30px;
  }

  .flow.flex .box:first-child {
    padding: 0;
    margin-top: 0;
  }

  .flow.flex .box:before {
    font-family: 'FontAwesome';
    content: '\f107';
    font-size: 4rem;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate( -50%, -50% );
  }

  /* slider */

  .slider.thumb-slider {
    margin: 30px 0 0 0;
  }

  .slider figure {
    line-height: .8;
  }

  .slider.thumb-slider + .thumb figure {
    padding: 3px 2px;
  }

  /* bnr */

  #contents .bnr {
    display: block;
  }

  #contents .bnr figure {
    padding: 0;
  }

  /* post */

  .cat-list {
    margin-bottom: 0;
  }

  .post .post-header h1,
  .post .post-header h2 {
    margin-bottom: 0;
  }

  .post .post-header {
    padding: 15px;
    margin-bottom: 0;
  }

  .post .metadata {
    font-size: 1.2rem;
  }

  /* post-contents */

  .post .post-contents {
    padding: 15px 15px 5px;
  }

  .post .post-contents h1,
  .post .post-contents h2,
  .post .post-contents h3,
  .post .post-contents h4,
  .post .post-contents h5,
  .post .post-contents h6 {
    margin-bottom: 15px;
  }

  .post .post-contents h2 {
    padding: 7px 15px;
    font-size: 1.8rem;
  }

  .post .post-contents h3 {
    padding: 5px 15px 8px;
    font-size: 1.6rem;
  }

  .post .post-contents h3::before {
    width: 3px;
  }

  .post .post-contents h4 {
    font-size: 1.5rem;
    padding: 0 0 2px 15px;
  }

  .post .post-contents h4::before {
    top: .7em;
  }

  .post .post-contents h5 {
    font-size: 1.4rem;
    padding: 0 0 2px 15px;
  }

  .post .post-contents h6 {
    font-size: 1.2rem;
    padding: 0 0 2px 17px;
  }
  .post .post-contents .btn-01 a, .post .post-contents .btn-02 a, .post .post-contents .btn-03 a {
    font-size: 1.3rem;
    width: 90%;
  }

  .post .post-contents p,
  .post .post-contents a {
    font-size: 1.3rem;
  }

  .post .post-contents hr {
    margin: 15px 0;
  }

  .post .post-contents p {
    margin-bottom: 15px;
  }

  .post .post-contents ul,
  .post .post-contents ol {
    font-size: 1.3rem;
    margin-bottom: 15px;
    margin-left: 20px;
  }

  .post .post-contents blockquote {
    background: #eee;
    padding: 15px 15px 5px;
    margin-bottom: 15px;
    border-radius: 0;
  }

  .post .post-contents blockquote p,
  .post .post-contents blockquote ul,
  .post .post-contents blockquote ol {
    margin-bottom: 10px;
  }

  .post .post-contents table {
    margin-bottom: 15px;
  }

  #blog #ez-toc-container {
    padding: 15px;
  }

  #blog #ez-toc-container a {
    font-size: 1.4rem;
  }

  /* post-list */

  .post-list > h1 {
    margin: 15px;
  }

  .post-list .post-contents.flex {
    flex-direction: column;
    padding: 15px;
  }

  .post-list .post-contents figure {
    width: 100%;
    text-align: center;
  }

  .post-list .post-contents .txt {
    width: 100%;
    padding: 0;
  }

  .post-list .txt-wrap-box {
    margin: 45px auto;
    width: 90%;
  }

  /* post-nav */

  .post-nav {
    flex-direction: column;
    margin: 0;
    background: #eee;
    border-top: solid 1px #ccc;
  }

  .post-nav .back-link {
    display: none;
  }

  .post-nav .prev, .post-nav .next {
    width: 100%;
  }

  .post-nav img {
    width: 50px;
  }

  .post-nav .prev img {
    margin: 0 10px 0 0;
  }

  .post-nav .next img {
    margin: 0 0 0 10px;
  }

  .post-nav a {
    border-bottom: solid 1px #ccc;
  }

  .post-nav .prev a {
    padding: 10px 10px 10px 3rem;
    background: url( ../img/common/arrow-left.svg ) left 10px center / 8px no-repeat;
  }

  .post-nav .prev a:hover {
    background: url( ../img/common/arrow-left.svg ) left 5px center / 8px no-repeat;
  }

  .post-nav .next a {
    padding: 10px 3rem 10px 10px;
    background: url( ../img/common/arrow-right.svg ) right 10px center / 8px no-repeat;
  }

  .post-nav .next a:hover {
    background: url( ../img/common/arrow-right.svg ) right 5px center / 8px no-repeat;
  }

  /* page-nav */

  .page-nav .wp-pagenavi {
    margin: 0;
    padding: 15px 0;
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
  }

  /* author */

  .author-box {
    border: none;
    margin: 0 0 15px;
  }

  .author-box h3 {
    font-size: 1.6rem;
    letter-spacing: 4px;
    border-top: solid 1px #ccc;
  }

  .author-box .flex {
    flex-direction: column;
    padding: 15px;
  }

  .author-box .flex > figure {
    width: 100%;
    text-align: center;
  }

  .author-box figure + .txt {
    width: 100%;
    padding: 0;
  }

  .author-box .name {
    font-size: 1.5rem;
    padding: 5px 0;
    border-bottom: solid 1px #ccc;
    margin-bottom: 10px;
  }

  .author-box .name span {
    font-size: 1.2rem;
  }

  .author-box h4 {
    font-size: 1.5rem;
    margin: 10px 0;
  }

  .author-box .read {
    font-size: 1.2rem;
  }

  /* relation-post */

  .relation-post {
    padding: 0;
    margin-bottom: 0 !important;
  }

  .relation-post h2 {
    font-size: 1.6rem;
    margin-bottom: 0;
  }

  .relation-post .flex {
    flex-direction: column;
  }

  .relation-post .flex .post {
    -js-display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
    border-bottom: solid 1px #ccc;
  }

  .relation-post .flex figure {
    width: 95px;
    line-height: .8;
    margin: 0;
    padding-right: 15px;
    box-sizing: border-box;
  }

  .relation-post .flex figure img {
    width: 80px;
    height: 80px;
  }

  .relation-post .flex .txt {
    width: calc( 100% - 95px );
  }

  .relation-post .cat-list {
    margin-bottom: 0;
  }

  .relation-post .flex h3 {
    font-size: 1.5rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-bottom: 5px;
  }

  .relation-post .flex .excerpt {
    font-size: 1.2rem;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
/*
  .flex {
    margin-bottom: 15px;
  }

  .flex.col-02 > *,
  .flex.col-03 > *,
  .flex.col-04 > *,
  .flex.col-05 > *,
  .flex.col-06 > * {
    width: 100%;
    margin-bottom: 15px;
  }

  .contents .flex > * {
    padding: 0;
  }
*/

  .contents .flex > .step-01 {
    padding: 0 15px !important;
  }

  .flex figure {
    text-align: center;
  }

  .btn-01 {
    margin: 20px auto 5px;
      }

  #home .btn-01 {
    margin: 20px auto 5px;
      }

  .btn-01 a {
    font-size: 1.4rem;
    padding: 10px 20px 10px 10px;
  }
  .btn-01 a,
  .btn-01 a:hover {
    background-size: 10px !important;
  }

  .header-01 {
    margin: 15px 0;
  }

  .header-01 .en {
    font-size: 2.8rem;
  }

  .header-01 h2 {
    font-size: 1.4rem;
  }

  .header-01 .read {
    text-align: left;
    letter-spacing: 0;
  }

  .table-01 tr {
    -js-display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
  }

  .table-01 th,
  .table-01 td {
    width: 100%;
    box-sizing: border-box;
  }

  .table-01 th {
    padding: 10px 15px;
  }

  .table-02 th,
  .table-02 td {
    padding: 15px 10px;
  }

  .slider.slick-dotted.slick-slider {
    margin: 0 0 60px 0;
  }

  .slider .slick-dots {
    bottom: -35px;
  }

  /* page-contents */

  .page-contents {
    padding: 15px;
    margin-bottom: 15px;
  }

  .page-contents section {
    margin-bottom: 15px;
  }

  .page-contents h2 {
    margin-bottom: 15px;
    border-left: solid 5px #000;
    padding-left: 15px;
  }

  .page-contents p,
  .page-contents figure {
    margin-bottom: 10px;
  }

  .page-contents .flex,
  .page-contents .flex.img-right {
    flex-direction: column;
    margin-bottom: 5px;
  }

  .page-contents .flex figure {
    width: 100%;
  }

  .page-contents .flex figure + p {
    width: 100%;
  }

  .page-contents .img-left figure + p,
  .page-contents .img-right figure + p {
    padding: 0;
  }

  /* home */
/*
  #home .contents section {
    margin-bottom: 30px;
    padding: 0 15px;
  }
*/



  #home .mainimg .read {
    margin: 0 auto;
    width: 90%;
  }

  .popular-box .ttl-box-01 .num {
    width: 40px;
    min-height: 40px;
    font-size: 1rem;
  }

  .popular-box .ttl-box-01 .num i {
    font-size: 1.3rem;
  }

  #feature.blog-box .feature-1 .flex > figure,
  #feature.blog-box .feature-1 .flex > div {
    width: 100%;
  }


  #feature.blog-box .post {
    width: 100%;
  }

  #home .news-list a.flex {
    padding: 20px 4rem 20px 0;
  }

  #home .news-list .flex .date {
    width: 11rem;
  }

  #home .news-list .flex .ttl {
    width: calc( 100% - 11rem );
  }
/*
  #home .btn-01 {
    margin-top: 30px;
  }
*/
  #home .col-02 .read {
    font-size: 1.3rem;
  }

  #home .btn-02.en {
    margin-top: 20px;
    text-align: center;
  }

  #home .contents section.voice-box,
  #home .contents section.blog-box {
    padding: 0;
  }

  #home .voice-box .post,
  #home .blog-box .post {
    padding: 10px 15px;
  }

  #home .voice-box .post figure,
  #home .blog-box .post figure {
    margin-bottom: 10px;
  }

  #home .faq-box .flex > * {
    padding: 0;
    margin: 0;
  }

  #home .sp-description{
    display: block;
    font-size: 1.3rem;
    padding: 0 15px;
  }

  /* faq */

  #contents #faq-menu {
    padding: 15px 15px 0;
    margin: 5px 0 0;
    border: none;
  }

  #contents #faq-menu > div {
    width: 100%;
    margin-bottom: 15px;
  }

  #contents #faq-menu h2 {
    font-size: 1.5rem;
    padding: 10px 15px;
    margin-bottom: 15px;
  }

  #faq-menu li {
    margin-bottom: 5px;
  }

  #faq-menu li a {
    font-size: 1.4rem;
    padding: 5px 5px 5px 3.5rem;
  }

  #faq-menu li a:before {
    font-size: 1.3rem;
    line-height: 2.5rem;
    width: 2.5rem;
    height: 2.5rem;
    top: 5px;
  }

  #faq-menu.flex {
    flex-direction: column;
  }

  #faq-menu.flex .box {
    width: 100%;
    padding: 0;
    margin-bottom: 15px;
  }

  #faq-list {
    margin: 0;
  }

  #faq-list > div {
    padding: 20px 0;
  }

  #faq-list h2 {
    background: #555;
    color: #fff;
    padding: 10px 15px;
    border: none;
    font-size: 1.5rem;
    margin-bottom: 0;
  }

  #faq-list .faq-01 {
    padding: 0 15px;
    margin: 0;
  }

  .faq-01 dt {
    font-size: 1.6rem;
    padding: 20px 0 10px 4rem;
    border: none;
  }

  .faq-01 dt:before {
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    top: 20px;
  }

  .faq-01 dd:before {
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    top: 4px;
  }

  .faq-01 dd {
    font-size: 1.4rem;
    padding: 5px 0 15px 4rem;
  }

  /* voice */

  #voice .user, #voice .star {
    margin-bottom: 5px;
  }

  #voice .post-contents .thumb {
    width: 100%;
  }

  #voice .post-contents .txt {
    width: 100%;
    padding: 0;
  }

  #voice .faq-list {
    margin: 10px 0 0 0;
    padding: 0;
    background: transparent;
  }

  .staff-comment {
    padding: 15px;
  }

  .staff-comment .flex {
    flex-direction: column-reverse;
  }

  .staff-comment .comment {
    padding: 15px;
  }

  .staff-comment .flex > figure {
    width: 100%;
  }

  .staff-comment figure + .comment {
    width: 100%;
    margin-bottom: 25px;
  }

  .staff-comment figure + .comment::before,
  .staff-comment figure + .comment::after {
    top: auto;
    left: 50%;
    bottom: 0;
    transform: translate( -50%, 100% );
  }

  .staff-comment figure + .comment::before {
    border: solid 15px transparent;
    border-top: solid 15px #ccc;
  }

  .staff-comment figure + .comment::after {
    border: solid 13px transparent;
    border-top: solid 13px #fff;
  }

  /* company */

  #company .contents section {
    margin-bottom: 30px;
  }

  #company .philosophy-box .cont figure,
  #company .philosophy-box .cont p {
    margin-bottom: 10px;
  }

  #company .philosophy-box .read {
    padding: 0 15px;
  }

  #company .greeting-box .flex {
    flex-direction: column;
    padding: 0 15px;
  }

  #company .greeting-box figure {
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
  }

  #company .greeting-box figure + .txt {
    width: 100%;
  }

  #company .greeting-box .txt p {
    margin-top: 10px;
  }

  #company .contents section.company-box {
    padding: 0 15px;
  }

  #company .contents .table-01 th {
    width: 100%;
    text-align: left;
  }

  #company .contents section.outline-box {
    padding: 0 15px;
  }

  #company .map {
    margin: 0 15px 30px;
    padding-bottom: 250px;
  }

  /* staff */

  .staff-list .staff {
    padding: 15px;
    margin: 0;
    border: none;
    border-top: solid 1px #ccc;
  }

  .staff-list .name {
    font-size: 2rem;
    margin-bottom: 15px;
  }

  .staff-list .name .sub {
    font-size: 1.4rem;
  }

  .staff-list .flex {
    flex-direction: column;
  }

  .staff-list .staff figure {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }

  .staff-list .staff figure + .txt {
    width: 100%;
    padding: 0 !important;
  }

  .staff-list .staff .txt h3 {
    font-size: 1.6rem;
  }

  /* contact */

  #contact #g-nav {
    position: fixed !important;
  }


  #contact #contents {
    padding: 0 15px 40px;
  }

  .contact-info {
    margin-bottom: 15px;
  }

  .contact-info .flex {
    flex-direction: column;
  }

  .contact-info .cont {
    width: 100%;
    padding: 15px;
    margin-bottom: 15px;
  }

  .contact-info .tel a {
    font-size: 3rem;
  }

  .contact-info .line {
    margin-top: 10px;
  }

  .contact-info .thanks-img {
    margin: 20px 0 10px;
  }

  .contact-info .read {
    text-align: left;
    padding: 0 15px;
    margin-bottom: 15px;
  }

  #thanks .contact-info .flex {
    padding: 0 15px;
  }

  .contact-info .back-btn {
    margin: 0 0 40px;
  }

  .contents .flex > dt {
    width: 100%;
    border-bottom: solid 1px #999;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }

  .accbox.notice {
    margin: 15px 0;
    flex-direction: column;
    width: 100%;
    font-size: 1.2rem;
    box-sizing: border-box;
    padding: 0;
  }

  .accbox.notice ul {
    padding-left: 1.2rem;
    text-indent: -1.2rem;
  }

  .contents .flex.accbox >  label {
    display: block;
    width: 100%;
    padding: 10px;
  }

  .accbox .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
    width: 100%;
  }

  .accbox label {
    position: relative;
  }

  .accbox label:before {
    content: '';
    width: 15px;
    height: 15px;
    background: url(../img/common/icon-plus.svg) center center / 15px no-repeat;
    position: absolute;
    right: 35%;
    top: 50%;
    transform: translateY( -50% );
  }

  .cssacc:checked + label:before {
    background: url(../img/common/icon-minus.svg) center center / 15px no-repeat;
  }

  .accbox .accshow {
    padding: 0 15px 0;
    background: none;
  }

  .cssacc:checked + label + .accshow {
    height: auto;
    opacity: 1;
  }

  .accbox.notice li:last-child {
    margin: 5px 0 15px;
  }

  .form-step {
    margin: 15px 0;
    font-size: 1.1rem;
  }

  .form-step > p {
    padding: 0 0 0 30px !important;
  }

  #contact form#mailformpro > dl {
    flex-direction: column;
  }

  #contact form#mailformpro dl dt {
    width: 100%;
    background: transparent;
    padding: 5px 40px 5px 0;
    position: relative;
  }

  #contact form#mailformpro dl dt::after {
    content: '';
    width: 24px;
    height: 24px;
    background: url( ../img/common/icon-check.svg ) center center / 24px no-repeat;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY( -50% );
    opacity: 0;
    visibility: hidden;
    transition: all .2s;
  }

  #contact form#mailformpro dl dt.ok::after {
    opacity: 1;
    visibility: visible;
  }

  #contact .req-label {
    position: relative;
    right: 0;
    top: 0;
    vertical-align: middle;
    margin-left: 10px;
  }

  #contact form#mailformpro dl dd {
    width: 100%;
    padding: 5px 0 15px;
  }

  #contact dd .address {
    flex-direction: column;
    margin: 0;
  }

  #contact form#mailformpro dl dd::after {
    display: none;
  }

  #contact dd .flex > .ttl {
    width: 100%;
    padding: 5px 0;
  }

  #contact dd .flex > .input {
    width: 100%;
  }

  .pp-box {
    border: none;
    padding: 15px;
    margin: 0 0 25px;
    background: #fafafa;
  }

  .pp-box .address-box p {
    background: transparent;
    border: solid 1px #ddd;
    width: 100%;
    box-sizing: border-box;
  }

  .submit-box {
    text-align: center;
  }

  #mfp_loading,
  #mfp_loading_screen,
  #div#mfp_overlay_background {
    display: none !important;
  }

  #contact .agree label {
    display: block;
    text-align: center;
    padding: 15px 5px !important;
  }

  #contact button.mfp_element_submit,
  #contact button#mfp_button_send {
    display: block;
    width: 100%;
    margin: 20px 0;
    padding: 20px;
  }

  #contact form#mailformpro .flex label.mfp_not_checked,
  #contact form#mailformpro .flex label.mfp_checked {
    display: block;
    box-sizing: border-box;
    text-align: center;
  }

  #contact form#mailformpro .flex label.mfp_not_checked {
    background: #fafafa;
  }

  #contact form#mailformpro label.mfp_not_checked,
  #contact form#mailformpro label.mfp_checked {
    margin: 0;
    font-size: 1.4rem;
  }

  #contact .flex.inline {
    justify-content: space-between;
    margin: 0;
  }

  #contact .flex.inline > span {
    width: calc( 50% - 7.5px ) !important;
    margin: 0 !important;
  }

  #contact dd .flex.inline span {
    padding: 0;
  }

  #contact div#mfp_phase_confirm h4 {
    font-size: 2rem;
    margin: 20px 0;
  }

  #contact table#mfp_confirm_table {
    margin: 20px 0 0;
  }

  #contact table#mfp_confirm_table tr {
    -js-display: flex;
    display: -ms-flex;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
  }

  #contact table#mfp_confirm_table tr th {
    width: 100%;
    padding: 10px 15px;
  }

  #contact .remaining {
    right: 80px;
    left: 0;
    bottom: 0;
    display: block;
  }

  #contact .remaining .num {
    height: 38px;
    box-sizing: border-box;
  }

  #contact .remaining .read {
    display: none;
  }

  #contact .copyright {
    padding-bottom: 90px;
  }

  /* item */

  .wom-box-list{
    width: 90%;
    margin: 20px auto;
  }

  .wom-box-list .wom-box .wrap-box {
    padding: 10px 10px 20px;
  }

  .wom-box-list .wom-box .txt {
    padding: 15px 15px 20px 15px;
  }

  .wom-box-list .wom-box .txt .flex.col-02 > *{
    width:100%;
  }
  .wom-box-list .wom-box .read {
    font-size: 1.3rem;
  }

  .wom-box .wrap-box .flex.col-02 .btn-01 {
    width:100%;
    margin: 20px auto -5px;
    padding: 0;
  }

  .item-box .wrap-box .info-box .ofi,
  .item-box .wrap-box .info-box > div {
    width: 100%;
    padding: 10px 10px 0 10px;
    margin: 0;
  }

  .item-box-list{
    width: 90%;
    margin: 20px auto;
  }

  .item-box .wrap-box {
    padding: 0px 0px 10px;
  }

  .item-box .wrap-box .tag-list {
    padding: 4px 3px 4px 7px;
    margin: 10px auto 0;
  }

  .item-box .wrap-box .tag-list li {
    font-size: 1.2rem;
    margin: 0 4px 3px 0;
  }

  .item-box .wrap-box .info-box .small {
    font-size: 1.1rem;
  }

  .item-box .wrap-box .flex.col-02 .btn-01 {
    width:90%;
    margin: 20px auto -5px;
    padding: 0;
  }

  .osusume-box dt {
    font-size: 1.6rem;
  }

  .osusume-box {
    margin: 0 10px;
  }

  .osusume-box dd ul li {
    padding: 2px 0 9px 22px;
    margin: 0 0 12px;
  }

  .osusume-box dd ul li::before {
    margin-top: -5px;
    width: 14px;
    height: 12px;
    left:0;
  }

  #item.single .osusume-box {
    width: calc( 100% - 30px );
  }
  .txt-wrap-box.flex > figure {
    width: 100%;
    padding-bottom: 0;
  }

  .txt-wrap-box.flex > .txt h3{
    margin-top:0;
  }

  .txt-wrap-box.flex > .txt {
    width: 100%;
    padding-top: 0;
  }


  /* sitemap */

  .sitemap section.search-form {
    padding: 15px;
    margin: 0;
  }

  .sitemap section {
    margin-bottom: 0;
  }

  .sitemap .flex > * {
    width: 100%;
  }

  .contents .sitemap h2 {
    font-size: 1.4rem;
    text-align: center;
    color: #fff;
    background: #555;
    border: none;
    padding: 5px 15px;
    margin-bottom: 0;
  }

  .sitemap .menu-list > ul {
    border: none;
  }

  #sitemap footer #bottom-nav {
    display: none;
  }

}
