@charset"UTF-8";

/* ======================================
                                        スライダー1
========================================*/

.swiper-slider01{
  width:100%;
}

.swiper-slider01 ul li.swiper-slide img{
  width:100%;
}

.swiper-slider01 ul li p{
  width:95%;
  font-size: 1.5rem;
  text-align: center;
  margin: 10px auto 15px auto;
}

.swiper-slider01 ul li p + a{
  width:135px;
  height: 30px;
  background: #D29836;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFF;
  margin: 0 auto;
}

.swiper-slider01 .swiper-pagination{
  width:100%;
  /*height: 40px;*/
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  z-index: 102;
  margin: 20px auto 20px auto;
 }

.swiper-slider01 .swiper-pagination-bullet {
  width:13px;
  height: 13px;
  background-color: #DBDBDB;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.swiper-slider01 .swiper-pagination-bullet-active{
  background-color: #D29836;
}

.swiper-controller{
  width:90%;
  height:40px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  bottom: 10px;
  left:50%;
  transform: translateX(-50%);
 }

.swiper-controller .swiper-button-prev,
.swiper-controller .swiper-button-next{
  position: relative;
  width: 25px;
  height: 25px;
  cursor: pointer;
}

.swiper-controller .swiper-button-prev::after{
  content: "";
  border-top: solid 2px #707070;
  border-left: solid 2px #707070;
  width: 10px;
  height: 10px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%) rotate(-45deg);
}

.swiper-controller .swiper-button-next::after{
  content: "";
  border-top: solid 2px #707070;
  border-right: solid 2px #707070;
  width: 10px;
  height: 10px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%) rotate(45deg);
}

/* ======================================
                                        スライダー2
========================================*/

.swiper-slider02{
  width:100%;
}

.swiper-slider02 ul li.swiper-slide img{
  width:100%;
}

/* ======================================
                                        スライダー3
========================================*/

.swiper-slider03{
  width:100%;
}

.swiper-slider03 ul li.swiper-slide img{
  width:100%;
}

.swiper-slider03 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  padding: 0 5%;
  position: absolute;
  bottom: 105px;
  left: 0;
 }

.swiper-slider03 .swiper-pagination-bullet {
  width:50%;
  height: 8px;
  background-color: #DBDBDB;
  border-radius:0;
  padding: 0;
  margin: 0;
}

.swiper-slider03 .swiper-pagination-bullet-active{
  width:50%;
  background-color: #D29836;
  border-radius:0;
}

/* ======================================
                                        スライダー4
========================================*/

div.slider04{  
  position: relative;
  width:100%;
  margin: 0 auto;
}

.swiper-slider04{
  width:80%;
  margin: 20px 0 30px 0;
}

.swiper-slider04 ul li.swiper-slide{
  width:100%;
  padding: 0 0 45px 0;
  margin: 0;
}

.swiper-slider04 ul li.swiper-slide img{
  display: block;
  width:100%;
  background: #EEE;
  margin: 0 auto;
}

.swiper-slider04 ul li.swiper-slide dl dt{
  font-size: 1.6rem;
  line-height: 130%;
  margin: 10px 0 3px 0;
}

.swiper-slider04 ul li.swiper-slide dl dd{
  font-size: 1.6rem;
  font-weight: 600;
}

.swiper-slider04 ul li.swiper-slide p{  
  width: 100%;
  height: 32px;
  padding: 0;
  margin: 0;
  position: absolute;
  bottom:0;
  left:0;
}

.swiper-slider04 ul li.swiper-slide p a{
  width:100%;
  height: 100%;
  background:#D29836;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  color: #FFF;
}

.slider04 .swiper-controller{
  width:100%;
  height: 25px;
  position: absolute;
  top:40%;
  left:50%;
  transform: translate(-50%,-50%);
  padding: 0 7px;
  z-index: 101;
 }

.slider04 .swiper-controller .swiper-button-prev,
.slider04 .swiper-controller .swiper-button-next{
  position: relative;
  background-color: rgba(70,70,70,0.8);
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.slider04 .swiper-controller .swiper-button-prev::after{
  content: "";
  border-top: solid 2px #FFF;
  border-left: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-30%,-50%) rotate(-45deg) ;
}

.slider04 .swiper-controller .swiper-button-next::after{
  content: "";
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-70%,-50%) rotate(45deg);
}

/* ======================================
                                        スライダー5
========================================*/

.swiper-slider05{
  width:100%;
}

.swiper-slider05 ul li.swiper-slide img{
  width:100%;
}

.swiper-slider05 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  padding: 0 5%;
  position: absolute;
  bottom: 105px;
  left: 0;
 }

.swiper-slider05 .swiper-pagination-bullet {
  width:50%;
  height: 8px;
  background-color: #DBDBDB;
  border-radius:0;
  padding: 0;
  margin: 0;
}

