@charset "UTF-8";

@media screen and (min-width:960px) {
  #nav-wrap {
    box-shadow: 0 1px 3px #000;
  }

  #nav,
  #nav ul {
    width: 1200px;
    height: 42px;
  }

  #nav,
  #nav ul li a {
    text-align: center;
    padding-top: 2%;
    padding-bottom: 2%;
    transition: all 0.5s;
  }

  #nav ul li a:hover,
  body#page01 #nav ul li#nav01 a,
  body#page02 #nav ul li#nav02 a,
  body#page03 #nav ul li#nav03>a,
  body#page04 #nav ul li#nav04 a,
  body#page05 #nav ul li#nav05 a,
  body#page06 #nav ul li#nav06 a,
  body#page07 #nav ul li#nav07 a,
  body#page08 #nav ul li#nav08 a,
  body#page_faq #nav ul li#nav_faq a {
    /*text-shadow: 1px 1px 0 #777, 0 0 20px #000;*/
    background-color: #136e13;
  }

  #page-mama #nav ul li a:hover {
    background-color: #e83e3c !important;
  }

  #footer-nav ul li a:hover,
  #nav ul li a:hover {
    text-decoration: none
  }

  #footer-nav ul,
  #nav ul,
  #service-nav ul,
  #top-service-nav ul {
    margin: 0;
    list-style: none
  }

  .sb-slidebar,
  .sb-toggle-right {
    display: none
  }

  #footer-nav ul li,
  #footer-nav ul li a,
  #nav ul li,
  #nav ul li a {
    display: block;
    padding: 0
  }

  #footer-nav ul,
  #nav ul,
  #nav ul li a span,
  #service-nav ul,
  #top-service-nav ul,
  .icon-f:before {
    display: inline-block
  }

  #nav-wrap {
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0;
    /*    background: url(../images/nav/nav-back.png) center repeat-x;*/
    background: #51b751;
  }

  #page-mama #nav-wrap {
    background: #e95857;
  }

  #nav {
    margin: 0 auto;
    padding: 0
  }

  #nav ul {
    padding: 0;
    font-size: 15px;
    font-size: 1.5rem
  }

  #nav ul li {
    /*    width: 137px; */
    width: 132px;
    height: 50px;
    margin: 0;
    float: left
  }

  #nav ul li:last-child {
    /*    width: 138px */
  /*  width: 110px; */
  }

  #nav ul li a {
    margin: 6px 0;
    height: 38px;
    color: #FFF;
    letter-spacing: -0.05em;
    line-height: 1.2;
    border-left: 1px solid #afc5ab;
    box-sizing: border-box;
    text-shadow: 1px 1px 0 #777;
  }

  #nav ul li:last-child a {
    border-right: 1px solid #afc5ab;
  }

  #page-mama #nav ul li a {
    border-left: 1px solid #f99a99 !important;
  }

  #page-mama #nav ul li:last-child a {
    border-right: 1px solid #f99a99 !important;
  }

  #nav ul li#nav01 a,
  #nav ul li#nav05 a {
    padding: 2% 0 2%;
  }

  #nav ul li#nav02 a,
  #nav ul li#nav03 a,
  #nav ul li#nav04 a,
  #nav ul li#nav07 a,
  #nav ul li#nav08 a,
  #nav ul li#nav_faq a {
    padding: 12px 0 11px
  }

  #nav ul li#nav06 a {
    padding: 2% 0;
    letter-spacing: -.06em
  }

  #footer-nav {
    width: 617px;
    height: 25px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 12px;
    left: 510px
  }

  #footer-nav ul {
    width: 617px;
    height: 25px;
    padding: 0
  }

  #footer-nav ul li {
    margin: 0 5px 0 0;
    float: left
  }

  #footer-nav ul li a {
    height: 25px;
    margin: 0;
    font-size: 13px;
    font-size: 1.3rem
  }

  .icon-f:before {
    content: "\e900";
    color: #509D40;
    font-size: 15px;
    font-size: 1.5rem;
    margin: 0;
    padding: 0 2px 0 0
  }

  .icon-f:hover,
  body#home #footer-nav ul li#footer-nav01 a,
  body#law #footer-nav ul li#footer-nav04 a,
  body#page04 #footer-nav ul li#footer-nav05 a {
    color: #EF8200
  }

  #service-nav {
    width: 100%;
    eight: 122px;
    margin: 0;
    padding: 0
  }

  #service-nav ul {
    width: 100%;
    height: 122px;
    padding: 0
  }

  #service-nav ul li {
    display: block;
    width: 332px;
    height: 122px;
    margin: 0 0 0 15px;
    padding: 0;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    float: left
  }

  #service-nav ul li a {
    display: block;
    width: 332px;
    height: 122px;
    margin: 0;
    padding: 0
  }

  #service-nav ul li#service-nav01 a {
    background: url(../images/nav/service-nav.png)
  }

  #service-nav ul li#service-nav01 a:hover {
    background: url(../images/nav/service-nav.png) 0 -122px
  }

  #service-nav ul li#service-nav02 a {
    background: url(../images/nav/service-nav.png) -332px 0
  }

  #service-nav ul li#service-nav02 a:hover {
    background: url(../images/nav/service-nav.png) -332px -122px
  }

  #top-service-nav {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }

  #top-service-nav ul {
    width: 100%;
    height: 100%;
    padding: 0
  }

  #top-service-nav ul li {
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: left
  }

  #top-service-nav ul li.li-right {
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: right
  }

  #top-service-nav ul li a {
    display: block;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 ul {
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
  }

  #top-service-nav2 ul li {
    width: 50%;
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: left;
  }

  #top-service-nav2 ul li.li-right {
    margin-left: 30px;
  }

  #top-service-nav2 ul li a {
    display: block;
    width: 100%;
    height: 600px;
  }

  #top-service-nav01_2 {
    display: none !important;
  }

  /* ドロップダウンメニュー追加　20200818 */

  #nav li {
    position: relative;
    display: block;
    cursor: pointer;
  }

  #nav .dropdwn>li {
    display: inline;
  }

  #nav .dropdwn li a {
    display: block;
  }

  #nav .dropdwn_menu {
    width: 200px;
    display: none;
    position: absolute;
    margin-left: 0px;
    margin-top: -10px;
    padding: 10px 0 0;
  }

  #nav .dropdwn_menu_menu {
    width: 250px;
  }

  #nav .dropdwn_menu {}

  #nav .dropdwn_menu li {
    width: 200px !important;
    height: 45px !important;
    float: none;
  }

  #nav .dropdwn_menu li:last-child {
    width: 200px;
    float: none;
  }

  #nav .dropdwn_menu_menu li {
    width: 250px !important;
  }

  #nav .dropdwn_menu_menu li:last-child {
    width: 250px;
  }

  #nav .dropdwn_menu li a {
    height: 45px !important;
    padding: 12px 0 !important;
    margin: 0 !important;
    display: block;
    color: #fff;
    border: none;
    border-bottom: 1px solid #fff;
    background: #2ca003;
  }

  #page-mama #nav .dropdwn_menu li a {
    background: #d43e3e;
  }

  #nav .dropdwn_menu li:first-child a {}

  #nav .dropdwn_menu li:last-child a {
    border: none;
  }

  #nav .dropdwn_menu li a:hover {
    background: #e1b43c;
  }

  #page-mama #nav .dropdwn_menu li a:hover {
    background: #ecb45d;
  }

}

