@charset "UTF-8";

@media print, screen and (min-width: 768px) {
  .none_pc {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .none_sp {
    display: none;
  }
}

.main_img {
  color: #fff;
  text-align: center;
    box-sizing: border-box;
}
.top_lead {
  line-height: 1.53;
  letter-spacing: 0.025em;
}

@media print, screen and (min-width: 768px) {
  .main_img {
    width: 956px;
    height: 288px;
    padding: 122px 0 0;
    margin: 15px auto 0;
    background: url(../image/bg_main-img.jpg) 0 0 / 100% auto no-repeat;
  }
  .main_img h1 {
    font-size: 29px;
  }
  .main_img h1 span {
    display: block;
    margin-top: 20px;
    font-size: 17px;
  }
  .top_lead {
    width: 780px;
    margin: 15px auto 0;
  }
}
@media screen and (max-width: 767px) {
  .main_img {
    width: 96vw;
    height: 46.5vw;
    padding: 19.2vw 0 0;
    margin: 2vw auto 3vw;
    background: url(../image/bg_main-img-sp.jpg) 0 0 / 100% auto no-repeat;
  }
  .main_img h1 {
    font-size: 5.5vw;
  }
  .main_img h1 span {
    display: block;
    margin-top: 2vw;
    font-size: 3.2vw;
  }
  .top_lead {
    width: 92%;
    margin: 3vw auto 0;
  }
}

.orange_sect h2 {
  font-size: 129.5%;
  color: #fff;
  text-align: center;
  line-height: 1.25;
  letter-spacing: 0.1em;
  background: url(../image/bg-cap-orange.png) 0 0 / 100% auto no-repeat;
  box-sizing: border-box;
}
.orange_sect ul.orange_list {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
}
.orange_sect ul.orange_list li a {
  position: relative;
  z-index: 10;
  display: block;
  color: #000;
  background: #fff url(../image/arrow-corner-orange.png) 100% 100% no-repeat;
}

.orange_sect ul.orange_list li figcaption {
  padding: 0.06em 0 0.06em 0.4em;
  font-size: 106%;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.1em;
  color: #2c8b2f;
}
.orange_sect ul.orange_list li p {
  font-size: 94.12%;
  line-height: 1.375;
}
.orange_sect ul.banners li figcaption {
  padding: 0.2em 0.3em 0 1em;
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: 0.1em;
}
@media print, screen and (min-width: 768px) {
  .orange_sect {
    padding: 35px 0 0;
  }
  .orange_sect h2 {
    width: 454px;
    height: 50px;
    padding: 0.5em 0 0;
    margin: 0 auto 10px;
  }
  .orange_sect ul.orange_list {
    width: 891px;
    background:url(../image/img_space01.png) 100% 100% / 100% auto no-repeat ;
    background-size:570px auto !important;
  }
  .orange_sect ul.orange_list li {
    width: 286px;
    margin: 12.5px 5.5px 0;
  }
  .orange_sect ul.orange_list li a {
    height: 100%;
    border: 1px solid #2c8b2f;
    background-size: 25px auto;
  }
  .orange_sect ul.orange_list li a figure {
    padding: 0 0 18px;
  }
  .orange_sect ul.orange_list li figcaption {
    margin: 15px 16px;
    border-left: 3.5px solid #f38135;
  }
  .orange_sect ul.orange_list li p {
    margin: 0 12px 0 15px;
  }
  .orange_sect ul.banners {
    display: flex;
    width: 634px;
    margin: 28px auto 0;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .orange_sect ul.banners li {
    width: 300px;
  }
  .orange_sect ul.orange_list li a:hover img,
  .orange_sect ul.banners li a:hover img {
    opacity: 0.75;
  }
}
@media screen and (max-width: 767px) {
  .orange_sect {
    padding: 6vw 0 0;
  }
  .orange_sect h2 {
    width: 88vw;
    height: 9.6vw;
    padding: 0.45em 0 0;
    margin: 0 auto;
    font-size: 113.4%;
    letter-spacing: 0.05em;
  }
  .orange_sect ul.orange_list {
    width: 92%;
    justify-content: space-between;
  }
  .orange_sect ul.orange_list li {
    width: 48.6%;
    margin: 3vw 0 0;
  }
  .orange_sect ul.orange_list li a {
    height: 100%;
    border: 0.267vw solid #2c8b2f;
    background-size: 6.4vw auto;
  }
  .orange_sect ul.orange_list li a figure {
    padding: 0 0 3vw;
  }
  .orange_sect ul.orange_list li figcaption {
    margin: 0.5em 0.6em;
    border-left: 3.5px solid #f38135;
  }
  .orange_sect ul.orange_list li p {
    margin: 0 0.6em;
  }
  .orange_sect ul.banners {
    width: 92%;
    margin: 5vw auto 0;
  }
  .orange_sect ul.banners li {
    margin: 4vw 0 0;
  }
}

figcaption{
  font-size:15px;
  margin-top:8px;
  padding:0 1em;
}

/*２コ並びバナー 大名庭園・池泉回遊式庭園*/

.bnr_wrap{
	width:780px;
	margin:3.5em auto 0;
}
.bnr_wrap ul.bnr_col2{
	display: flex;
  justify-content:space-between;
  width:782px;
}
.bnr_wrap ul.bnr_col2 figure{
	width:370px;
}
.bnr_wrap ul.bnr_col2 figcaption{
	font-size:15px;
	margin-top:5px;
	text-align: left;
	line-height: 1.4;
  padding:0!important;
}
a:hover{
  opacity:0.75;
}



/*バナー*/
@media screen and (min-width: 767px) {

  .bnr_520{
    width:100%;
    max-width: 520px;
    margin:2em auto 0;
  }
  }

@media screen and (max-width: 767px) {
  .bnr_520{
    margin-top:2em;
    padding:0 1em;
  }

  /*２コ並びバナー 大名庭園・池泉回遊式庭園*/

.bnr_wrap{
	width:100%;
  max-width:370px;
	margin:3.5em auto 0;
}
.bnr_wrap ul.bnr_col2{
	display: block;
}
.bnr_wrap ul.bnr_col2 figure{
	width:100%;
  max-width:370px;
  margin-top:1em;
}

  }

  .bnr_520 a:hover{
    opacity: 0.75;
  }
  
