@charset "UTF-8";
/* --------------------------------------------------
Block
-------------------------------------------------- */

/* Common Block --------------- */

.comm-blc {
  max-width: 1200px;
  width: 100%;
  padding: 80px 4%;
  margin: 0 auto;
  box-sizing: border-box;
}

.comm-blc.style-01 {
  max-width: 950px;
  width: 92%;
  padding: 60px 4%;
  margin: 0 auto;
  box-sizing: content-box;
}

.comm-blc.style-02 {
  max-width: 1200px;
  width: 92%;
  padding: 10px 4%;
  margin: 0 auto;
  box-sizing: border-box;
}

.comm-blc.style-03 {
  max-width: 1400px;
  width: 100%;
  padding: 80px 4%;
  margin: 0 auto;
  box-sizing: border-box;
}

@media screen and (max-width: 1000px) {
  .comm-blc {
    width: 100%;
  }
  .comm-blc.style-02 {
    width: 100%;
  }
}

.box-comm {
  padding-top: 7%;
  padding-bottom: 7%;
}

.min-box-comm {
  padding-top: 4%;
  padding-bottom: 4%;
}

.tiny-box-comm {
  padding-top: 2%;
  padding-bottom: 2%;
}

/* @media screen and (max-width: 1000px) {
  .comm-blc,
  .comm-blc.style-01 {
    padding: 20px 4%;
  }
} */

@media screen and (max-width: 767px) {
  .comm-blc,
  .comm-blc.style-01,
  .comm-blc.style-03 {
    padding: 40px 4%;
  }
}

.inner-blc-01 {
  padding-top: 40px;
}

.inner-blc-02 {
  padding-top: 62px;
}

@media screen and (max-width: 1000px) {
  .inner-blc-01 {
    padding-top: 20px;
  }
  .inner-blc-02 {
    padding-top: 40px;
  }
}

/* --------------------------------------------------
Title
-------------------------------------------------- */
.ttl-style-00 {
  position: relative;
  display: table;
  text-align: center;
  font-size: 160%;
  color: #1a5b27;
  padding-bottom: 15px;
  margin: 0 auto 40px;
}

.ttl-style-00::after {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  content: '';
  display: block;
  width: 80%;
  height: 1px;
  background-color: #1a5b27;
  margin: 0 auto;
}

.ttl-style-01 {
  position: relative;
  display: inline-block;
  text-align: center;
  font-size: 160%;
  color: #fd8f00;
  padding: 0 50px 15px;
  margin: 0 auto 40px;
}

.ttl-style-01::after,
.ttl-style-01::before {
  position: absolute;
  top: 4px;
  content: '';
  display: inline-block;
  width: 40px;
  height: 35px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.ttl-style-01::before {
  left: 0;
  background-image: url('../img/common/ttl_bg_01.png');
}

.ttl-style-01::after {
  right: 0;
  background-image: url('../img/common/ttl_bg_02.png');
}

.ttl-style-01 > span {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .ttl-style-01 {
    padding: 0 20px 15px;
  }
  .ttl-style-01::after,
  .ttl-style-01::before {
    top: 0;
    width: 20px;
    height: 30px;
  }
}

.ttl-style-02 {
  text-align: center;
  margin: 0 auto 60px;
}

.ttl-style-02 > .txt {
  display: inline-block;
  text-align: left;
  letter-spacing: 1px;
  border-bottom: 1px solid #1a5b27;
  font-size: 160%;
  color: #1a5b27;
  padding: 0 30px 10px;
}

@media screen and (max-width: 767px) {
  .ttl-style-02 {
    margin: 0 auto 40px;
  }
}

@media screen and (max-width: 480px) {
  .ttl-style-02 {
    margin: 0 auto 30px;
  }
}

/* --------------------------------------------------
Table
-------------------------------------------------- */

.tbl-blc {
  width: 100%;
  max-width: 800px;
  padding-top: 2.5%;
  margin: 0 auto;
}

.tbl-blc.style-01 {
  max-width: none;
  padding-top: 62px;
}

@media screen and (max-width: 1000px) {
  .tbl-blc.style-01 {
    padding-top: 40px;
  }
}

/* Common Table --------------- */

.tbl-bomm {
  border-top: 1px dotted #fff;
}

.tbl-comm th, 
.tbl-comm td {
  padding: 7px 15px;
  border-bottom: 1px dotted #ccc;
  box-sizing: border-box;
}

.tbl-comm th {
  background-color: #fff;
  width: 20%;
}

.tbl-comm th[align="center"], 
.tbl-comm td[align="center"] {
  text-align: center;
}

.tbl-comm th[align="right"], 
.tbl-comm td[align="right"] {
  text-align: right;
}

.tbl-respon {
  overflow-x: auto;
}

.tbl-respon .tbl-comm {
  min-width: 600px;
}

.note-tbl {
  color: red;
  text-align: center;
  margin: 2% 0;
  display: none;
}

@media screen and (max-width: 767px) {
  /* Common Table --------------- */
  .tbl-comm th, 
  .tbl-comm td {
    font-size: 90%;
  }
  .tbl-comm th {
    width: 30%;
  }
  .tbl-comm.single-row th, 
  .tbl-form.single-row th {
    display: block;
    font-weight: bold;
    padding-bottom: 0;
  }
  .tbl-comm.single-row td, 
  .tbl-form.single-row td {
    display: block;
  }
  .note-tbl {
    display: block;
  }
  /* Form Table --------------- */
  .tbl-form th {
    width: auto;
  }
  /* tblRespon --------------- */
  .note-tbl-respon {
    display: none;
  }
}

@media screen and (max-width: 650px) {
  /* tblRespon --------------- */
  .note-tbl-respon {
    display: block;
  }
}

/* Form Table --------------- */

.tbl-form th {
  background-color: #fff;
  width: 25%;
  padding: 2%;
  text-align: left;
}

.tbl-form td {
  padding: 2%;
  text-align: left;
}

.tbl-form th, 
.tbl-form td {
  border-bottom: 1px dotted #ccc;
}

/* tblRespon --------------- */

.tbl-respon {
  overflow-x: auto;
}

.note-tbl-respon {
  font-size: 80%;
  color: red;
  margin: 2% 0;
  text-align: center;
  display: none;
}

.tbl-style-00 tr th,
.tbl-style-00 tr td {
  padding: 0 20px;
}

.tbl-style-00.style-01 tr th {
  background-color: #e7e7e7;
}

@media screen and (max-width: 767px) {
  .tbl-style-00 tr th,
  .tbl-style-00 tr td {
    display: block;
  }
  .tbl-style-00 tr td {
    margin-bottom: 20px;
  }
  .tbl-style-00 tr:nth-last-child(1) td {
    margin-bottom: 0;
  }
}

.tbl-style-00 td.price {
  letter-spacing: 1px;
  color: #126321;
  font-weight: 800;
}

.tbl-style-01 {
  width: 100%;
  border-collapse: collapse;
  border: 5px solid #151e05;
  border-radius: 40px;
} 

.tbl-style-02 {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #1a5b27;
}

.tbl-style-02 th ,
.tbl-style-02 td {
  border-bottom: 1px solid #1a5b27;
}

.tbl-style-02 th ,
.tbl-style-02 td {
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
  padding: 10px 20px;
  box-sizing: border-box;
}

.tbl-style-02 th {
  color: #1a5b27;
  font-weight: 600;
  background-color: #f1f7f4;
  border-right: none;
}

.tbl-style-02 td {
  color: #2c2d2c;
}

@media screen and (max-width: 480px) {
  .tbl-style-02 th ,
  .tbl-style-02 td {
    display: block;
    width: 100%;
  }
  .tbl-style-02 th {
    border-bottom: none;
  }
}

/* --------------------------------------------------
List
-------------------------------------------------- */

.list-style-01 {
  counter-reset: section;
  text-align: left;
}

.list-style-01 li:first-child {
  margin-top: 5%;
}

.list-style-01 li:last-child {
  margin-bottom: 0;
}

.list-style-01 li {
  padding-left: 20px;
  margin-bottom: 2rem;
  position: relative;
}

.list-style-01 li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 2px;
  width: 15px;
  height: 100%;
  counter-increment: section;
  content: " " counter(section) ". ";
}