@media only screen and (min-width:481px) and (max-width:959px) {
  #header .sb-toggle-right {
    width: 9%;
    line-height: 1;
    display: block;
    height: auto;
    position: absolute;
    top: 0;
    right: 0
  }

  #header .sb-toggle-right img {
    display: block
  }

  .sb-slidebar {
    color: #fff
  }

  #sp-nav ul.menu {
    margin: 0;
    padding: 0;
    display: block;
    background-color: #89C97B
  }

  #sp-nav ul.menu li {
    font-size: 1.4rem;
    padding: 0;
    margin: 0
  }

  #sp-nav ul.menu li a {
    display: block;
    vertical-align: middle;
    background: url(../images/common/nav_icon.png) 1rem 46% no-repeat;
    background-size: 1.4%;
    margin: 0;
    padding: 1.2rem 0 1.2rem 2rem;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    text-shadow: 1px 1px 0 #777
  }

  #sp-nav .dropmenu_p {
    width: 100%;
    display: block;
    vertical-align: middle;
    background: url(../images/common/nav_icon2.png) 0.5rem 18px no-repeat;
    background-size: 3%;
    margin: 0;
    padding: 1.2rem 0 1.2rem 2rem !important;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    text-shadow: 1px 1px 0 #777
  }

  #sp-nav ul.menu li a:hover {
    text-decoration: none
  }

  #sp-nav ul.menu .sub,
  #sp-nav ul.menu .sub a {
    padding: 0;
    margin: 0
  }

  #top-service-nav {
    width: 94%;
    height: 100%;
    margin: 0 auto;
    padding: 0
  }

  #top-service-nav ul {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    gb padding: 0;
    list-style: none
  }

  #top-service-nav ul li {
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: left
  }

  #top-service-nav ul li.li-right {
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: right
  }

  #top-service-nav ul li a {
    display: block;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 ul {
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
  }

  #top-service-nav2 ul li {
    width: 50%;
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: left;
  }

  #top-service-nav2 ul li.li-right {
    margin-left: 30px;
  }

  #top-service-nav2 ul li a {
    display: block;
    width: 100%;
    height: 600px;
  }

  #footer-nav,
  #nav-wrap {
    display: none
  }

  #top-service-nav01_2 {
    display: none !important;
  }

  #sp-nav .dropmenu_p {
    width: 100%;
    display: block;
    vertical-align: middle;
    background: url(../images/common/nav_icon2.png) 0.5rem 18px no-repeat;
    background-size: 3%;
    margin: 0;
    padding: 1.2rem 0 1.2rem 2rem !important;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    text-shadow: 1px 1px 0 #777
  }

  .dropmenu_p a {
    cursor: pointer;
  }

  .dropmenu_c {
    width: 100%;
    clear: both;
    margin: 12px 0 0 -2rem;
  }

  .dropmenu_c li {
    list-style: none !important;
  }

  .dropmenu_c li a {
    background: url(../images/common/nav_icon.png) 3rem 46% no-repeat #EF8200 !important;
    background-size: 1.4% !important;
    border-top: 1px solid #fff !important;
    border-bottom: 0px !important;
    padding: 1.2rem 0 1.2rem 4rem !important;
  }

}

