@charset "UTF-8";
/**
 * 基本情報
 */
body {
  color: #000;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  text-align: justify;
  text-justify: inter-ideograph;
  background: #fff;
  /*
  background: #fff;
   */
}

a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
a:hover img {
  opacity: .75;
}

/*IMGにSVGをしている親要素の横幅が指定してある必要あり*/
/*IEでこれがないと表示領域がおかしくなる場合がある*/
img[src$=".svg"] {
  width: 100%;
}

.contentIn {
  /*
  border: solid 1px rgba(255,0,0,.3);
   */
  /*background: #fab8b8;*/
  /*確認用です*/
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}
.contentIn + .contentIn {
  margin-top: 50px;
}
@media only screen and (max-width: 767px) {
  .contentIn {
    width: 100%;
    padding: 0 3%;
  }
}

.clearfix:after, .contentIn:after, #gNavi:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 768px) {
  .contentIn {
    width: 100%;
    padding: 0 3%;
  }
}
* {
  word-break: break-all;
}

/*
section + section {
  margin-top: 34px;
}

 */
/** 
 * ヘッダー
 */
#header {
  background: #fff;
  border-bottom: solid 3px #abce23;
  margin-bottom: 20px;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 2;
  /*確認用です*/
  /*
  display: none;
   */
}

.headerIn {
  background: #B4803D;
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
}

@media screen and (max-width: 768px) {
  .headerIn {
    width: 100%;
    padding: 0 3%;
  }
}
.leadCopy {
  position: absolute;
  top: 0;
  right: 0;
}

.siteTitle {
  float: left;
  width: 18.5%;
  /* 185px/1000px */
  max-width: 185px;
  margin: 18px 0 15px 30px;
}

/** 
 * グローバルナビゲーション
 */
#gNavi {
  list-style-type: none;
  float: right;
  position: absolute;
  right: 20px;
  bottom: 20px;
}
#gNavi li {
  position: relative;
  /*
  width: 20%;
   */
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
#gNavi li + li {
  border-left: dotted 3px #eee;
}
#gNavi li:last-child {
  border: none;
}
#gNavi li a {
  color: #008856;
  display: block;
  font-size: 15px;
  font-weight: bold;
  margin: 0;
  padding: 15px 0 11px;
  line-height: 1;
  text-decoration: none;
  position: relative;
}
#gNavi li a span {
  color: #abce23;
  font-size: 10px;
  display: block;
  margin-top: 5px;
}
#gNavi li a:not(.btn) {
  padding: .8em 3.5em .8em 1.5em;
}
#gNavi li a:not(.btn):before {
  content: '●';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: .8em;
  color: #008856;
  font-size: 140%;
}
#gNavi li a:not(.btn):after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.75em;
  width: 4px;
  height: 4px;
  border-bottom: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(45deg) translateY(-40%);
  -webkit-transform: rotate(45deg) translateY(-50%);
  transform: rotate(45deg) translateY(-50%);
}
#gNavi li:first-child a:not(.btn) {
  padding-left: 0;
}

@media screen and (max-width: 1130px) {
  #gNavi li a {
    font-size: 14px;
  }
  #gNavi li a:not(.btn) {
    padding: .8em 3.5em .9em 1.5em;
  }
  #gNavi li a:not(.btn):after {
    top: 47%;
  }
}
@media screen and (max-width: 1080px) {
  #gNavi li a {
    font-size: 12px;
  }
  #gNavi li a:not(.btn) {
    padding: .8em 3.5em 1.2em 1.5em;
  }
}
@media screen and (max-width: 1000px) {
  #gNavi {
    right: 10px;
  }
  #gNavi li a {
    font-size: 10px;
  }
  #gNavi li a:not(.btn) {
    padding: .8em 3.5em 1.2em 1.5em;
  }
}
@media screen and (max-width: 900px) {
  .siteTitle {
    width: 7.0%;
    margin: 18px 0 15px 10px;
  }

  .btn.btn-simple {
    font-size: 10px !important;
    padding: .6em 2em .6em .3em !important;
    width: auto;
  }
}
@media screen and (max-width: 768px) {
  .siteTitle {
    width: 20%;
    margin-left: 5%;
  }

  .btn.btn-simple {
    font-size: 14px !important;
    width: 80%;
    margin: 0 auto !important;
  }
}
@media screen and (max-width: 768px) {
  #gNavi {
    /*
    display: none;
     */
    /*
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    z-index: 999;

     */
    bottom: 50%;
    transform: translateY(50%);
  }

  #gNavi.open {
    display: block;
  }

  #gNavi ul {
    background: #fff;
  }

  #gNavi li {
    width: 100%;
    float: none;
    text-align: left;
    border-right: none;
    border-bottom: solid 1px #abce23;
    /*
        &:last-child {
          padding: 2em 0;
        }
    
     */
  }
  #gNavi li + li {
    border-left: none;
  }
  #gNavi li a {
    font-size: 12px !important;
    padding-left: 0;
  }
  #gNavi li a.btn-simple {
    width: auto;
  }
  #gNavi li:first-child a:not(.btn) {
    padding-left: 1.5em;
  }
}
/** 
 * メインコンテンツ
 */
#content {
  /*
  margin: 30px 0 0;
   */
  margin: 84px 0 0;
}
@media only screen and (max-width: 767px) {
  #content {
    margin-top: 66px;
  }
}

/** 
 * フッター
 */
#footer {
  background: #a8d056;
  padding-top: 90px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  #footer {
    padding-top: 45px;
  }
}

.footerIn {
  /*
  background: #fff;
   */
  /*確認用です*/
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 0 25px;
}

.footerIn .siteTitle {
  margin-top: 0;
  margin-right: 20px;
}

.fNavi {
  float: right;
  list-style-type: none;
  /*
  width: 64.375%;
  max-width: 824px;

   */
  padding: 0;
}

#footer .nav.utility {
  width: 100%;
  float: left;
}

#footer .nav.utility li {
  font-size: 12px;
  display: inline-block;
  padding: 3px 14px;
}
#footer .nav.utility li + li {
  border-left: dotted 2px #fff;
}
#footer .nav.utility li a {
  color: #fff;
}

.copyright {
  color: #fff;
  font-size: 10px;
  float: left;
  padding-top: 3px;
}

@media screen and (max-width: 768px) {
  .footerIn {
    width: 96%;
    padding: 0 auto;
  }

  .footerIn .siteTitle {
    float: none;
    width: 100%;
    margin: 0 auto;
  }

  .footerIn .clearfix:after {
    content: none;
  }

  .fNavi {
    float: none;
    list-style-type: none;
    width: 100%;
    max-width: none;
    padding: 0;
  }

  #footer .nav.utility {
    display: block;
    text-align: center;
    padding: 1em 0;
  }

  #footer .nav.utility li + li {
    border: none;
  }

  #footer .nav.utility a {
    display: block;
  }

  .copyright {
    padding: 3% 0;
    float: none;
    text-align: center;
  }
}