@charset "utf8";
/*=============================
	- font-style
	- 汎用 color & background
	- 汎用 wrap & title
	- common.css  共通パーツCSS
	- top.css  TOPページCSS
==============================*/

/*----------------------------------------------------
	font-style
----------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

/*  全体 font  */
html {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
    "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
  color: #212120;
}

@font-face {
  font-family: "aldo";
  src: url("../font/Aldo_PC.woff") format("woff");
  font-weight: normal;
}


/*----------------------------------------------------
	汎用 color & background
----------------------------------------------------*/
/* color */
.white {
  color: #fff;
}

.black {
  color: #000;
}

.base-color01 {
  /*--メイン文字カラー--*/
  color: #000;
}

.base-back01 {
  /*--メイン背景カラー--*/
  background: #fff;
}

.point-color01 {
  /*--ポイント文字カラー 薄灰--*/
  color: #c7c9c7;
}

.point-color02 {
  /*--ポイント文字カラー ピンク--*/
  color: #ffb6b9;
}

.point-color03 {
  /*--ポイント文字カラー 濃青--*/
  color: #3a4855;
}

.point-back01 {
  /*--ポイント背景カラー 薄イエロー--*/
  background: #fefff5;
}

.point-back02 {
  /*--アクセント背景カラー 白--*/
  background: #fff;
}

.point-back03 {
  /*--アクセント背景カラー 抹茶色--*/
  background: #adbe88;
}

.point-back04 {
  /*--アクセント背景カラー グラデーション--*/
  background: linear-gradient(to right, #9ad579, #7dd0fc);
}

.point-back05 {
  /*--アクセント背景カラー ピンク--*/
  background: #fd9e84;
}

.point-back06 {
  /*--アクセント背景カラー ブラウン--*/
  background: #453721;
}

.border-color01 {
  /*--枠線カラー 白--*/
  border: 1px solid #fff;
}

.border-color02 {
  /*--枠線カラー ピンク--*/
  border: 1px solid #ffb6b9;
}

/*----------------------------------------------------
	汎用 buttton
----------------------------------------------------*/
/* 詳しくはこちら・もっと見るボタン */
.btn01 {
  font-size: 15px;
  font-size: max(0.78vw, 15px);
  width: 360px;
  width: max(18.7vw, 360px);
  height: 70px;
  height: max(3.63vw, 70px);
  display: inline-block;
  text-align: center;
  border-radius: 35px;
  padding: 23.5px 0;
  padding: max(1.22vw, 23.5px) 0;
}

@media screen and (max-width: 767px) {
  .btn01 {
    width: 100%;
    height: 70px;
    padding: 23px 10px;
  }
}

/*----------------------------------------------------
	汎用 wrap & title
----------------------------------------------------*/
/*  width 管理  */
.mywidth {
  width: 92%;
  /* width: max(66.67vw, 906.7px); */
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .mywidth {
    width: 100%;
    min-width: inherit;
    padding-left: 5vw;
    padding-right: 5vw;
  }
}

/*  メインコンテンツwrap   */
#main-wrapp {
  overflow-x: hidden;
}

/* title */
.content-title01 {
  position: relative;
  min-height: 156px;
  min-height: max(8.13vw, 156px);
}

.content-title01 span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  font-size: 30px;
  font-size: max(1.56vw, 30px);
  font-weight: bold;
}
.heading {position: relative; }
.section-heading .heading-inner {
  position: relative;
  z-index: 2;
}

.content_title01 {
    font-size: 24px;
    font-weight: bold;
    color: #453721;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.content_title01::before {
    content: attr(data-text)"";
    font-size: 70px;
    color: #656a41;
    line-height: 1.2em;
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}

@media screen and (max-width: 767px) {
  .content-title01 {
    min-height: 100px;
  }

  .content-title01 span {
    font-size: 24px;
  }

  .section-heading::after {
    font-size: 40px;
    opacity: .5;
  }
	
	.content_title01 {
		font-size: 20px;
		margin-bottom: 30px;
	}
	.content_title01::before {
		font-size: 8.5vw;
	}	
}


