/* ---------------------------------------------------
	common
------------------------------------------------------ */
#mainvisual {
  background: url(../img/concept/mainvisual.jpg) center;
  background-size: cover;
}

.sec_tit .en {
  margin-top: 0;
  font-size: 2.4rem;
  letter-spacing: 0;
}

.concept_lead {
  margin-bottom: 56px;
  font-size: 1.8rem;
  letter-spacing: 0.2em;
  line-height: 2;
  text-align: center;
}

.concept_txt {
  text-align: center;
}

/* ---------------------------------------------------
	story
------------------------------------------------------ */
#story {
  position: relative;
  padding: 120px 0 180px;
}
#story::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 1280px;
  background: url(../img/concept/story_bg_01.png) no-repeat center top;
}

@media screen and (max-width: 810px) {
  #story {
    padding: 60px 0 60px;
  }
  #story::before {
    height: 100%;
    background: url(../img/concept/story_bg_01.png) no-repeat center top;
    background-size: auto 100%;
  }
}
/* ---------------------------------------------------
	location
------------------------------------------------------ */
#location {
  padding: 120px 0 0;
}
#location .location_img {
  margin-top: 56px;
}

@media screen and (max-width: 810px) {
  #location {
    padding: 60px 0 0;
  }
  #location .location_img {
    width: 100%;
    margin-top: 48px;
  }
  #location .location_img img {
    aspect-ratio: 20/9;
    object-fit: cover;
  }
}
/* ---------------------------------------------------
	season
------------------------------------------------------ */
#season {
  position: relative;
  padding: 120px 0 80px;
}
#season::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: -220px;
  width: 100%;
  height: 735px;
  background: url(../img/concept/season_bg_01.png) no-repeat center top;
}
#season .season_block {
  margin-top: 60px;
}
#season .season_block + .season_block {
  margin-top: 80px;
}
#season .season_block .season_bg {
  display: flex;
  min-height: 610px;
  flex-direction: column;
  justify-content: flex-end;
  background: var(--main_color);
}
#season .season_block .season_bg .bg_txt {
  position: relative;
  padding: 0 30px 92px;
}
#season .season_block .season_bg .bg_txt::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: calc(100% - 56px);
  border-left: 1px solid #6d844f;
}
#season .season_block .season_bg .bg_lead {
  margin-bottom: 56px;
  font-size: 1.8rem;
  letter-spacing: 0.2em;
  line-height: 1.75;
  position: relative;
}
#season .season_block .season_bg .bg_lead::before {
  content: "";
  display: block;
  position: absolute;
  left: -33px;
  top: 12px;
  width: 8px;
  height: 8px;
  background: #a8c878;
  border-radius: 50%;
}
#season .season_block .sec_tit {
  width: max-content;
  margin-left: 0;
  margin-bottom: 92px;
  padding-bottom: 0;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