@media screen and (max-width:480px) {
  .list-style-01 li {
      margin-bottom: 1rem;
  }
}

.list-style-02 {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.list-style-02 > .box {
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding-bottom: 60px;
}

.list-style-02.style-01 > .box {
  align-items: center;
}

.list-style-02 > .box > .img {
  width: 48%;
  background-size: cover;
}

.list-style-02.style-01 > .box > .img {
  height: 27vw;
}

.list-style-02.style-01 > .box > .img.style-01,
.list-style-02.style-01 > .box > .img.style-02 {
  height: auto;
}

.list-style-02.style-01 > .box > .img.style-02 {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.list-style-02 > .box > .cont {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 52%;
  background-image: url('../img/common/bg_01.png');
  background-position: left center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-left: 4%;
  box-sizing: border-box;
}

.list-style-02.bg-none > .box > .cont {
  background-image: none;
}

.list-style-02 > .box:nth-child(2n+2) > .cont {
  background-image: url('../img/common/bg_02.png');
  order: 1;
  padding-right: 4%;
}

.list-style-02.none-repeat-bg > .box:nth-child(2n+2) > .cont {
  background-image: none;
}

.list-style-02 > .box:nth-child(2n+2) > .img {
  order: 2;
}

@media screen and (max-width: 767px) {
  .list-style-02 > .box {
    flex-direction: column;
    flex-wrap: wrap;
    width: 100%;
    padding-bottom: 0;
  }
  .list-style-02.style-01 > .box {
    padding-bottom: 0;
  }
  .list-style-02 > .box > .img,
  .list-style-02 > .box > .cont {
    width: 100%;
  }
  .list-style-02 > .box > .img {
    padding-bottom: 50%;
  }
  
  .list-style-02.style-01 > .box > .img {
    height: 58vw;
    padding-bottom: 0;
  }
  .list-style-02 > .box > .img.style-01 {
    padding-bottom: 0;
    height: auto;
  }
  .list-style-02 > .box:nth-child(2n+2) > .img {
    order: 1;
  }
  .list-style-02 > .box > .cont {
    padding-left: 4%;
    padding-right: 4%;
  }
  .list-style-02 > .box:nth-child(2n+2) > .cont {
    order: 2;
  }
}

.list-style-03 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.list-style-03 > .list {
  display: none;
  width: 31%;
}

.list-style-03 > .list:nth-child(1),
.list-style-03 > .list:nth-child(2),
.list-style-03 > .list:nth-child(3) {
  display: block;
}

.list-style-03 > .list .img {
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding-bottom: 69%;
}

.list-style-04 {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.list-style-04 .list {
  position: relative;
  width: 33.33%;
  height: 130px;
}

.list-style-04 .list:nth-child(5n+4) {
  padding-left: 16%;
}

.list-style-04 .list:nth-child(5n+5) {
  padding-right: 16%;
}

@media screen and (max-width: 767px) {
  .list-style-04 .list {
    position: relative;
    width: 50%;
    height: auto;
    margin-bottom: 15px;
  }
  .list-style-04 .list:nth-child(5n+4) {
    padding-left: 0;
  }
  .list-style-04 .list:nth-child(5n+5) {
    padding-right: 0;
  }
}

@media screen and (max-width: 480px) {
  .list-style-04 .list {
    width: 100%;
  }
}

.list-style-05 > li {
  position: relative;
  padding-left: 60px;
  margin-bottom: 30px;
}

.list-style-05 > li > .num {
  position: absolute;
  top: 8px;
  left: 0;
  width: 50px;
  height: 50px;
  font-size: 110%;
  font-weight: 800;
  font-style: italic;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url('../img/common/list_bg_02.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.list-style-06 {
  position: relative;
  text-align: left;
  margin-bottom: 40px;
}

.list-style-06 > .num {
  position: absolute;
  top: 10px;
  right: 0;
  width: 120px;
  height: 120px;
  font-size: 180%;
  font-weight: 600;
  font-style: italic;
  color: #fff;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-direction: column;
  background-image: url('../img/common/list_bg_01.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 15px 25px;
  margin: 0 auto;
  box-sizing: border-box;
  opacity: .5;
}

.list-style-06 > dt {
  position: relative;
  font-size: 140%;
  color: #286132;
  border-bottom: 1px solid #1a5b27;
  padding: 0 145px 10px 40px;
}

.list-style-06 > dt::after {
  position: absolute;
  top: 14px;
  left: 10px;
  content: '';
  width: 20px;
  height: 20px;
  background-color: #f2f8f0;
  border-radius: 10px;
}

.list-style-06 > dd {
  color: #042f0d;
  margin-top: 20px;
  padding: 0 100px 0 50px;
}

@media screen and (max-width: 1000px) {
  .list-style-06 > dt::after {
    top: 10px;
  }
}

@media screen and (max-width: 767px) {
  .list-style-06 > dt {
    padding: 0 145px 10px 20px;
  }
  .list-style-06 > dt::after {
    top: 10px;
    left: 5px;
    width: 12px;
    height: 12px;
  }
  .list-style-06 > dd {
    margin-top: 10px;
    padding: 0 100px 0 25px;
  }
}

@media screen and (max-width: 480px) {
  .list-style-06 {
    margin-bottom: 65px;
  }
  .list-style-06 > .num {
    top: auto;
    bottom: -60px;
    font-size: 180%;
  }
  .list-style-06 > dt {
    padding: 0 0 10px 20px;
  }
  .list-style-06 > dt::after {
    top: 10px;
    left: 5px;
    width: 12px;
    height: 12px;
  }
  .list-style-06 > dd {
    margin-top: 10px;
    padding: 0 0 0 25px;
  }
}
 
/* --------------------------------------------------
tab-blc
-------------------------------------------------- */

.tab-tab {
  width: 100%;
  max-width: 1200px;
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: 0 4%;
  margin: 0 auto 60px;
  box-sizing: border-box;
}

.tab-tab > a {
  position: relative;
  text-align: center;
  width: 32%;
  font-size: 100%;
  text-decoration: none;
  color: #262626;
  padding: 12px 0;
  border-bottom: 3px solid #d6d6d6;
  transition: all 300ms ease-in-out;
}

.tab-tab > a:nth-child(1) {
  animation-delay: .15s;
}

.tab-tab > a:nth-child(2) {
  animation-delay: .30s;
}

.tab-tab > a:nth-child(3) {
  animation-delay: .45s;
}

.tab-tab > a:nth-child(4) {
  animation-delay: .60s;

}

.tab-tab > a:nth-child(5) {
  animation-delay: .75s;
}

.tab-tab > a.active {
  color: #1a5b27;
  border-bottom: 3px solid #1a5b27;
}

.tab-tab > a:hover {
  color: #1a5b27;
}

.tab-tab > a::after {
  position: absolute;
  bottom: -3px;
  left: 0;
  content: '';
  display: block;
  width: 0;
  height: 3px;
  background-color: #1a5b27;
  transition: 300ms all ease-in-out;
}

.tab-tab > a:hover::after {
  width: 100%;
}

.tab-cont > .tab {
  display: none;
}

@media screen and (max-width: 767px) {
  .tab-tab {
    margin: 0 auto 30px;
  }
  .tab-tab > a {
    width: 48%;
  }
}

@media screen and (max-width: 480px) {
  .tab-tab > a {
    width: 100%;
  }
}
 
/* --------------------------------------------------
txt-blc
-------------------------------------------------- */
.txt-blc-01 {
  text-align: center;
}

.txt-blc-01 > .inner {
  text-align: left;
  display: inline-block;
}

.txt-blc-02 {
  width: 182px;
  height: 165px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-image: url('../img/common/list_bg_01.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  margin: 0 auto;
}

/* --------------------------------------------------
box style
-------------------------------------------------- */


/* --------------------------------------------------
img style
-------------------------------------------------- */
.img-style-01.style-01 {
  max-width: 700px;
  width: 100%;
}

.img-style-01 > img {
  float: left;
  width: 49%;
}

.img-style-01 > img:not(:nth-child(1)) {
  margin-top: 20px;
}

.img-style-01 > img:nth-child(2n+2) {
  float: right;
}

.img-style-01 > img:nth-child(2) {
  margin-top: 80px;
}

.img-style-01::after {
  content: '';
  display: block;
  clear: both;
}

@media screen and (max-width: 767px) {
  .img-style-01.style-01 {
    max-width: none;
  }
}

/* --------------------------------------------------
Cont-style
-------------------------------------------------- */
.cont-style-01 {
  position: relative;
  margin: 0 auto;
}

.cont-style-01 > .ttl-area {
  position: relative;
  text-align: center;
  font-size: 160%;
  color: #1a5b27;
  margin-bottom: 20px;
}

.cont-style-01 > .ttl-area.style-00 {
  letter-spacing: 1px;
  padding-bottom: 10px;
}

.cont-style-01 > .ttl-area.style-00::after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  content: '';
  width: 100px;
  height: 1px;
  background-color: #1a5b27;
  margin: 0 auto;
}

.cont-style-01 > .txt-area {
  text-align: center;
  margin-bottom: 20px;
}

.cont-style-01 > .ttl-area > .txt,
.cont-style-01 > .txt-area > .txt {
  text-align: left;
  display: inline-block;
}

.cont-style-01 > .btn-area {
  text-align: center;
}

.cont-style-02 {
  position: relative;
  width: 96%;
  margin: 0 auto;
}

.cont-style-02.center > .ttl-area,
.cont-style-02.center > .sub-ttl-area,
.cont-style-02.center > .txt-area {
  text-align: center;
}

.cont-style-02 > .ttl-area {
  position: relative;
  text-align: left;
  width: 100%;
  font-size: 160%;
  color: #1a5b27;
  margin-bottom: 30px;
}

.cont-style-02.minimal > .ttl-area {
  line-height: 1;
  margin-bottom: 15px;
}

.cont-style-02 > .ttl-area.center {
  text-align: center;
}

.cont-style-02 > .txt-area {
  text-align: left;
  width: 100%;
  margin-bottom: 20px;
}

.cont-style-02 > .sub-ttl-area {
  position: relative;
  text-align: left;
  width: 100%;
  font-size: 120%;
  color: #1a5b27;
  margin-bottom: 20px;
}

.cont-style-02.minimal > .sub-ttl-area {
  line-height: 1;
  margin-bottom: 15px;
}

.cont-style-02 > .sub-ttl-area.center {
  text-align: center;
}

.cont-style-02.minimal > .txt-area {
  line-height: 1.5;
  margin-bottom: 0;
}

.cont-style-02 > .txt-area.big {
  font-size: 110%;
}

.cont-style-02 > .txt-area.center {
  text-align: center;
}

.cont-style-02 > .txt-area.col-01 {
  color: #042f0d;
}

.cont-style-02 > .txt-area span {
  display: inline-block;
}

.cont-style-02 > .ttl-area > .txt,
.cont-style-02 > .txt-area > .txt {
  text-align: left;
  display: inline-block;
}

.cont-style-02 > .btn-area {
  text-align: center;
  margin-top: 62px;
}

@media screen and (max-width: 767px) {
  .cont-style-02 {
    width: 100%;
  }
}

.cont-style-03 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.cont-style-03 > .img-blc {
  display: flex;
  align-items: center;
  width: 400px;
}

.cont-style-03 > .img-blc > .txt {
  text-align: center;
  letter-spacing: .5px;
  color: #042f0d;
  margin-top: 10px;
}

.cont-style-03 > .cont-blc {
  width: calc(100% - 440px);
  padding: 60px 0;
}

.cont-style-03 > .cont-blc.center {
  display: flex;
  align-items: center;
}

.cont-style-03.style-01 > .cont-blc {
  padding: 0;
}

.cont-style-03.green > .cont-blc > .txt {
  color: #042f0d;
}

@media screen and (max-width: 1000px) {
  .cont-style-03 > .img-blc {
    width: 300px;
  }
  .cont-style-03 > .cont-blc {
    width: calc(100% - 320px);
    padding: 40px 0;
  }
  .cont-style-03.style-01 > .cont-blc {
    padding: 0;
  }
}

@media screen and (max-width: 767px) {
  .cont-style-03 > .img-blc {
    width: 200px;
  }
  .cont-style-03 > .cont-blc {
    width: calc(100% - 220px);
    padding: 10px 0;
  }
  .cont-style-03.style-01 > .cont-blc {
    padding: 0;
  }
}

@media screen and (max-width: 480px) {
  .cont-style-03 > .img-blc {
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
  }
  .cont-style-03 > .cont-blc {
    width: 100%;
    padding: 10px 0;
  }
}

.cont-style-04 {
  width: 100%;
  padding: 40px 0;
}

.cont-style-04 > .ttl-area {
  display: inline-block;
  font-size: 120%;
  color: #1a5b27;
  font-weight: 600;
  letter-spacing: 1px;
  margin-right: 30px;
  margin-bottom: 40px;
}

.cont-style-04 > .ttl-area > span {
  font-size: 60%;
  color: #000;
  font-weight: lighter;
  margin-left: 15px;
}

.cont-style-04 > .sub-ttl-area {
  display: inline-block;
  font-size: 120%;
  color: #1a5b27;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 40px;
}

.cont-style-04 > .txt-area {
  width: 100%;
  display: flex;
  justify-content: center;
}

.cont-style-04 > .txt-area > .txt {
  position: relative;
  text-align: center;
  font-size: 120%;
  color: #1a5b27;
  font-weight: 400;
}

.cont-style-04 > .txt-area > .txt::before {
  position: relative;
  left: -10px;
  content: '『';
  font-size: 120%;
  font-weight: 800;
}

.cont-style-04 > .txt-area > .txt::after {
  position: relative;
  right: -10px;
  content: '』';
  font-size: 120%;
  color: #1a5b27;
  font-weight: 800;
}

.cont-style-05 {
  width: 100%;
  padding: 40px 0;
}

.cont-style-05 > .ttl-area {
  text-align: center;
  font-size: 120%;
  color: #1a5b27;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 40px;
}

.cont-style-05 > .txt-area {
  display: flex;
  justify-content: center;
}

.cont-style-05 > .txt-area > .inner {
  display: inline-block;
}

.cont-style-05 > .txt-area > .inner > .ttl {
  position: relative;
  text-align: left;
  font-size: 100%;
  color: #1a5b27;
  font-weight: 600;
}

.cont-style-05 > .txt-area > .inner > .txt {
  position: relative;
  text-align: center;
  font-size: 100%;
  color: #000;
  font-weight: 400;
}


/* --------------------------------------------------
Button
-------------------------------------------------- */
.btn-style-00 a {
  line-height: 1.6;
  text-decoration: none;
  display: inline-block;
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.btn-style-00.style_01 a {
  border: 1px solid #1a5b27;
}

.btn-style-00 a.animation-hide {
  opacity: 1;
}

.btn-style-00 a::before {
  content: "";
  background-color: #1a5b27;
  width: 100%;
  height: 0;
  position: absolute;
  top: -1px;
  left: 0;
  transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}

.btn-style-00 a:hover::before {
  top: auto;
  bottom: 0;
  height: 100%;
}

.btn-style-00 a .arrow::before {
  content: "";
  background: url(../img/common/arrow_right.png) no-repeat center center;
  background-size: 100% auto;
  width: 30px;
  height: 14px;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(100% - 45px);
  opacity: 1;
  transform: translateX(0);
}

.btn-style-00 a:hover .arrow::before {
  background-image: url(../img/common/arrow_right_hover.png);
}

.btn-style-00 a.do-animate.no-first .arrow::before {
  animation: none;
}

.btn-style-00 a.is-hover.no-first .arrow::before {
  animation: serviceHoverBtnArrow 0.8s forwards;
}

.btn-style-00 a.do-animate.no-first .arrow::after {
  animation: none;
}

.btn-style-00 a.is-hover.no-first .arrow::after {
  animation: serviceHoverBtnLine 0.8s;
}

.btn-style-00 a .txt01 {
  width: 100%;
  height: 100%;
  padding: 12px 45px 12px 12px;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  box-sizing: border-box;
  transition: all 0.2s ease-in-out;
}

.btn-style-00 a .txt02 {
  padding: 12px 65px 12px 12px;
  display: block;
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease-in-out;
}

.btn-style-00 a:hover .txt01,
.btn-style-00 a:hover .txt02 {
  color: #fff;
}

.btn-style-00 a.do-animate.no-first .txt01 {
  animation: none;
}

.btn-style-00 a.is-hover.no-first .txt01 {
  animation: serviceHoverBtnText 0.8s 0.2s;
}

@keyframes serviceHoverBtnText {
  0% {
    bottom: 0;
  }
  50% {
    bottom: 100%;
  }
  51% {
    bottom: auto;
    top: 100%;
  }
  100% {
    bottom: auto;
    top: 0;
  }
}

@keyframes serviceHoverBtnArrow {
  0% {
    right: 12px;
    opacity: 1;
  }
  50% {
    right: 1px;
    opacity: 0;
  }
  51% {
    left: calc(100% - 34px);
    right: auto;
    opacity: 0;
  }
  100% {
    left: calc(100% - 23px);
    right: auto;
    opacity: 1;
  }
}

@keyframes serviceHoverBtnLine {
  0% {
    width: 18px;
    left: auto;
    right: 23px;
  }
  50% {
    width: 0px;
    left: auto;
    right: 23px;
  }
  51% {
    width: 0px;
    right: auto;
    left: calc(100% - 41px);
  }
  100% {
    width: 18px;
    right: auto;
    left: calc(100% - 41px);
  }
}

@media screen and (max-width: 767px) {
  .btn-style-00 a::before {
    display: none;
  }
  .btn-style-00 a.is-hover.no-first .arrow::before {
    animation: none;
  }
  .btn-style-00 a:hover .txt01,
  .btn-style-00 a:hover .txt02 {
    color: #554345;
  }
  .btn-style-00 a.is-hover.no-first .txt01 {
    animation: none;
  }
}

@media screen and (max-width: 480px) {
  .btn-style-00 a .txt01,
  .btn-style-00 a .txt02 {
    padding-right: 40px;
  }
  .btn-style-00 a .arrow::before {
    width: 22px;
    left: calc(100% - 28px);
  }
}

@media screen and (max-width: 440px) {
  .btn-style-00 a .txt01 br,
  .btn-style-00 a .txt02 br {
    display: none;
  }
}

@media screen and (max-width: 360px) {
  #service .list .item .txt-blc {
    padding: 2%;
  }
  .btn-style-00 a .arrow::before {
    left: calc(100% - 25px);
  }
  .btn-style-00 a .txt01,
  .btn-style-00 a .txt02 {
    padding-right: 32px;
  }
}

.btn-style-02 {
  max-width: 300px;
  width: 100%;
  letter-spacing: .8px;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
  font-size: 140%;
  color: #fff !important;
  border: 1px solid #1a5b27 !important;
  background-color: #1a5b27;
  padding: 12px 20px;
  cursor: pointer;
  transition: all 300ms ease-in-out;
}

.btn-style-02:hover {
  color: #1a5b27 !important;
  background-color: #fff;
}


/* --------------------------------------------------
Text
-------------------------------------------------- */
.txt-style-01 {
  text-align: center;
}

.txt-style-01 > .inner {
  text-align: left;
  display: inline-block;
  margin: 0 auto;
}


.txt-center {
  text-align: center;
}

.txt-center-02 {
  text-align: center !important;
}

.txt-underline {
  text-decoration: underline;
}

.txt-big {
  font-size: 115%;
}

.txt-small {
  font-size: 85%;
}

.txt-weight {
  font-weight: bold;
}

.txt-weight.style-01 {
  font-weight: 600;
}

.txt-inline-blc {
  text-align: left;
  display: inline-block;
}

.txt-black {
  color: #000;
}

.txt-red {
  color: #BD2D2B;
}

.txt-green {
  color: #1a5b27;
}

@media screen and (max-width: 767px) {
  .txt-for-sp {
    text-align: left !important;
  }
  .txt-for-sp br {
    display: none !important;
  }
  span.txt-for-sp {
    display: inline-block;
  }
}

/* --------------------------------------------------
BG Classes
-------------------------------------------------- */
.bg-col::after {
  opacity: .5;
}

.bg-col-ttl > .inner > .ttl {
  position: relative;
  z-index: 1;
}

.bg-col-ttl > .inner > .ttl::after {
  z-index: -1;
  opacity: .5;
}

.bg-col.pink-01::after,
.bg-col-ttl.pink-01 > .inner > .ttl::after,
.btn-col.pink-01 > .btn::before {
  background-color: #ff5050;
}

.bg-col.nude-01::after,
.bg-col-ttl.nude-01 > .inner > .ttl::after,
.btn-col.nude-01 > .btn::before {
  background-color: #ff9250;
}

.bg-col.yellow-01::after,
.bg-col-ttl.yellow-01 > .inner > .ttl::after,
.btn-col.yellow-01 > .btn::before {
  background-color: #ffbe00;
}

.bg-col.green-01::after,
.bg-col-ttl.green-01 > .inner > .ttl::after,
.btn-col.green-01 > .btn::before {
  background-color: #7dda05;
}

.bg-col.green-02::after,
.bg-col-ttl.green-02 > .inner > .ttl::after,
.btn-col.green-02 > .btn::before {
  background-color: #009900;
}

.bg-col.green-03::after,
.bg-col-ttl.green-03 > .inner > .ttl::after,
.btn-col.green-03 > .btn::before {
  background-color: #05c387;
}

.bg-col.green-04::after,
.bg-col-ttl.green-04 > .inner > .ttl::after,
.btn-col.green-04 > .btn::before {
  background-color: #2dd6d9;
}

.bg-col.green-05::after,
.bg-col-ttl.green-05 > .inner > .ttl::after,
.btn-col.green-05 > .btn::before {
  background-color: #1868bd;
}

.bg-col.purple-01::after,
.bg-col-ttl.purple-01 > .inner > .ttl::after,
.btn-col.purple-01 > .btn::before {
  background-color: #8c00cd;
}

.bg-col.pink-02::after,
.bg-col-ttl.pink-02 > .inner > .ttl::after,
.btn-col.pink-02 > .btn::before {
  background-color: #cd0099;
}

.bg-col.pink-03::after,
.bg-col-ttl.pink-03 > .inner > .ttl::after,
.btn-col.pink-03 > .btn::before {
  background-color: #cd0057;
}

.bg-col.pink-04::after,
.bg-col-ttl.pink-04 > .inner > .ttl::after,
.btn-col.pink-04 > .btn::before {
  background-color: #891010;
}

/* --------------------------------------------------
form
-------------------------------------------------- */
.form-blc .info {
  margin-bottom: 10px;
}

.form-blc table.tbl-form {
  position: relative;
  box-sizing: border-box;
  margin: 0 0 3%;
  width: 100%;
  border: 1px solid #1a5b27;
}

.form-blc table.tbl-form tr {
  position: relative;
}

.form-blc table.tbl-form tr::after {
  content: "";
  background: url(../img/common/line_dashed01.png) repeat-x left -4px bottom;
  background-size: auto 2px;
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.form-blc table.tbl-form th, 
.form-blc table.tbl-form td {
  background: transparent;
  border-bottom: 1px solid #1a5b27;
  padding: 25px 15px;
  box-sizing: border-box;
}

.tablet .form-blc table.tbl-form th, 
.tablet .form-blc table.tbl-form td {
  border-bottom: 2px dashed #b7b7b7;
}

.form-blc table.tbl-form th {
  font-weight: 600;
  width: 250px;
  color: #1a5b27;
  padding: 25px 65px 25px 25px;
  /* padding-right: ; */
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
  position: relative;
  background-color: #f1f7f4;
}

.form-blc table.tbl-form th .required, 
.form-blc table.tbl-form th .n-required {
  position: absolute;
  top: 32px;
  right: 10px;
}

.form-blc table.tbl-form .radio-label {
  margin-right: 10px;
}

input::placeholder {
  color: #828282;
}

.form-blc input, .form-blc textarea {
  box-sizing: border-box;
  resize: none;
}

.form-blc input[disabled=disabled]::after {
  content: "";
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.form-blc .select-blc {
  display: inline-block;
  position: relative;
}

.form-blc .select-blc::after {
  font-family: "Font Awesome 5 Free";
  content: '\f107';
  color: rgba(217, 217, 195, 1);
  font-weight: 900;
  font-size: 16px;
  margin: auto 0;
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 15px;
  transition: all 0.3s ease-in-out 0s;
}

.form-blc .select-blc:focus-within::after {
  color: #1a5b27;
}

.form-blc .select-blc select {
  appearance: none;
}

.form-blc .select-blc select::-ms-expand {
  display: none;
}

.form-blc select {
  color: #000;
  font-weight: 500;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
  background-color: transparent;
  border: 1px solid #b4b4b4;
  padding: 4px 30px 4px 15px;
  box-sizing: border-box;
  position: relative;
  margin: 0 3px;
  z-index: 1;
  transition: all 0.3s ease-in-out 0s;
}

.form-blc select:focus {
  border-color: #1a5b27;
  box-shadow: 0 0 6px #1a5b27;
  outline: medium none;
}

.form-blc input,
.form-blc textarea {
  color: #000;
  font-weight: 500;
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
}


.form-blc .s-narrow-size {
  width: 90px;
}

.form-blc .m-narrow-size {
  width: 100px;
}

.form-blc .narrow-size {
  width: 20%;
}

.form-blc .middle-size {
  width: 50%;
}

.form-blc .small-size {
  width: 35%;
}

.form-blc .wide-size {
  width: 80%;
}

.form-blc .full-size {
  width: 100%;
}

.form-blc input[type=tel] {
  width: 20%;
}

.form-blc textarea {
  width: 100%;
  height: 200px;
  display: block;
}

.form-blc label.label-for {
  margin-right: 15px;
  display: inline-flex;
  align-items: center;
}

.form-blc label.label-for > input[type=radio] {
  margin-right: 5px;
}

.form-blc input[readonly] {
  background-color: #eee;
}

.form-blc select {
  position: relative;
  background-color: #fff !important;
}

.form-blc select > option {
  text-align: left;
  padding: 0;
  margin: 0;
  clear: both;
  font-size: 110%;
}

.form-blc .select-box {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 5px;
}

.form-blc .select-box::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 12px;
  display: inline-block;
  width: 16px;
  height: 10px;
  line-height: 10px;
  font-family: "Font Awesome 5 Free";
  font-size: 16px;
  font-weight: 800;
  content: "\f107";
  /* color: rgba(217, 217, 195, 0.55); */
  color: #000;
  margin: auto 0;
  transition: all 300ms ease-in-out;
  z-index: 8;
}

.form-blc input {
  margin: 0 3px;
}

.form-blc .privancy {
  font-family: "Noto Serif JP", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "Times New Roman", serif;
  padding: 0 4%;
}

.form-blc .privancy > a {
  font-size: 120%
  ;
}

/* @media screen and (max-width: 1100px) {
  .form-blc table.tbl-form th {
    width: 220px;
  }
} */

@media screen and (max-width: 767px) {
  .form-blc table.tbl-form th .required, 
  .form-blc table.tbl-form th .n-required {
    position: absolute;
    top: 18px;
    right: 10px;
  }
  .form-blc table.tbl-form tr::after {
    display: none;
  }
  .form-blc table.tbl-form th {
    font-weight: bold;
    width: 100%;
    padding: 20px 15px 20px;
  }
  .form-blc table.tbl-form td {
    padding: 20px 15px 20px;
    border-bottom: 1px solid #1a5b27;
  }
  .form-blc input.narrow-size {
    width: 30%;
  }
  .form-blc input.middle-size {
    width: 65%;
  }
  .form-blc input.small-size {
    width: 60%;
  }
  .form-blc input.wide-size {
    width: 100%;
  }
  .form-blc input[name=birthday1] {
    width: 60px;
  }    
  .form-blc input[name=birthday2],
  .form-blc input[name=birthday3] {
    width: 40px;
  }
}

@media screen and (max-width: 540px) {
  .form-blc select,
  .form-blc input {
    margin: 0 3px !important;
  }
  .form-blc .select-box {
    margin-right: 0;
    margin-bottom: 5px;
  }
}

@media screen and (max-width: 480px) {
  .form-blc .s-narrow-size {
    width: 70px;
  }
  .form-blc input.narrow-size {
    width: 50%;
  }
  .form-blc input.middle-size {
    width: 85%;
  } 
}

#form-submit {
  text-align: center;
  margin-top: 7%;
  margin-bottom: 4%;
}

#form-submit > input {
  line-height: 1.8;
  border: none;
}

#form-submit > input[name=back] {
  background-color: #999;
  border: 1px solid #999 !important;
}

#form-submit > input[name=back]:hover {
  color: #999;
  background-color: #fff;
}

.error-txt {
  font-size: 90%;
  color: #ff5050;
}

.focus-animation {
  border: 1px solid #b4b4b4;
  line-height: 2;
  padding: 5px 10px;
  transition: all 0.3s ease-in-out 0s;
  -webkit-appearance: none;
}

.focus-animation:focus {
  border-color: #1a5b27;
  box-shadow: 0 0 6px rgba(31, 158, 37, 0.2);
  outline: medium none;
  transition: all 0.3s ease-in-out 0s;
}

@media screen and (max-width: 767px) {
  .focus-animation {
      line-height: 1.8;
      border-radius: 3px;
  }
  textarea.focus-animation {
      border-radius: 3px;
  }
}

@media screen and (max-width: 480px) {
  .focus-animation {
    border-radius: 3px;
    padding: 5px 10px;
  }
  #form-submit > input {
    margin: 0 auto !important;
  }
}


/* Form Block --------------- */

.copy-email {
  text-align: center;
  margin: 20px 0;
}

.copy-email::-moz-selection { /* Code for Firefox */
  color: #fff;
  background: #1a5b27;
}

.copy-email::selection {
  color: #fff;
  background: #1a5b27;
}

.normal-form p.info {
  margin-bottom: 4%;
}

.normal-form p.info .required {
  transform: translateY(-3px);
}

.normal-form > .inner .txt-blc {
  text-align: center;
  position: relative;
}

.normal-form > .inner .txt-blc .subj {
  font-size: 140%;
  margin-bottom: 4%;
}

.normal-form > .inner .txt-blc .txt01 {
  font-size: 120%;
}


@media screen and (max-width: 1100px) {
  .normal-form > .inner > .txt-blc::after {
      width: 18vw;
      height: 23vw;
  }
}

@media screen and (max-width: 1000px) {
  .normal-form input[type=button], .normal-form input[type=submit], .normal-form button[type=button], .normal-form button[type=submit],  #rule-blc input[type=button], #rule-blc input[type=submit],  #rule-blc button[type=button], #rule-blc button[type=submit] {
      min-width: 200px;
  }
  .normal-form button[type=button]::after, .normal-form button[type=submit]::after, #rule-blc button[type=button]::after, #rule-blc button[type=submit]::after {
      width: 9px;
      height: 16px;
  }
}

