@charset "utf-8";
@font-face {
  font-family: YuGothicM;
  src: local("Yu Gothic Medium")
}

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: 400;
  font-size: 100%;
  vertical-align: baseline;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color: #1e1813;
  -webkit-font-smoothing: antialiased
}

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

html {
  overflow-y: scroll
}

blockquote, q {
  quotes: none
}

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

, input, textarea {
  margin: 0;
  padding: 0
}

ol, ul {
  list-style: none
}

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

caption, th {
  text-align: left
}

sub {
  font-size: 90%
}

a:focus {
  outline: 0
}

.clearfix {
  min-height: 1px
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0
}

* html .clearfix {
  zoom: 1
}

:root img {
  border: none\0/
}

.both {
  clear: both
}

.inline_block {
  display: inline-block
}

a {
  text-decoration: none
}

a:hover {
  opacity: .7;
  -moz-opacity: .7
}

a:hover img {
  opacity: .8;
  -moz-opacity: .8
}

.pc_main {
  display: block
}

.sp_main {
  display: none
}

*, :after, :before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box
}

@media screen and (max-width:768px) {
  img {
    width: 100%;
    height: auto
  }
  .pc_main {
    display: none
  }
  .sp_main {
    display: block
  }
}

.wrap {
  width: 100%;
  margin: 86px auto 0 auto
}

article .wrap:first-child {
  margin: 0 auto 0 auto
}

article .wrap:last-child {
  margin-bottom: 0
}

.charcoalgray {
  background: #3e3228
}

.inner {
  position: relative;
  width: 984px;
  margin: 0 auto;
  padding: 0 10px
}

.cont-inner {
  width: 820px;
  margin-top: 0
}

@media screen and (max-width:768px) {
  .inner {
    width: 100%
  }
  .col2left, .col2right {
    float: none;
    width: 100%
  }
}

#header.fixed {
  position: fixed
}

#header .inner {
  width: 100%;
  padding: 20px 20px 0 20px
}

#header .wrap:first-child {
  height: 60px;
  margin: 10px 0 0 0;
  background: #fff
}

#header .wrap:nth-child(2) {
  padding: 0;
  background: #3e3228
}

#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #3e3228;
  border-bottom: 4px solid #e50012;
  z-index: 99
}

#header h1 {
  display: inline-block;
  padding: 10px 0 0 10px
}

#header h1 a {
  display: block;
  width: 100%;
  height: 100%
}

#header h1.sp_main {
  display: none
}

#header h1 object, #header h1 object img {
  width: auto;
  height: 36px
}

@media screen and (max-width:768px) {
  #header .wrap:first-child {
    position: fixed;
    top: 0;
    left: 0;
    height: 60px;
    margin: 0;
    background: #4e454a;
    z-index: 10
  }
  #header h1 {
    width: 40%;
    margin: 10px 0 0 0
  }
  #header h1 {
    display: none
  }
  #header h1.sp_main {
    display: inline-block
  }
  .sub-menu .triangle {
    display: none!important
  }
}

#head_navi {
  position: relative;
  float: right;
  width: 650px;
  margin: 20px 0 12px 0
}

#smal_link {
  position: absolute;
  display: inline-block;
  top: 1px;
  right: 0
}

#smal_link li {
  float: left;
  margin-right: 30px;
  color: #113051
}

#smal_link li a {
  display: block;
  width: 100%;
  height: 100%;
  padding-left: 28px;
  color: #fff
}

#smal_link li:last-child {
  margin-right: 0
}

#smal_link li:first-child a {
  background: url(../img/hd_ico_cop_wht.png) no-repeat 2px 0
}

#smal_link li:nth-child(2) a {
  background: url(../img/hd_ico_site_wht.png) no-repeat 1px 0
}

#smal_link li:last-child a {
  background: url(../img/hd_ico_mail_wht.png) no-repeat 0 4px
}

.nav_inner {
  right: 0;
  background: #3e3228
}

.nav {
  border: width:57.3%
}

.nav li {
  flex: 1;
  position: relative;
  font-size: 14px
}

