@charset "UTF-8"; /* =============================================================================
* Grobal Settings
==============================================================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

html {
  height: 100%;
  font-size: 100%;
  display: block;
}

body {
  margin: 0;
  padding: 0;
  min-width: auto;
  /* font-size: clamp(1rem, 0.178rem + 3.51vw, 1.625rem); */
  /* font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO"; */
}

body img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}

ul {
  list-style-type: none;
}

.s-font {
  font-size: 80%;
}

p {
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-weight: bold;
  color: #fff;
}

/*---- common ----*/
.inner {
  max-width: 640px;
  margin: 0 auto;
}

/*---- header ----*/
header {
  border-bottom: solid 1px #c8c8c8;
}

.hd_logo {
  margin: 0 auto;
  max-width: 637px;
}

.top_content {
  max-width: 640px;
  margin: 0 auto;
}

/*---- main ----*/
.main, .third_content {
  background-color: #c3257e;
}

.main {
  padding-bottom: 24px;
}

.mv_bottom {
  width: 100%;
  margin: 0 auto;
}

@media screen and (min-width: 701px) {
  .main {
  padding-bottom: 35px;
  }
  .mv_bottom {
  margin: 0 auto;
  }
}

/*---- con_li_img ----*/
.con_li .con_li_img {
  margin: 0 auto;
  }
.con_li .con_li_img img {
  display: block;
  margin: 0 auto;
  position: relative;
}

/*---- .first_content ----*/
.first_content {
  padding-bottom: 46px;
  margin-top: 0;
  background: #f9e9f2;
}
.first_content .arrow {
  position: relative;
  top: -1px;
}
.first_content .con_ul {
  width: 100%;
  margin: 0 auto;
}

/*---- .first_content タイトル ----*/
.first_content .con_ttl.ttl01 {
  margin: 32px auto 32px;
}

.first_content .con_ttl.ttl02 {
  margin: 37px auto 37px;
}

.first_content .con_ttl.ttl03 {
  margin: 37px auto 32px;
}

.first_content .con_ttl.ttl04 {
  margin: 36px auto 38px;
}

/*---- .first_content コンテンツ ----*/
.first_content .con_li_img1_1{
  margin-top: 0;
}

.first_content .con_li_img1_2 {
  margin-top: -1px;
}

.first_content .con_li_img2_1 {
  margin-bottom: 15px;
}

.first_content .con_li_img2_2 {
  margin-top: 59px;
  margin-bottom: 15px;
}

.first_content .con_li_img3_1 {
  margin-bottom: 15px;
}

.first_content .con_li_img3_2 {
  margin-top: 63px;
  margin-bottom: 13px;
}

.first_content .con_li_img3_3 {
  margin-top: 58px;
  margin-bottom: 11px;
}

.first_content .con_li_img3_4 {
  margin-top: 59px;
  margin-bottom: 15px;
}

.first_content .con_li_img4_1 {
  margin-bottom: 15px;
}

.first_content .con_li_img4_2 {
  margin-top: 59px;
  margin-bottom: 15px;
}

.first_content .con_li_img4_3 {
  margin-bottom: 37px;
}

.first_content .con_li_img4_4 {
  margin-bottom: 0;
}


@media screen and (min-width: 701px) {
  .first_content {
    padding-bottom: 60px;
  }

  .first_content .con_ul {
    width: 100%;
    margin: 0 auto;
  }

  /*---- .first_content タイトル ----*/
  .first_content .con_ttl.ttl01 {
    margin: 55px auto 55px;
  }

  .first_content .con_ttl.ttl02 {
    margin: 60px auto 60px;
  }

  .first_content .con_ttl.ttl03 {
    margin: 65px auto 55px;
  }

  .first_content .con_ttl.ttl04 {
    margin: 70px auto 60px;
  }

/*---- .first_content コンテンツ ----*/

  .first_content .con_li_img1_1{
    margin-top: 0;
  }

  .first_content .con_li_img1_2 {
    margin-top: -1px;
  }

  .first_content .con_li_img2_1 {
    margin-bottom: 25px;
  }

  .first_content .con_li_img2_2 {
    margin-top: 85px;
    margin-bottom: 25px;
  }

  .first_content .con_li_img3_1 {
    margin-bottom: 25px;
  }

  .first_content .con_li_img3_2 {
    margin-top: 90px;
    margin-bottom: 25px;
  }

  .first_content .con_li_img3_3 {
    margin-top: 90px;
    margin-bottom: 25px;
  }

  .first_content .con_li_img3_4 {
    margin-top: 95px;
    margin-bottom: 25px;
  }

  .first_content .con_li_img4_1 {
    margin-bottom: 25px;
  }

  .first_content .con_li_img4_2 {
    margin-top: 95px;
    margin-bottom: 25px;
  }

  .first_content .con_li_img4_3 {
    margin-bottom: 50px;
  }

  .first_content .con_li_img4_4 {
    margin-bottom: 0;
  }
}