@media screen and (max-width: 767px) {
  .normal-form p.info {
      text-align: left;
  }
  .normal-form > .inner .txt-blc .subj {
      font-size: 120%;
  }
  .normal-form > .inner .txt-blc .txt01 {
      font-size: 100%;
  }
  .normal-form table.tbl-form th, .normal-form table.tbl-form td {
      width: 100%;
      display: block;
      padding: 5px;
  }
  .tablet .normal-form table.tbl-form th {
      border-bottom: none
  }
  .normal-form table.tbl-form th {
      border-bottom: 0;
      padding-top: 15px;
  }
  .normal-form table.tbl-form td {
      padding-bottom: 15px;
  }
  .normal-form table.tbl-form th .required, .normal-form table.tbl-form th .n-required {
      top: 16px;
  }
  .normal-form input[type=button], .normal-form input[type=submit], #rule-blc input[type=button], #rule-blc input[type=submit] {
      width: auto;
  }
}

@media screen and (max-width: 640px) {
  .normal-form ul.method li {
      width: 100%;
  }
}

@media screen and (max-width: 575px) {
  .normal-form input[type=button], .normal-form input[type=submit], .normal-form button[type=button], .normal-form button[type=submit],  #rule-blc input[type=button], #rule-blc input[type=submit],  #rule-blc button[type=button], #rule-blc button[type=submit] {
    min-width: 240px;
  }
  .normal-form input[type="submit"] + input[type="button"], .normal-form button[type="submit"] + button[type="button"] {
    margin-top: 4%;
    margin-left: 0;
  }
}