.nav li:first-child::before {
  content: '';
  position: absolute;
  top: 10px;
  left: 0;
  display: inline-block;
  width: 1px;
  height: 20px;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.nav li::after {
  content: '';
  position: absolute;
  top: 10px;
  right: 0;
  display: inline-block;
  width: 1px;
  height: 20px;
  -moz-transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%)
}

.nav li a {
  text-align: center;
  padding-top: 4px;
  padding-bottom: 3px;
  color: #fff
}

.nav li a:hover {
  background: #6c5644;
  opacity: 1;
  -moz-opacity: 1
}

.mean-container .mean-nav ul ul, .nav .sub-menu {
  background: #3e3228;
  overflow: auto!important;
  -webkit-overflow-scrolling: touch!important
}

.sub-menu .triangle {
  display: none;
  width: 20px;
  height: 0;
  border-style: solid;
  border-width: 11px 9px 0 9px;
  border-color: #c00 transparent transparent transparent
}

@media only screen and (max-width :768px) {
  #header {
    padding: 10px 0;
    height: 60px
  }
  .h_logo {
    width: 200px;
    position: absolute;
    top: 18px;
    left: 10px;
    z-index: 100
  }
  #gNav .nav {
    overflow: auto;
    -webkit-overflow-scrolling: touch
  }
  .mean-nav .container {
    padding: 0
  }
  .nav li {
    border-right: #113051 1px dotted
  }
  .nav li:first-child::before {
    content: none
  }
  .nav li::after {
    content: none
  }
  .nav li:nth-child(even) {
    border-right: none
  }
  .nav li:last-child {
    border-right: #113051 1px dotted
  }
  nav li .fa {
    display: none
  }
}

#breadcrumbs {
  padding: 5px 0 0 0
}

#breadcrumbs li {
  float: left;
  font-size: 14px;
  text-shadow: 0 0 5px #fff
}

#breadcrumbs li::after {
  content: ' ＞ '
}

#breadcrumbs li:last-child::after {
  content: none
}

#breadcrumbs li a {
  color: #0076f8;
  text-shadow: 0 0 5px #fff
}

#pagetop {
  position: fixed;
  width: 50px;
  right: 0;
  bottom: 0;
  font-size: 18px;
  line-height: 1.2em;
  z-index: 100
}

#pagetop span {
  display: inline-block;
  color: #fff
}

#pagetop a {
  position: relative;
  padding: 0;
  z-index: 9999;
  display: block;
  width: 50px;
  height: 50px;
  background: #000;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: .2s ease-in-out
}

span#pagetop_triangle {
  width: 0;
  height: 0;
  margin-top: 7px;
  text-align: center;
  border-style: solid;
  border-width: 0 7.5px 13px 7.5px;
  border-color: transparent transparent #fff transparent
}

@media screen and (max-width:768px) {
  #pagetop {
    width: 60px;
    right: 0;
    bottom: 0;
    font-size: 14px
  }
  #pagetop a {
    width: 60px;
    height: 60px;
    font-size: 14px
  }
}

.bnner_list>ul {
  display: flex;
  justify-content: center
}

.bnner_list li {
  margin-right: 20px;
  line-height: 0
}

.bnner_list li:last-child {
  margin-right: 0
}

.bnner_list li a {
  line-height: 0
}

.bnner_list li a[target=_blank] {
  background: 0 0!important
}

.privacy_list {
  width: 350px;
  margin: 40px auto 0 auto
}

.privacy_list li {
  display: inline-block;
  width: 100%;
  background: rgba(0, 0, 0, .7);
  line-height: 1.5em;
  text-align: center;
  margin-bottom: 5px
}

.privacy_list ul li:last-child {
  background: rgba(255, 255, 255, 0.7);
  margin-top:10px;
  margin-bottom: 0
}

.privacy_list li a {
  display: inline-block;
  width: 100%;
  height: 100%;
  padding: 1px;
  color: #bbb
}
.privacy_list li:last-child a{
  color:#000;
}
.privacy_list .lightbox3 {
  background: 0 0
}

footer .wrap:first-child {
  margin-top: 80px;
  padding: 40px 0;
  background: #3e3228
}