.swiper-slider05 .swiper-pagination-bullet-active{
  width:50%;
  background-color: #D29836;
  border-radius:0;
}

/* ======================================
                                        スライダー6
========================================*/

div.slider06{  
  position: relative;
  width:90%;
  margin: 0 auto;
}

.swiper-slider06{
  width:100%;
}

.swiper-slider06 ul li.swiper-slide img{
  width:100%;
}

.swiper-slider06 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  margin:15px auto 0 auto;  
  z-index: 102;
 }

.swiper-slider06 .swiper-pagination-bullet {
  width:13px;
  height:13px;
  background-color: #DBDBDB;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.swiper-slider06 .swiper-pagination-bullet-active{
  background-color: #D29836;
}

/* ======================================
                              スライダー7  PC
========================================*/

div.slider07{  
  position: relative;
  width:100%;
  margin: 0 auto;
  z-index: 100;
}

.main-visual div.swiper{  
  position: relative;
  z-index: 100;
}

.swiper-slider07 .swiper-slide{
  position: relative;
  width:90%;
  height: auto;
  max-width: 1200px; 
  border:1px solid #FFF;
  background: #F3F3F3;
}

@media print, screen and (min-width:1300px) {
  .swiper-slider07 .swiper-slide{
   position: relative;
   width:100%;
   height: auto;
  }
}

.swiper-slider07 .swiper-slide img{
  width:100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

.main-visual  .swiper-pagination{
  width:100%;
  /*height: 40px;*/
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  z-index: 102;
  margin: 20px auto 20px auto;
 }

.main-visual  .swiper-pagination-bullet {
  width:13px;
  height: 13px;
  background-color: #DBDBDB;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.main-visual  .swiper-pagination-bullet-active{
  background-color: #D29836;
}

.main-visual .swiper-controller{
  width:100%;
  max-width: 1300px;
  height: 25px;
  position: absolute;
  top:45%;
  left:50%;
  transform: translate(-50%,-50%);
  padding: 0 7px;
  z-index: 101;
 }

.main-visual .swiper-controller .swiper-button-prev,
.main-visual .swiper-controller .swiper-button-next{
  position: relative;
  background-color: rgba(255,255,255,0);
  width: 40px;
  height:40px;
  cursor: pointer;
}

.main-visual .swiper-controller .swiper-button-prev::after{
  content: "";
  border-top: solid 4px #D29836;
  border-left: solid 4px #D29836;
  width: 20px;
  height:20px;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-30%,-50%) rotate(-45deg) ;
}

.main-visual .swiper-controller .swiper-button-next::after{
  content: "";
  border-top: solid 4px #D29836;
  border-right: solid 4px #D29836;/*2C893A*/
  width:20px;
  height:20px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-70%,-50%) rotate(45deg);
}

/* ======================================
                                   スライダー8  PC
========================================*/

div.slider08{  
  position: relative;
  width:95%;
  padding: 0 60px;
  margin: 0 auto 60px auto;
}

@media print, screen and (min-width:1200px) {
  div.slider08{  
    position: relative;
    width:100%;
    max-width: 1200px;
    margin: 0 auto 60px auto;
  }
}

.swiper-slider08{
  width:100%; 
  background: #FFF;
  margin: 0 auto;
}

.swiper-slider08 .swiper-slide{
  display: block;
  width:225px;
  padding: 0 0 70px 0;
  margin: 0 auto;
}

.swiper-slider08 ul li.swiper-slide a img{
  width:100%;
  transition:0.5s;
}

.swiper-slider08 ul li.swiper-slide a:hover img{
  opacity: 0.7;
}

.swiper-slider08 ul li.swiper-slide dl{
  width:85%;
  margin: 0 auto;
}

.swiper-slider08 ul li.swiper-slide dl dt{
  min-height: 95px; 
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 170%;
  text-align: center;
}

.swiper-slider08 ul li.swiper-slide dl dd{  
  font-size: 2.2rem;
  font-weight: 600; 
  text-align: center;  
}

.swiper-slider08 ul li.swiper-slide dl dd span{  
  display: inline-block;
  font-size:1.6rem;    
  font-weight: 500; 
}

section.products01 div.slider08 a{
  font-weight: 500;
}

.swiper-slider08 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  z-index: 102;
  margin:15px auto 0 auto;
 }

.swiper-slider08 .swiper-pagination-bullet {
  width:13px;
  height:13px;
  background-color: #DBDBDB;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.swiper-slider08 .swiper-pagination-bullet-active{
  background-color: #D29836;
}

.swiper-slider08 ul li.swiper-slide p{  
  width: 90%;
  height: 40px;
  padding: 0;
  margin: 0;
  position: absolute;
  bottom:0;
  left:50%;
  transform: translateX(-50%);
}