@media screen and (max-width: 480px) {
  .normal-form > .inner > .txt-blc {
    padding-left: 0;
    padding-right: 0;
  }
  .normal-form > .inner > .txt-blc::after {
    display: none;
  }
}

/* Form required --------------- */

.required, .n-required {
  background-color: #d73800;
  color: #fff;
  font-size: 14px;
  font-weight: normal;
  display: inline-block;
  border-radius: 3px;
  margin: 0 5px;
  padding: 0 5px;
  text-align: center;
  line-height: 1.6;
  width: 34px;
}

.n-required {
  background-color: #828282;
}

/* --------------------------------------------------
Other Classes
-------------------------------------------------- */

.br-sp-01,
.br-sp-02 {
  display: none;
}

@media screen and (min-width: 650px) {
  .br-pc {
    display: block;
  }
  .br-sp {
    display: none;
  }
}

@media screen and (max-width: 1000px) {
  .br-pc-01 {
    display: none;
  }
  .br-sp-01 {
    display: block;
    margin-bottom: 5px;
  }
}

@media screen and (max-width: 540px) {
  .br-pc-02 {
    display: none;
  }
  .br-sp-02 {
    display: block;
  }
}


/* Spacing --------------- */

.mt-1 {
  margin-top: 1%;
}

.mt-2 {
  margin-top: 2%;
}