/*---- .column ----*/
.column {
  background: rgba(29,160,242,0.1);
}

.column img:nth-child(1) {
  margin: 15px auto 0;
}

.column img:nth-child(2) {
  margin: 0 auto 20px;
}

@media screen and (min-width: 701px) {
  .column img:nth-child(1) {
    margin: 23px auto 0;
  }

  .column img:nth-child(2) {
    margin: 0 auto 39px;
  }
}

/*---- .third_content ----*/
.third_content {
  padding: 6% 0;
}

.third_content .inner > img {
  margin: 3px auto 8px;
  display: block;
}

.third_content .inner ul {
  color: #fff;
  text-align: center;
  font-size: clamp(0.813rem, -0.174rem + 4.21vw, 1.253rem);
  margin-bottom: 4%;
}

.third_content .inner > a img {
  width: 92%;
  margin: 7px auto 0;
  display: block;
}

.copy {
  font-size: 14px;
  text-align: center;
  font-family: 'Noto Sans JP' !important;
  font-weight: 400;
  color: #4c3b00;
  margin-top: 10px;
}

@media screen and (min-width: 701px) {
.third_content {
  padding: 55px 0 60px;
}

.copy {
  font-size: 25px;
  font-weight: 400;
  margin-top: 20px;
}
.third_content .inner > img {
  margin: 0 auto 15px;
  display: block;
}
}

.chromeperfectpixel-overlay {
  width: 100%!important;
  height: auto!important;
}

/*---- swiper ----*/

.swiper img{ /* 画像が見切れるのを防ぐ */
  vertical-align: top;
}
.swiper{
  border-radius: 15px;
  width: 87.5%;
  aspect-ratio: 841 / 701; /* 画像の縦横比保持 */
}
.swiper--wrapper {   /* wrapperのサイズを調整 */
  width: 100%;
  height: auto;
}
.swiper-slide {   /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  color: #ffffff;
  width: 100%;
  height: 100%;
  text-align: center;
  line-height: 300px;
}

/*---- swiperボタン ----*/

.swiper-button-prev,.swiper-button-next{
  width: 32px;
  height: 32px;
}
.swiper-button-prev::after,.swiper-button-next::after{
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  height: 32px;
  margin: auto;
  width: 32px;
  margin-top: 7px;
}
.swiper-button-next::after{
  background-image: url(../img/slide_btn.png);
}
.swiper-button-prev::after{
  background-image: url(../img/slide_btn.png);
  transform: scale(-1,1);
}
.swiper-slide img{
  height: auto;
  width: 100%;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {  /* 押せない場合は非表示 */
  opacity: 0;
}

/*---- ボタンを枠外に配置する処理 ----*/

.container_1,.container_2,.container_3,.container_4,.container_5,.container_6,.container_7,.container_8 {
  position: relative;
}
.swiper-button-prev {
  left: 14px;
}
.swiper-button-next {
  right: 14px;
}

@media screen and (min-width: 701px) {
  .swiper-button-prev,.swiper-button-next{
    width: 50px;
    height: 50px;
  }
  .swiper-button-prev::after,.swiper-button-next::after{
    height: 50px;
    width: 50px;
  }
  .swiper-button-prev {
    left: 25px;
  }
  .swiper-button-next {
    right: 25px;
  }
}

/*---- ドット ----*/

.swiper-pagination-bullet {
  background-color: transparent; /* 背景色透明 */
  background-image: url(../img/slide_dot.png);
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: unset; /* 画像欠け防止 */
  height: 8px;
  width: 8px;
  opacity: 1;
}
.swiper-pagination-bullet-active { /* 選択中のドット */
  background-image: url(../img/slide_dot-active.png);
  height: 8px;
  width: 8px;
}

@media screen and (min-width: 701px) {
  .swiper-pagination-bullet {
    height: 14px;
    width: 14px;
    margin: 0 7px 7px !important; /* ドットの位置・間隔 */
  }
}

/*---- .footer ----*/
.footer{
  padding-bottom: 30px;
  background: #f9e9f2;
}
.footer .inner > a {
  display: block;
}
.footer .inner > a img {
  width: 92%;
  margin: 0 auto;
  display: block;
}
.footer .btn_title{
  /* margin:46px auto 0; */
  display: block;
}
.investigation{
  margin: 15px auto 32px;
}
.footer_btn{
  margin:7px auto;
  display: block;
}
@media screen and (min-width: 701px) {
  .footer .btn_title{
    /* margin: 60px auto 5px; */
    display: block;
  }
  .investigation{
    margin: 25px auto 45px;
  }
  .footer{
    padding-bottom: 40px;
  }
}