#season .season_block .sec_tit::before {
  content: none;
}
#season .season_block .sec_tit::after {
  content: none;
}
#season .season_block .sec_tit .icon {
  top: auto;
  display: block;
  margin: 0 auto 16px;
}
#season .season_block .sec_tit .en {
  margin-top: 10px;
  font-size: 1.2rem;
  letter-spacing: 0.2em;
}
#season .season_block .season_col .col_txt {
  width: calc(50% - 80px);
}
#season .season_block .season_col .col_txt .txt_container {
  position: relative;
  height: 100%;
  max-width: 460px;
  margin-left: auto;
  padding-top: 64px;
  padding-left: 30px;
}
#season .season_block .season_col .col_txt .txt_container::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  border-left: 1px solid #6d844f;
}
#season .season_block .season_col .col_txt .txt_lead {
  position: relative;
}
#season .season_block .season_col .col_txt .txt_lead::before {
  content: "";
  display: block;
  position: absolute;
  left: -33px;
  top: 12px;
  width: 8px;
  height: 8px;
  background: #a8c878;
  border-radius: 50%;
}
#season .season_block .season_col .col_img {
  width: calc(50% + 80px);
  max-width: 720px;
  padding-top: 64px;
}
#season .season_block .season_col .col_img .img {
  width: 30.6%;
  max-width: 220px;
}
#season .season_block.spring .season_bg {
  background: url(../img/concept/spring_bg_01.webp) no-repeat center;
  background-size: cover;
}
#season .season_block.spring .sec_tit .en {
  color: #a8c878;
}
#season .season_block.summer .season_bg {
  background: url(../img/concept/summer_bg_01.webp) no-repeat center;
  background-size: cover;
}
#season .season_block.summer .season_bg .bg_txt::before {
  border-left-color: #3b6d10;
}
#season .season_block.summer .season_bg .bg_lead::before {
  background: #3b6d10;
}
#season .season_block.summer .sec_tit .en {
  color: #3b6d10;
}
#season .season_block.summer .season_col .col_txt .txt_container::before {
  border-left-color: #3b6d10;
}
#season .season_block.summer .season_col .col_txt .txt_lead::before {
  background: #3b6d10;
}
#season .season_block.autumn .season_bg {
  background: url(../img/concept/autumn_bg_01.webp) no-repeat center;
  background-size: cover;
}
#season .season_block.autumn .season_bg .bg_txt::before {
  border-left-color: #d44918;
}
#season .season_block.autumn .season_bg .bg_lead::before {
  background: #d44918;
}
#season .season_block.autumn .sec_tit .en {
  color: #d44918;
}
#season .season_block.autumn .season_col .col_txt .txt_container::before {
  border-left-color: #d44918;
}
#season .season_block.autumn .season_col .col_txt .txt_lead::before {
  background: #d44918;
}
#season .season_block.winter .season_bg {
  background: url(../img/concept/winter_bg_01.webp) no-repeat center;
  background-size: cover;
}
#season .season_block.winter .season_bg .bg_txt::before {
  border-left-color: #707fa0;
}
#season .season_block.winter .season_bg .bg_lead::before {
  background: #707fa0;
}
#season .season_block.winter .sec_tit .en {
  color: #707fa0;
}
#season .season_block.winter .season_col .col_txt .txt_container::before {
  border-left-color: #707fa0;
}
#season .season_block.winter .season_col .col_txt .txt_lead::before {
  background: #707fa0;
}

@media screen and (max-width: 810px) {
  #season {
    padding: 60px 0 40px;
  }
  #season::before {
    top: 80px;
    width: 100%;
    height: 100vw;
    background: url(../img/concept/season_bg_01.png) no-repeat center top;
    background-size: 150%;
  }
  #season .season_block {
    margin-top: 48px;
  }
  #season .season_block + .season_block {
    margin-top: 64px;
  }
  #season .season_block .season_bg {
    min-height: 420px;
  }
  #season .season_block .season_bg .bg_txt {
    padding: 64px 16px 56px 30px;
  }
  #season .season_block .season_bg .bg_lead {
    margin-bottom: 40px;
  }
  #season .season_block .sec_tit {
    margin-bottom: 40px;
  }
  #season .season_block .season_col .col_txt {
    width: 100%;
  }
  #season .season_block .season_col .col_txt .txt_container {
    max-width: 100%;
    padding-top: 32px;
  }
  #season .season_block .season_col .col_img {
    width: 100%;
    max-width: 100%;
    padding-top: 32px;
  }
  #season .season_block .season_col .col_img .img {
    width: 30.6%;
    max-width: 100%;
  }
}
@media screen and (max-width: 480px) {
  #season .season_block.spring .season_bg {
    background: url(../img/concept/spring_bg_01_sp.webp) no-repeat center;
    background-size: cover;
  }
  #season .season_block.summer .season_bg {
    background: url(../img/concept/summer_bg_01_sp.webp) no-repeat center;
    background-size: cover;
  }
  #season .season_block.autumn .season_bg {
    background: url(../img/concept/autumn_bg_01_sp.webp) no-repeat center;
    background-size: cover;
  }
  #season .season_block.winter .season_bg {
    background: url(../img/concept/winter_bg_01_sp.webp) no-repeat center;
    background-size: cover;
  }
}
/* ---------------------------------------------------
	omotenashi
------------------------------------------------------ */
#omotenashi {
  padding: 120px 0 0;
}
#omotenashi .omotenashi_col {
  margin-top: 60px;
  margin-bottom: 60px;
}
#omotenashi .omotenashi_col .col_item {
  position: relative;
  width: 33.333%;
}
#omotenashi .omotenashi_col .col_item .item_img {
  position: relative;
}
#omotenashi .omotenashi_col .col_item .item_img::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
  transition: opacity 1s;
}
#omotenashi .omotenashi_col .col_item .item_txt {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 0 16px 60px;
  text-align: center;
  text-shadow: 0 0 10px black;
}
#omotenashi .omotenashi_col .col_item .item_txt .txt_tit {
  margin-bottom: 40px;
  font-size: 2.4rem;
  line-height: 1.5;
}
#omotenashi .omotenashi_col .col_item .item_txt .txt_tit .en {
  display: block;
  margin-top: 24px;
  font-size: 1.2rem;
  letter-spacing: 0;
  line-height: 1.2;
}
#omotenashi .omotenashi_btn {
  margin-top: 64px;
}