.mt-3 {
  margin-top: 3%;
}

.mt-4 {
  margin-top: 4%;
}

.mt-5 {
  margin-top: 5%;
}

.mt-6 {
  margin-top: 6%;
}

.mt-7 {
  margin-top: 7%;
}

.mb-1 {
  margin-bottom: 1%;
}

.mb-2 {
  margin-bottom: 2%;
}

.mb-3 {
  margin-bottom: 3%;
}

.mb-4 {
  margin-bottom: 4%;
}

.mb-5 {
  margin-bottom: 5%;
}

.mb-6 {
  margin-bottom: 6%;
}

.mb-7 {
  margin-bottom: 7%;
}

.text-size-01 {
  font-size: 70%;
}

.text-size-02 {
  font-size: 80%;
}

.text-size-03 {
  font-size: 90%;
}

.text-size-04 {
  font-size: 100%;
}

.text-size-05 {
  font-size: 110%;
}

.text-size-06 {
  font-size: 120%;
}

.text-size-07 {
  font-size: 150%;
}

/* Clear fix --------------- */

.clear-fix:after {
  content: "";
  clear: both;
  display: block;
}

/* Clear --------------- */

.clear {
  clear: both;
}

/* Hide --------------- */

.hidden {
  opacity: 0;
}

.visible {
  opacity: 1;
}