.content_text {
    color: #212120;
    font-size: 16px;
    line-height: 2.0em;
	text-align: left;
	font-feature-settings: "palt";
    letter-spacing: 0.1em;
}
.content_img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 767px) {
	.content_text {
		font-size: 14px;
		line-height: 1.8em;
	}
}


/*----------------------------------------------------
	top.css  TOPページCSS
----------------------------------------------------*/
/*  main-v  */
.main-v-inner {
  background: #fff url(../images/mv.jpg) no-repeat center / cover;
  position: relative;
  padding: 80px 0 100px;
}

.main-v .main-title-wrap {
  max-width: 1180px;
  margin: 0 auto;
  position: relative;
  height: 100%;
}

.main-v .main-title-wrap-inner {
  width: 590px;
  width: max(30.64vw, 590px);
  text-align: center;
}

.main-v .main-title,
.main-v .main-title span {
  display: block;
  line-height: 2.4;
}

.main-v span.sub-title {
  font-size: 30px;
}

.main-v .main-text {
  font-size: 21px;
  font-size: max(1.09vw, 21px);
  line-height: 1.71;
  margin-top: 24px;
  margin-top: max(1.24vw, 24px);
}

.main-v .main-search {
  margin-top: 35px;
  margin-top: max(1.81vw, 35px);
}

.main-v .main-search .select-wrap::before {
  /* 三角マーク */
  content: "";
  position: absolute;
  top: 25px;
  top: max(1.3vw, 25px);
  right: 17px;
  right: max(0.89vw, 17px);
  border: 6px solid transparent;
  border: max(0.31vw, 6px) solid transparent;
  border-top: 11px solid #3e4043;
  border-top: max(0.57vw, 11px) solid #3e4043;
  z-index: 1;
}

.main-v .main-search select {
  display: block;
  width: 200px;
  width: max(10.38vw, 200px);
  height: 54px;
  height: max(2.8vw, 54px);
  font-size: 15px;
  font-size: max(0.78vw, 15px);
  font-family: inherit;
  color: #000;
  background: #fff;
  border: none;
  border-radius: 8px;
  border-radius: max(0.41vw, 8px);
  padding: 16px 36px 16px 11px;
  padding: max(0.83vw, 16px) max(1.87vw, 36px) max(0.83vw, 16px) max(0.57vw, 11px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}

.main-v .main-search .cross {
  position: relative;
  width: 40px;
  width: max(1.67vw, 40px);
  height: 54px;
  height: max(2.8vw, 54px);
}

.main-v .main-search .cross::before,
.main-v .main-search .cross::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  width: 1px;
  height: 30px;
  height: max(2.08vw, 30px);
  background: #000;
}

.main-v .main-search .cross::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.main-v .main-search .cross:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.main-v .main-search .sbtn-wrap {
  margin-left: 18px;
  margin-left: max(0.94vw, 18px);
  position: relative;
}

.main-v .main-search .sbtn-wrap::before {
  /* 虫眼鏡アイコン */
  content: "";
  display: block;
  width: 26px;
  width: max(1.35vw, 26px);
  height: 26px;
  height: max(1.35vw, 26px);
  background-image: url(../images/mv-search-icon.png);
  background-size: cover;
  position: absolute;
  top: 16px;
  top: max(0.72vw, 16px);
  top: 21%;
  left: 28px;
  left: max(1.61vw, 28px);
  cursor: pointer;
}

.main-v .main-search input[type="submit"] {
  border: none;
  width: 130px;
  width: max(6.75vw, 130px);
  height: 54px;
  height: max(2.8vw, 54px);
  border-radius: 27px;
  font-size: 18px;
  font-size: max(0.93vw, 18px);
  padding-top: 2px;
  padding-top: max(0.1vw, 2px);
  padding-left: 60px;
  padding-left: max(3.11vw, 60px);
  cursor: pointer;
}