footer .wrap:last-child {
  margin: 0;
  padding: 30px 0 25px 0;
  background: #1e1813 url(../img/bg_footer.png);
  border-width: 0 6px 10px 6px
}

footer .wrap:last-child .inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-bottom: 40px
}

footer .inner>ul {
  width: 308px;
  margin-right: 18px;
  font-size: 14px
}

footer .inner>ul.last {
  margin-right: 0
}

footer .level1 h3 {
  border-bottom: #cec0b8 1px solid;
  font-size: 16px;
  font-weight: 700
}

footer .level1>li:not(:first-child)::before {
  content: "・";
  color: #cec0b8
}

footer .level1 a {
  color: #cec0b8
}

footer .level2 {
  text-indent: 1.5em;
  font-size: 12px
}

footer #footer_name {
  height: 30px;
  background: #3e3228
}

footer #footer_name h4 {
  width: 100%;
  margin-top: 0;
  text-align: center;
  line-height: 30px;
  font-size: 12px;
  color: #fff
}

@media screen and (max-width:768px) {
  footer .wrap {
    min-height: 100px;
    margin: 100px 0 0 0;
    background-size: auto 100%
  }
  #footer_name {
    border: none;
    margin: 0
  }
  #footer_name h4 {
    width: 40%;
    margin: 0 auto
  }
}

.text-box {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid rgba(0, 0, 0, .16);
  border-radius: 0;
  color: inherit;
  font-family: inherit;
  font-size: 1em;
  padding: .4em .8em;
  width: 100%
}

.text-box:focus {
  border: 1px solid rgba(0, 0, 0, .32);
  box-shadow: none;
  outline: 0
}

.textarea-text {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-color: transparent;
  background-image: none;
  border: 1px solid rgba(0, 0, 0, .16);
  border-radius: 0;
  color: inherit;
  font-family: inherit;
  font-size: 1em;
  height: 100px;
  padding: .4em .8em;
  width: 100%
}

.textarea-text:focus {
  border: 1px solid rgba(0, 0, 0, .32);
  box-shadow: none;
  outline: 0
}

.select-box {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background: transparent url(https://haniwaman.com/wp-content/uploads/2018/12/form-css-arrow.png) no-repeat center right 8px/16px 16px;
  border: 1px solid rgba(0, 0, 0, .16);
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  font-family: inherit;
  font-size: 1em;
  padding: .4em .8em;
  width: 100%
}

.select-box::-ms-expand {
  display: none
}

.select-box:focus {
  border: 1px solid rgba(0, 0, 0, .32);
  box-shadow: none;
  outline: 0
}

.submit-btn {
  -webkit-appearance: none;
  background-color: rgba(0, 0, 0, .32);
  background-image: none;
  border: none;
  border-radius: 0;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 1em;
  margin: 0 0 1em;
  padding: .6em 2em;
  text-decoration: none
}

.submit-btn:focus, .submit-btn:hover {
  outline: 0
}

.submit-btn::-moz-foucus-inner {
  border: none;
  padding: 0
}

#right_navi {
  position: absolute;
  top: 0;
  right: 0;
  float: right;
  display: none;
  background: #3e3228
}

.right_navi_inner {
  width: 220px;
  padding: 10px
}

#right_navi h3 a {
  font-size: 18px;
  color: #fff
}

#right_navi li {
  margin-bottom: 5px
}

#right_navi li a {
  display: inline-block;
  width: 100%;
  color: #fff
}

p {
  line-height: 1.8em;
  margin-bottom: 25px
}

h2 {
  display: inline-block;
  margin: 0 0 15px 0;
  text-indent: -.2em;
  font-size: 30px;
  text-align: left;
  font-family: YuGothicM;
  src: local("Yu Gothic Medium")
}

.topfirst h2 {
  color: #fff;
  text-align: center
}

/*h2.wf-sawarabimincho {
  font-family: "Sawarabi Mincho"
}*/

h2.wf-sawarabimincho::before {
  content: "■";
  color: #e50012
}

.topfirst h2.wf-sawarabimincho::before {
  content: "";
  color: none
}

h3 {
  font-size: 22px;
  font-weight: 700
}

h4 {
  margin-top: 40px;
  font-size: 18px;
  font-weight: 700
}