.disnon {
  display: none;
}

/* imgDeco --------------- */

.img-deco {
  border: 1px solid #cdcdcd;
  padding: 1px;
  box-sizing: border-box;
}

/* imgCircle --------------- */

.img-circle {
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  border-radius: 999px;
}

/* imgRightBlc --------------- */

.img-right-blc {
  margin: 0 0 20px 20px;
  float: right;
}

/* imgZoomEffect --------------- */

.img-zoom {
  overflow: hidden;
}

.img-zoom img, 
.img-zoom .img {
  -ms-transform: translateZ(0px);
  -webkit-transform: translateZ(0px);
  transform: translateZ(0px);
  transition: all 200ms ease-in-out 0s;
}

.img-zoom img:hover, 
.img-zoom .img:hover {
  -ms-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

/* PDF icon --------------- */

.icn-pdf {
  vertical-align: bottom;
  margin: 0px 3%;
}

@media screen and (max-width: 1000px) {
  /* Hide --------------- */
  .post.hidden {
    opacity: 1;
  }
}

@media screen and (max-width: 767px) {
  /* imgRightBlc --------------- */
  .img-right-blc {
    margin: 0 auto 20px;
    float: none;
  }
  /* Popup --------------- */
  .popup {
    display: block;
    position: relative;
  }
}

.comment-blc {
  color: #d32929;
  margin-bottom: 20px
}

/************** /map block **************/
#up-top {
  position: fixed;
  bottom: 60px;
  right: 4vw;
  text-align: center;
  z-index: 990;
  visibility: hidden;
  transition: 500ms all ease-in-out;
}