@media screen and (min-width:320px) and (max-width:480px) {
  #header .sb-toggle-right {
    position: fixed;
    right: 0;
    top: 0;
    width: 58px;
    height: auto;
    display: block;
    z-index: 9999;
    overflow-y: auto
  }


  #header .sb-toggle-right img {
    display: block
  }

  .sb-slidebar {
    color: #fff
  }

  #sp-nav ul.menu {
    margin: 0;
    padding: 0;
    display: block;
    background-color: #6CBB5A
  }

  #sp-nav ul.menu li {
    font-size: 1.4rem;
    padding: 0;
    margin: 0
  }

  #sp-nav ul.menu li a {
    display: block;
    vertical-align: middle;
    background: url(../images/common/nav_icon.png) 1rem 46% no-repeat;
    background-size: 1.4%;
    margin: 0;
    padding: 1.2rem 0 1.2rem 2rem;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    text-shadow: 1px 1px 0 #777
  }

  #sp-nav ul.menu li a:hover {
    text-decoration: none
  }

  #sp-nav ul.menu .sub,
  #sp-nav ul.menu .sub a {
    padding: 0;
    margin: 0
  }

  #nav-wrap {
    display: none
  }

  #top-service-nav {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }

  #top-service-nav ul {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
  }

  #top-service-nav ul li {
    display: block;
    margin: 0 auto 15px;
    padding: 0;
    float: none;
    width: 100%
  }

  #top-service-nav ul li.li-right {
    display: block;
    margin: 0 0 15px;
    padding: 0;
    float: none;
    width: 100%
  }

  #top-service-nav ul li a {
    display: block;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0
  }

  #top-service-nav2 ul {
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
  }

  #top-service-nav2 ul li {
    width: 50%;
    display: block;
    margin: 0 0 20px;
    padding: 0;
    float: left;
  }

  #top-service-nav2 ul li.li-right {
    margin-left: 15px;
  }

  #top-service-nav2 ul li a {
    display: block;
    width: 100%;
    height: 600px;
  }



  #footer-nav {
    display: none
  }

  #sp-nav .dropmenu_p {
    width: 92%;
    display: block;
    vertical-align: middle;
    background: url(../images/common/nav_icon2.png) 0.5rem 18px no-repeat;
    background-size: 3%;
    margin: 0;
    padding: 1.2rem 0 1.2rem 2rem !important;
    border-bottom: 1px solid #FFF;
    color: #FFF;
    text-shadow: 1px 1px 0 #777
  }

  .dropmenu_p a {
    cursor: pointer;
  }

  .dropmenu_c {
    width: calc(100% + 2rem);
    clear: both;
    margin: 12px 0 0 -2rem;
  }

  .dropmenu_c li {
    list-style: none !important;
  }

  .dropmenu_c li a {
    background: url(../images/common/nav_icon.png) 3rem 46% no-repeat #EF8200 !important;
    background-size: 1.4% !important;
    border-top: 1px solid #fff !important;
    border-bottom: 0px !important;
    padding: 1.2rem 0 1.2rem 4rem !important;
  }

}