@charset "UTF-8";

@media all and (min-width: 768px) {
  .block_frontSlide { margin-top: 50px; background: none; }
  .block_frontSlide .swiper  { width: 1010px!important; }
  .swiper-pagination { margin: 0 0 0 399px; padding: 10px 20px 5px 20px; width: auto!important; background: #e63820; border-radius: 7em; border: 8px solid #fff; bottom: 19px!important; box-shadow: 0px 10px 5px 0px rgba(0, 0, 0, 0.2);  }
  .block_frontSlide .swiper .swiper-wrapper { box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-wrapper::after { border: solid 6px #fff;box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.5); }
  .block_frontSlide .swiper .swiper-button-next { top: -80px; left: -30px; width: 90px; height: 90px; background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_next.svg)!important;box-shadow: 10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-next:hover { top: -80px; left: -30px;background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_next.svg)!important;box-shadow: 10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-prev { top: -80px; left: -1000px; width: 90px; height: 90px; background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_prev.svg)!important;box-shadow: -10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-prev:hover {top: -80px; left: -1000px; background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_prev.svg)!important;box-shadow: -10px 0px 10px 0px rgba(0, 0, 0, 0.2); }

  .calpasMenu--base img { vertical-align: bottom; }
  /*.block_calpasMenu { margin: -280px 0 0 0; padding: 470px 0 0 0; background: url(/pages/top/assets/images/bg_contents.webp) no-repeat center top; background-size: 1200px 4450px; position: relative; } /* CPバナーなし 4400px*/
  /*.block_calpasMenu { margin: -280px 0 0 0; padding: 470px 0 0 0; background: url(/pages/top/assets/images/bg_contents.webp) no-repeat center top; background-size: 1200px 4050px; position: relative; } /* CPバナーなし 4400px*/
  .block_calpasMenu { margin: -280px 0 0 0; padding: 470px 0 0 0; background: url(/pages/top/assets/images/bg_contents.webp) no-repeat center top; background-size: 1200px 5250px; position: relative; } /* CPバナーあり 4400px*/
  .block_calpasMenu::before { left: -1000px; }
  .block_calpasMenu::after { right: -1000px; }
  
  .contentsProducts { margin-top: -85px; padding-bottom: 0; }
  .contentsProducts .single li { margin-bottom: 30px; }
  .contentsProducts .double { display: flex; flex-wrap: nowrap; justify-content: space-between; width: 100%; }
  .contentsProducts .double li { margin-bottom: 20px; width: 410px; }
  .contentsProducts .double li img { width: auto; height: auto;}
  .contentsProducts .double li a { display: block; }
  .area_news { margin-top: -0px!important; }
  /*.area_news .calpasMenu_title { margin-top: -85px!important; }*/
  .area_news .inner { position: relative; padding: 0px!important; margin-top: -20px!important; }
  .area_news .calpasMenu_title { margin-top: -210px!important; }
  .area_know { margin-top: -10px!important; }
  .area_security { margin: 190px 0 0 0!important; }
  .area_security .inner div { margin-top: -90px; }

  .contentsCompany { display: flex; display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 40px auto 0 auto; width: 850px; padding: 0 0 680px 0; }
  .contentsCompany li { width: 410px; text-align: center; height: 330px; }
  .contentsCompany li div { position: relative; height: 270px; }
  .contentsCompany h2 { position: absolute; left: 30px; text-align: center; z-index:2; }
  .contentsCompany h2 img { width: 350px; vertical-align: bottom; }
  .contentsCompany h2 + div { top: 65px; z-index:1; }

  .contentsNews { position: relative!important; padding: 45px 0 170px 0; background: url(/pages/top/assets/images/contents_news.png) no-repeat center bottom!important; background-size: 100% auto; border-radius: 30px; }
  .contentsNews ul { margin: 0 auto 10px auto; width: 660px; }
  .listNews { margin: 0; display: flex; flex-wrap: wrap; }
  .listNews li { width: 50%; box-sizing: border-box;}
  .listNews li:first-child { border-right: 1px solid #f8cda0; border-bottom: 1px solid #f8cda0; }
  .listNews li:nth-child(2) { border-bottom: 1px solid #f8cda0; }
  .listNews li:nth-child(3) { border-right: 1px solid #f8cda0; }
  .listNews li dl { display: table; margin: 20px 15px; width: 300px; }
  .listNews li dt { display: table-cell; width: 120px; vertical-align: top; }
  .listNews li dd { display: table-cell; width: 180px; vertical-align: top; font-feature-settings: "palt"; }
  .listNews li:first-child dl,
  .listNews li:nth-child(2) dl { margin-top: 10px; }
  .listNews li:nth-child(3) dl,
  .listNews li:last-child dl { margin-bottom: 10px; }
  .listNews .time { color: #ca3627;}

  .illust { position:absolute; bottom: 0; width: 100%;}
  .illust ul { position: relative; margin: 0 auto; width: 1300px; }
  .illust ul img { width: 102px; }
  .illust ul li:first-child { position: absolute; bottom: 130px; }
  .illust ul li:nth-child(2) {position: absolute; left: 300px; bottom: 40px; }
  .illust ul li:nth-child(3) {position: absolute; left: 600px; bottom: 0px; }
  .illust ul li:nth-child(4) {position: absolute; left: 900px; bottom: 40px; }
  .illust ul li:nth-child(5) {position: absolute; right: 0; bottom: 130px; }
  footer { margin-top: 50px; background: none; }
}
@media all and (max-width: 767px) {
  .block_frontSlide { background: none; }
  /*.block_calpasMenu { padding: 22vw 0 0 0; background: url(/pages/top/assets/images/bg_contents_sp.svg) no-repeat center top; background-size: 95% 96%; position: relative; } バナーなし 98.5%*/
  .block_calpasMenu { padding: 22vw 0 0 0; background: url(/pages/top/assets/images/bg_contents_sp.svg) no-repeat center top; background-size: 98.5% 99%; position: relative; } /* バナーあり 98.5%*/
  .calpasMenu_title {  width: 50%!important;}
  .header_inner { border: none!important; }
  .block_frontSlide .swiper .swiper-wrapper { margin-top: 2vw; box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.2);}
  .block_frontSlide .swiper .swiper-wrapper::after { border: solid 6px #fff;box-shadow: 10px 10px 5px 0px rgba(0, 0, 0, 0.5); }
  .swiper-pagination { left: 25%!important; right: 25%!important; margin: 0 auto!important; padding: 0 3vw 2px 3vw!important; width: 30%!important; background: #e63820; border-radius: 7em; border: 6px solid #fff; bottom: -4vw!important; box-shadow: 0px 10px 5px 0px rgba(0, 0, 0, 0.2);  }
  .swiper-pagination .swiper-pagination-bullet { background: #fff!important; }
  .swiper-pagination .swiper-pagination-bullet-active { background: #ffde05!important; }
  .block_frontSlide .swiper .swiper-button-next {background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_next.svg)!important;box-shadow: 10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-next:hover { background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_next.svg)!important;box-shadow: 10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-prev { background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_prev.svg)!important;box-shadow: -10px 0px 10px 0px rgba(0, 0, 0, 0.2); }
  .block_frontSlide .swiper .swiper-button-prev:hover {  background: #fff url(/cms2022/wp-content/themes/yagai_2022/assets/img/btn_prev.svg)!important;box-shadow: -10px 0px 10px 0px rgba(0, 0, 0, 0.2); }

  .block_calpasMenu { margin-top: -25%; }
  .block_calpasMenu::after { top: -0.4%; left: 83%; }
  .block_calpasMenu::before { top: -0.44%; left: 4%;}

  .contentsProducts  { margin-top: 10vw; padding-top: 15vw; }
  .contentsProducts li { margin-bottom: 1.5vw;}
  .contentsProducts .double { display: flex; flex-wrap: nowrap; justify-content: space-between; width: 100%; }
  .contentsProducts .double li { width: 47.8%; }
  .area_news { margin-top: -8vw!important; }
  .area_news .calpasMenu_title { margin-top: -10vw!important; }
  .area_news .contentsNews { padding: 10vw 0 30vw; background: #ffffd1 url(/pages/top/assets/images/bg_news.png) left bottom no-repeat; background-size: 100% auto; border-radius: 1em; }
  .listNews { margin: 0 auto; width: 88%; }
  .listNews li { padding-bottom: 3vw; margin-bottom: 3vw; border-bottom: 1px solid #f8cda0; }
  .listNews li:last-child { margin-bottom: 3vw; padding-bottom: 0; border-bottom: none; }
  .listNews li dl { display: table; width: 100%; }
  .listNews li dt { display: table-cell; width: 30%; padding-right: 5%; vertical-align: top; }
  .listNews li dd { display: table-cell; width: 65%; vertical-align: top; line-height: 1.6; }
  .listNews .time {  color: #ca3627;}
  .area_know { margin-top: 1vw!important; }
  .area_know .inner div { margin-top: -8vw; }
  .area_security { margin-top: 18vw;}
  .area_security .inner div { margin-top: -8vw; }
  
  .contentsCompany { display: flex; display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 3vw auto 0 auto; width: 75%; padding: 0 0 100vw 0; }
  .contentsCompany li { width: 47.8%;  }
  .contentsCompany li div { position: relative; }
  .contentsCompany li div h2 { position: absolute; z-index: 2; display: block;}
  .contentsCompany li div div { position: absolute; top: 9vw; }
  
  .illust { position:relative; bottom: 0; width: 100%;}
  .illust ul { position: relative; margin: 0 auto; }
  .illust ul img { width: 13vw; }
  .illust ul li:first-child { position: absolute; left: 1vw; bottom: 13vw; }
  .illust ul li:nth-child(2) {position: absolute; left: 20vw; bottom: 5vw; }
  .illust ul li:nth-child(3) {position: absolute; left: 42vw; bottom: 0; }
  .illust ul li:nth-child(4) {position: absolute; left: 64vw; bottom: 5vw; }
  .illust ul li:nth-child(5) {position: absolute; right: 1vw; bottom: 13vw; }

}