#up-top a {
  text-align: center;
  text-decoration: none;
}

#up-top:hover {
  opacity: .7;
}

#up-top.ani {
  opacity: 0;
  transition: 300ms all ease-in-out;
}

#up-top.ani:not(.fixed) {
  transition: 100ms all ease-in-out;
}

#up-top.fixed {
  visibility: visible;
}

#up-top i {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 220%;
  color: #1a5b27;
  font-weight: bold;
  box-sizing: border-box;
  transition: all 300ms ease-in-out;
}

#up-top:hover i {
  transform: translateY(-5px);
}

#up-top i::before {
  transform: translateX(.5px);
  transition: 300ms all ease-in-out;
}

#up-top:hover i::before {
  transform: translateY(-1px) translateX(.5px);
}

@media screen and (max-width: 1000px) {
  #up-top i {
    font-size: 180%;
  }
}

@media screen and (max-width: 480px) {
  #up-top {
      bottom: 20px !important;
  }
}

.img-blc {
  box-sizing: border-box;
}

.img-blc-01 {
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  margin: 30px 0;
}



/* --------------------------------------------------
gallery list
-------------------------------------------------- */

.gallery-list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.gallery-list > .gallery-box,
.gallery-list > .dummy-box {
  width: 32%;
}

.gallery-list > .gallery-box {
  text-decoration: none;
  margin-bottom: 25px;
}