@media screen and (max-width: 810px) {
  #omotenashi {
    padding: 60px 0 60px;
  }
  #omotenashi .omotenashi_col {
    width: 100%;
    margin-top: 48px;
    margin-bottom: 48px;
  }
  #omotenashi .omotenashi_col .col_item {
    width: 100%;
  }
  #omotenashi .omotenashi_col .col_item .item_img::after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 70%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
    transition: opacity 1s;
  }
  #omotenashi .omotenashi_col .col_item .item_img img {
    aspect-ratio: 4/4;
    object-fit: cover;
  }
  #omotenashi .omotenashi_col .col_item .item_txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 0 16px 0;
  }
  #omotenashi .omotenashi_col .col_item .item_txt .txt_tit {
    margin-bottom: 24px;
    font-size: 2rem;
  }
  #omotenashi .omotenashi_col .col_item .item_txt .txt_tit .en {
    margin-top: 16px;
  }
  #omotenashi .omotenashi_btn {
    margin-top: 48px;
  }
}
/* ---------------------------------------------------
	message
------------------------------------------------------ */
#message {
  padding: 160px 0 250px;
  background: url(../img/concept/message_bg_01.png) no-repeat center top;
}
@media screen and (min-width: 1921px) {
  #message {
    background-size: 100%;
  }
}
#message .concept_txt {
  margin-bottom: 230px;
}
#message .message_col {
  margin-top: 60px;
  margin-bottom: 60px;
}
#message .message_col .col_item {
  position: relative;
  width: 25%;
}
@media (any-hover: hover) {
  #message .message_col .col_item:hover {
    opacity: 1;
  }
  #message .message_col .col_item:hover .item_img::after {
    opacity: 0.2;
  }
}
#message .message_col .col_item .item_img {
  position: relative;
}
#message .message_col .col_item .item_img::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
  transition: opacity 1s;
}
#message .message_col .col_item .item_tit {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 0 16px 48px;
  font-size: 2.4rem;
  line-height: 1.5;
  text-align: center;
  text-shadow: 0 0 10px black;
}
#message .message_col .col_item .item_tit .en {
  display: block;
  margin-top: 24px;
  font-size: 1.2rem;
  letter-spacing: 0.2em;
  line-height: 1.2;
}
#message .message_col .col_item .item_tit .arrow {
  margin-right: -48px;
  margin-left: 8px;
  margin-bottom: 2px;
}

@media screen and (max-width: 810px) {
  #message {
    padding: 60px 0 150px;
    background: url(../img/concept/message_bg_01.png) no-repeat center top;
    background-size: cover;
  }
  #message .concept_txt {
    margin-bottom: 120px;
  }
  #message .message_col {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  #message .message_col .col_item {
    width: 50%;
  }
  #message .message_col .col_item .item_img::after {
    height: 70%;
  }
  #message .message_col .col_item .item_tit {
    padding: 0 16px 32px;
    font-size: 2rem;
  }
  #message .message_col .col_item .item_tit .en {
    margin-top: 16px;
    letter-spacing: 0.1em;
  }
}