.main-v .info-inner {
  padding: 22px 0;
  align-items: center;
}

.main-v .info .tag {
  padding: 7px 16px;
  border-radius: 50px;
  white-space: nowrap;
}

.main-v .info .info-table {
  width: auto;
  margin-left: 15px;
  font-size: 15px;
}

.main-v .info .info-table td {
  vertical-align: top;
}

.main-v .info .info-table .date {
  padding-right: 1em;
}

.main-v .info .link {
  border-bottom: 1px solid #000;
  padding-bottom: 4px;
  height: min-content;
}

.main-v .info .link a {
  color: #000;
  display: block;
  transition: 0.3s;
}

.main-v .info .link a:hover {
  opacity: 0.6;
}

.main-v .info-text {
  font-family: 'Aldo', sans-serif;
  text-transform: uppercase;
  padding-right: 32px;
  margin-bottom: -0.2em;
}

@media screen and (max-width: 767px) {

  .main-v-inner {
    height: auto;
    background-position: 58% center;
  }

  .main-v .info-inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    align-items: flex-start;
  }

  .main-v .info-left,
  .main-v .info-item {
    align-items: flex-start;
  }

  .main-v .sp-column {
    flex-direction: column;
  }

  .main-v .info-item {
    margin-top: 4px;
  }

  .main-v .info .tag,
  .main-v .info .news {
    margin-left: 0;
  }

  .main-v .info .tag {
    font-size: 14px;
    padding: 4px 8px;
  }

  .main-v .info .info-table {
    margin-left: 0;
    margin-top: 10px;
    font-size: 14px;
  }

  .main-v .link {
    margin-top: 24px;
    text-align: center;
    width: max-content;
    margin-left: auto;
    margin-right: auto;
  }

  .main-v .main-title {
    max-width: 350px;
  }

  .main-v .main-title-wrap {
    max-width: 500px;
    margin: 0;
  }

  .main-v .main-title-wrap-inner {
    width: auto;
  }

  .main-v span.sub-title {
    font-size: 18px;
    line-height: 1.4;
    letter-spacing: 0.15em;
    margin-bottom: 8px;
  }

  .main-v .mv-logo {
    width: 60%;
    margin: 40px auto;
  }

  .main-v .main-text {
    font-size: 14px;
    max-width: 350px;
    margin-top: 15px;
    text-shadow: 0 0 2px #fff, 0 0 4px #fff;
  }

  .main-v .main-text .sp-f17 {
    font-size: 17px;
  }

  .main-v .main-search {
	width: 100%;
	margin-top: 30px;
  }

  .main-v .main-search .sp-wrap {
    flex-wrap: wrap;
  }

  .main-v .main-search .select-wrap {
    flex: 1;
  }

  .main-v .main-search .select-wrap::before {
    top: 22px;
    right: 10px;
    border: 5px solid transparent;
    border-top: 8px solid #3e4043;
  }

  .main-v .main-search select {
    width: 100%;
    height: 50px;
    font-size: 15px;
    border-radius: 8px;
    padding: 12px 27px 12px 12px;
    margin-right: 0;
  }

  .main-v .main-search .cross {
    width: 37px;
    height: 31px;
    margin: 0;
  }

  .main-v .main-search .cross::before,
  .main-v .main-search .cross::after {
    top: 25px;
    right: 16px;
    width: 2px;
    height: 30px;
  }

  .main-v .main-search .sbtn-wrap {
    margin-left: 0;
    margin-top: 15px;
    width: 100%;
  }

  .main-v .main-search .sbtn-wrap::before {
    width: 22px;
    height: 22px;
    top: 8px;
    left: calc(50% - 50px);
  }

  .main-v .main-search input[type="submit"] {
    width: 100%;
    height: 50px;
    font-size: 18px;
    padding-top: 3px;
    padding-left: 0;
    text-align: center;
  }
}