.swiper-slider08 ul li.swiper-slide p a{
  width:100%;
  height: 100%;  
  background:#D29836;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;  
  color: #FFF;
  transition: all 1s;
}

.swiper-slider08 ul li.swiper-slide p a:hover{  
  background:#F8F4E5;
  color: #444;
}

.slider08 .swiper-controller{
  width:100%;
  height: 25px;
  position: absolute;
  top:40%;
  left:50%;
  transform: translate(-50%,-50%);
  padding: 0 7px;
  z-index: 101;
 }

.slider08 .swiper-controller .swiper-button-prev,
.slider08 .swiper-controller .swiper-button-next{
  position: relative;
  background-color: rgba(70,70,70,0.8);
  width: 35px;
  height: 35px;
  background: #2C893A;
  cursor: pointer;
}

.slider08 .swiper-controller .swiper-button-prev::after{
  content: "";
  border-top: solid 2px #FFF;
  border-left: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-30%,-50%) rotate(-45deg) ;
}

.slider08 .swiper-controller .swiper-button-next::after{
  content: "";
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-70%,-50%) rotate(45deg);
}

/* ======================================
                                        スライダー9
========================================*/

div.slider09{  
  position: relative;
  width:90%;
  margin: 0 auto;
}

.swiper-slider09{
  width:100%;
  position: relative;  
  z-index: 100;
}

.swiper-slider09 ul li.swiper-slide img{
  width:100%;
}

.swiper-slider09 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  z-index: 102;
  position: absolute;
  left:0;
  bottom:20px;
 }

.swiper-slider09 .swiper-pagination-bullet {
  width:12px;
  height:12px;
  background-color: #FFF;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.swiper-slider09 .swiper-pagination-bullet-active{
  background-color: #D29836;
}

/* ======================================
                                   スライダー10  PC
========================================*/

div.slider10{  
  position: relative;
  width:95%;
  padding: 0 60px;
  margin: 0 auto 40px auto;
}

@media print, screen and (min-width:1200px) {
  div.slider10{  
    position: relative;
    width:100%;
    max-width: 1400px;
    margin: 0 auto 40px auto;
  }
}

.swiper-slider10{
  width:100%; 
  background-color: #FFF;
  margin: 0 auto;
}

.swiper-slider10 .swiper-slide{
  width:225px;
  padding: 0 0 70px 0;
  margin: 0 auto;
}

.swiper-slider10 ul li.swiper-slide img{
  width:100%;
}

section.products01 div.slider10 dl{
  margin: 15px 0 0 0;
}

.swiper-slider10 ul li.swiper-slide dl dt{
  font-size: 1.6rem;
  line-height: 130%;
  margin: 10px 0 3px 0;
}

section.products01 div.slider10 dl dd{  
  font-size: 1.6rem;
  font-weight: 600;
}

section.products01 div.slider10 a{
  font-weight: 500;
}

.swiper-slider10 .swiper-pagination{
  width:100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  z-index: 102;
  margin:15px auto 0 auto;
 }

.swiper-slider10 .swiper-pagination-bullet {
  width:13px;
  height:13px;
  background-color: #DBDBDB;
  border-radius:50%;
  padding: 0;
  margin: 0 7px;
}

.swiper-slider10 .swiper-pagination-bullet-active{
  background-color: #D29836;
}

.swiper-slider10 ul li.swiper-slide p{  
  width: 100%;
  height: 40px;
  padding: 0;
  margin: 0;
  position: absolute;
  bottom:0;
  left:0;
}

.swiper-slider10 ul li.swiper-slide p a{
  width:100%;
  height: 100%;
  background:#F8F4E5;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #444;
  transition: all 1s;
}

.swiper-slider10 ul li.swiper-slide p a:hover{  
  background:#D29836;
  color: #FFF;
}

.slider10 .swiper-controller{
  width:100%;
  height: 25px;
  position: absolute;
  top:40%;
  left:50%;
  transform: translate(-50%,-50%);
  padding: 0 7px;
  z-index: 101;
 }

.slider10 .swiper-controller .swiper-button-prev,
.slider10 .swiper-controller .swiper-button-next{
  position: relative;
  background-color: rgba(70,70,70,0.8);
  width: 35px;
  height: 35px;
  background: #2C893A;
  cursor: pointer;
}

.slider10 .swiper-controller .swiper-button-prev::after{
  content: "";
  border-top: solid 2px #FFF;
  border-left: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-30%,-50%) rotate(-45deg) ;
}

.slider10 .swiper-controller .swiper-button-next::after{
  content: "";
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  width: 8px;
  height: 8px;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-70%,-50%) rotate(45deg);
}