.gallery-list > .gallery-box > .img-blc {
  width: 100%;
  height: 220px;
  overflow: hidden;
}

.gallery-list > .gallery-box > .img-blc > .img {
  display: block;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  transition: all 300ms ease-in-out;
}

.gallery-list > .gallery-box:hover > .img-blc > .img {
  transform: scale(1.1);
}

.gallery-list > .gallery-box > .cont-blc {
  position: relative;
  border: 1px solid #185323;
  border-top: none;
  padding: 10px 4%;
}

.gallery-list > .gallery-box > .cont-blc::after {
  position: absolute;
  bottom: 10px;
  right: 10px;
  content: '';
  display: block;
  width: 49px;
  height: 10px;
  background-image: url('../img/gallery/arrow.png');
  background-position: left bottom;
  background-repeat: no-repeat;
  background-size: contain;
  transition: all 300ms ease-in-out;
}

.gallery-list > .gallery-box:hover > .cont-blc::after {
  right: 5px;
}

.gallery-list > .gallery-box > .cont-blc > .ttl {
  font-size: 120%;
  color: #1a5b27;
}

.gallery-list > .gallery-box > .cont-blc > .pin,
.gallery-list > .gallery-box > .cont-blc > .tag {
  background-repeat: no-repeat;
  background-position: center left 5px;
  padding-left: 30px;
}

.gallery-list > .gallery-box > .cont-blc > .pin {
  background-image: url('../img/gallery/pin.png');
  background-size:  14px auto;
}

.gallery-list > .gallery-box > .cont-blc > .tag {
  background-image: url('../img/gallery/tag.png');
  background-size:  16px auto;
}

.gallery-list > .gallery-box > .cont-blc > .tag > span {
  margin-right: 10px;
}

.gallery-list > .dummy-box {
  height: 0;
  opacity: 0;
}

@media screen and (max-width: 1200px) {
  .gallery-list > .gallery-box {
    margin-bottom: 2vw;
  }
  .gallery-list > .gallery-box > .img-blc {
    height: 19vw;
  }
}

@media screen and (max-width: 767px) {
  .gallery-list > .gallery-box,
  .gallery-list > .dummy-box {
    width: 49%;
  }
  .gallery-list > .gallery-box > .img-blc {
    height: 30vw;
  }
}

@media screen and (max-width: 480px) {
  .gallery-list > .gallery-box,
  .gallery-list > .dummy-box {
    width: 100%;
  }
  .gallery-list > .gallery-box {
    margin-bottom: 20px;
  }
  .gallery-list > .gallery-box > .img-blc {
    height: 55vw;
  }
}