@charset "UTF-8";
/*** ★" ***/

@font-face {
  font-family: "icon-button";
  src: url("/terroir/assets/fonts/icon-button.ttf?2polro") format("truetype"), url("/terroir/assets/fonts/icon-button.woff?2polro") format("woff"), url("/terroir/assets/fonts/icon-button.svg?2polro#icon-button") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

html {
  font-family: "Noto Sans JP", sans-serif;
}
menu {
  display: block;
  padding: 0;
  margin: 0;
}
menu li {
  padding: 0;
  margin: 0;
}

menu.moreLink.indexPage {
  margin: -60px 0 0 0;
  padding: 0 20px;
}
@media only screen and (max-width: 768px) {
  menu.moreLink.indexPage {
    margin: 0;
  }
}
menu.moreLink li a {
  margin: 0 0 0 auto;
  position: relative;
  display: flex;
  padding-top: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #7f6000;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #7f6000;
  font-weight: 500;
  max-width: 128px;
  width: 100%;
  padding-right: 28px;
}
menu.moreLink li a::before {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(0) rotate(135deg);
}
menu.moreLink li a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(-8px) rotate(135deg);
}
@media only screen and (min-width: 769px) {
  menu.moreLink li a:hover::before,
  menu.moreLink li a:hover::after {
    right: 5px;
  }
}

#pageContents .screen-reader {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

a[href^="tel"] {
  pointer-events: none;
}

@media only screen and (max-width: 769px) {
  a[href^="tel"] {
    pointer-events: auto;
  }
  a[href^="tel"]:hover {
    cursor: pointer;
    text-decoration: underline;
  }
}

/*:: Link ::*/
a[aria-controls] {
  display: inline-block;
  transform: scale(1);
  transition: transform 0.3s, background 0.3s;
}
a[aria-controls]:hover {
  transform: scale(1.01);
  transition: transform 0.2s, background 0.2s;
}
a[aria-controls]:active {
  transform: scale(0.99);
  transition: transform 0.1s, background 0.1s;
}

a[role="button"],
menu > li > button {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 2rem auto 0 auto;
  width: 100%;
  height: 44px;
  max-width: 320px;
  padding: 0 0.75rem;
  color: white;
  border: 1px solid #7f6000;
  border-radius: 4px;
  font-size: 0.9rem;
  line-height: 1;
  letter-spacing: 0.05em;
  font-weight: 600;
  font-family: "Noto Sans JP", sans-serif;
  transition: all 0.3s;
  background: #7f6000;
  -webkit-appearance: none;
  cursor: pointer;
}
@media only screen and (min-width: 769px) {
  a[role="button"]:hover {
    background: white;
    color: #7f6000;
  }
}

a[role="button"][class]::after {
  font-family: "icon-button" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 0 0 0.5rem;
  font-size: 1.2em;
}
[type="submit"][class]::after {
  font-family: "icon-button" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 0 0 1rem;
  font-size: 1em;
}
.icon-play::after {
  content: "\e912";
}
.icon-search::after {
  content: "\e986";
}
.icon-play3::after {
  content: "\ea1c";
}
.icon-new-tab::after {
  content: "\ea7e";
}
.icon-file-pdf::after {
  content: "\eadf";
}
.icon-file-word::after {
  content: "\eae1";
}
.icon-twitter > span,
.icon-facebook > span,
.icon-instagram > span {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
a[role="button"].icon-instagram-tag::after {
  content: "\ea0b";
  font-family: "myfont" !important;
  font-size: 1rem;
  margin: 0 0 0 0.5rem;
  display: inline-block;
}
a[role="button"].icon-instagram::after {
  content: "\ea0b";
  font-family: "myfont" !important;
  font-size: 1rem;
  margin: 0;
}
a[role="button"].icon-facebook::after {
  content: "\ea09";
  font-family: "myfont" !important;
  font-size: 1rem;
  margin: 0;
}
a[role="button"].icon-twitter::after {
  content: "\ea0a";
  font-family: "myfont" !important;
  font-size: 1rem;
  margin: 0;
}

[v-cloak] {
  display: none !important;
}

.l-header-function-jump {
  margin-right: 32px;
  margin-left: 24px;
}
.l-header-function-jump__item:not(:first-child) {
  margin-left: 16px;
}
.l-header-function-jump__link {
  white-space: nowrap;
  font-size: 0.85rem;
  text-align: center;
  line-height: 1.2;
}

@media screen and (max-width: 1440px) {
  .l-header {
    padding-left: 20px;
    padding-right: 15px;
  }
  .l-header__logo {
    width: 192px;
  }
  .l-header-function-jump__link {
    font-size: 0.8rem;
  }
}
@media screen and (max-width: 1280px) {
  .l-header__logo {
    width: 160px;
  }
  .l-header-function-jump {
    margin-right: 24px;
  }
  .l-header-function-jump__item:not(:first-child) {
    margin-left: 12px;
  }
}
@media screen and (max-width: 1200px) {
  .l-header-function-jump__link {
    font-size: 0.75rem;
  }
}

@media screen and (max-width: 960px) {
  .l-header {
    height: 62px;
  }
  .l-header-function {
    display: none;
  }
  .fullScreenMenu-button {
    display: block;
  }
}

.top-about-detail__foot {
  display: flex;
  padding-left: 0;
}
.top-about-detail__foot > * {
  flex: 0 0 auto;
  padding: 0.5rem;
}

@media only screen and (max-width: 1023px) {
  .top-about-detail__foot {
    padding-left: 0px;
  }
}
@media only screen and (max-width: 768px) {
  .top-about-detail__foot {
  }
}

.top-about-person {
  margin-top: 0;
  align-items: stretch;
}
.c-sliderArticle.-right .c-sliderArticle__thumbnail {
  margin-left: calc((100% - 100vw) / 2);
  margin-right: -20px;
}
.c-sliderArticle.-left .c-sliderArticle__thumbnail {
  margin-right: calc((100% - 100vw) / 2);
  margin-left: -20px;
}
@media only screen and (max-width: 768px) {
  .top-about-person {
    margin-top: 32px;
  }
  .c-sliderArticle.-right .c-sliderArticle__thumbnail {
    margin-left: calc((100% - 100vw) / 2);
    padding-right: 0;
  }
  .c-sliderArticle.-left .c-sliderArticle__thumbnail {
    margin-right: calc((100% - 100vw) / 2);
    padding-left: 0;
  }
}

.about-content__item.-grid .about__inner {
  grid-template-rows: auto 1fr;
}

.top-about-person-detail {
  height: auto;
}
.top-about-person-detail__text {
  height: auto;
  line-height: 1.8;
}
.top-about-person-detail:before {
  left: 0;
  width: calc(100% - 300px);
}

.top-about-person-thumbnail {
  height: auto;
}
.top-about-person-thumbnail * {
  display: block;
  height: 100%;
}

#lab_report > .c-labTitle {
  margin-top: 80px;
}
@media only screen and (max-width: 768px) {
  #lab_report > .c-labTitle {
    margin-top: 60px;
  }
}

/* 2022年度新規コンテンツ用 */
#breadcrumb {
  display: flex;
  align-items: center;
  height: 40px;
  width: 100%;
  margin: 90px 0 0 0;
  padding: 0 50px;
  background: #7f6000;
}
#breadcrumb li {
  display: inline-block;
  color: #fff;
  font-size: 0.875rem;
  line-height: 1.5;
}
#breadcrumb a {
  position: relative;
  margin-right: 20px;
}
#breadcrumb a:before {
  position: absolute;
  content: "";
  top: 50%;
  right: -12px;
  height: 8px;
  width: 8px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: translateY(-50%) rotate(45deg);
}
@media only screen and (max-width: 960px) {
  #breadcrumb {
    margin: 62px 0 0 0;
    height: auto;
    padding: 10px 20px;
  }
  #breadcrumb li {
    font-size: 0.75rem;
  }
}
@media only screen and (min-width: 1079px) {
  #breadcrumb a:hover {
    text-decoration: underline;
  }
}

#pageContents {
  padding: 0 0 100px 0;
  background-image: url(../img/common/contents_bg.png);
  background-position: center;
  background-repeat: repeat;
}
@media only screen and (max-width: 768px) {
  #pageContents {
    padding: 0 0 60px 0;
  }
}

#pageContents > header {
  display: flex;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  padding: 20px 50px 20px;
}
#pageContents > header > h1 {
  flex: 1 0 50%;
  display: flex;
  flex-direction: column;
}
#pageContents > header > h1 > b {
  order: 2;
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 600;
  padding-left: 20px;
  padding-right: 20px;
}
#pageContents > header > h1 > i {
  order: 1;
  font-size: 1rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.05em;
  padding-bottom: 9px;
  padding-left: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid #7f6000;
  font-style: normal;
}
#pageContents > header > p {
  flex: 0 1 auto;
  font-size: 0.875rem;
  line-height: 2;
  letter-spacing: 0.05em;
  font-weight: 500;
  margin-top: 25px;
  padding: 0 20px 0 40px;
}

@media only screen and (max-width: 768px) {
  #pageContents > header {
    /*padding:16px 20px 20px;*/
    padding: 0;
    display: block;
  }
  #pageContents > header > h1 > b {
    font-size: 1.125rem;
    padding-left: 0px;
    padding-right: 0px;
  }
  #pageContents > header > h1 > i {
    margin-left: 0;
    padding-left: 0px;
    margin-bottom: 10px;
    font-size: 0.8rem;
  }
  #pageContents > header > p {
    margin-top: 20px;
    padding-left: 0px;
    padding-right: 20px;
  }
}

#pageContents.infoArticle,
#pageContents.experienceArticle {
  padding: 20px 20px 100px 20px;
}
@media only screen and (max-width: 768px) {
  #pageContents {
    padding: 20px 20px 60px 20px;
  }
}
#pageContents.infoArticle > header,
#pageContents.experienceArticle > header {
  display: block;
  width: 100%;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 0 50px 0;
}
#pageContents.infoArticle > header > h1,
#pageContents.experienceArticle > header > h1 {
  flex: 1 0 50%;
  display: flex;
  flex-direction: column;
}
#pageContents.infoArticle > header > h1 > b,
#pageContents.experienceArticle > header > h1 > b {
  order: 2;
  letter-spacing: 0;
  padding-left: 0;
  padding-right: 0;
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: bold;
}
#pageContents.infoArticle > header > h1 > i,
#pageContents.experienceArticle > header > h1 > i {
  order: 1;
  font-family: "Noto Sans JP", sans-serif;
  letter-spacing: 0;
  padding-bottom: 0;
  padding-left: 0;
  margin-bottom: 12px;
  border-bottom: none;
  font-style: normal;
  font-size: 1.125rem;
  line-height: 1.5;
  font-weight: 600;
  color: #888888;
}
#pageContents.infoArticle > header > time,
#pageContents.experienceArticle > header > time {
  display: block;
  font-size: 0.875rem;
  line-height: 1;
  font-weight: 400;
  margin-top: 16px;
  padding: 0;
  text-align: right;
}

@media only screen and (max-width: 960px) {
  #pageContents.infoArticle > header,
  #pageContents.experienceArticle > header {
    padding: 0 20px 50px 0;
  }
}
@media only screen and (max-width: 768px) {
  #pageContents.infoArticle > header,
  #pageContents.experienceArticle > header {
    padding: 0 20px 20px 0;
  }
  #pageContents.infoArticle > header > h1 > b,
  #pageContents.experienceArticle > header > h1 > b {
    font-size: 1.125rem;
  }
  #pageContents.infoArticle > header > h1 > i,
  #pageContents.experienceArticle > header > h1 > i {
    font-size: 0.925rem;
    margin-bottom: 12px;
  }
  #pageContents.infoArticle > header > time,
  #pageContents.experienceArticle > header > time {
    font-size: 0.75rem;
    margin-top: 12px;
  }
}

#pageContents.experienceArticle > menu {
}
#pageContents.experienceArticle > menu a[role="button"] {
  max-width: 320px;
  padding: 1rem;
  font-size: 1rem;
  margin: 0 auto;
}

#pageImage {
  margin: 0 0 80px 0;
  height: 110px;
}
#pageImage.hero {
  height: 740px;
}
#pageImage > img {
  object-fit: cover;
  object-position: 50% 50%;
  width: 100%;
  height: 100%;
}
#pageImage.hero > img {
  object-fit: cover;
  object-position: 50% 100%;
  width: 100%;
  height: 100%;
}
#pageImage.hero > video {
  object-fit: cover;
  object-position: 50% 50%;
  width: 100%;
  height: 100%;
}
@media only screen and (max-width: 768px) {
  #pageImage {
    margin: 0 -20px 40px -20px;
  }
  #pageImage.hero {
    height: 360px;
  }
}

.infoArticle #pageImage,
.experienceArticle #pageImage {
  width: 100%;
  max-width: 900px;
  margin: 0 auto 50px auto;
  height: 480px;
}
.infoArticle > p,
.experienceArticle [data-contents="description"] p {
  width: 100%;
  margin: 0 auto;
  max-width: 790px;
  font-size: 1rem;
  line-height: 2;
  font-weight: 500;
  letter-spacing: 0.04em;
}
.infoArticle > p + p,
.experienceArticle [data-contents="description"] p + p {
  margin: 20px auto 0 auto;
}
@media only screen and (max-width: 768px) {
  .infoArticle > p,
  .experienceArticle [data-contents="description"] p {
    font-size: 0.875rem;
  }
  .infoArticle #pageImage,
  .experienceArticle #pageImage {
    margin: 0 auto 50px auto;
    height: 300px;
  }
}

#pageContents.experienceArticle > section {
  width: 100%;
  margin: 50px auto;
  max-width: 790px;
}
#pageContents.experienceArticle > section > header {
  padding-bottom: 13px;
  border-bottom: 1px solid #7f6000;
  margin-bottom: 2rem;
}
#pageContents.experienceArticle > section > header > h2 {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  #pageContents.experienceArticle > section {
    margin: 30px auto;
  }
  #pageContents.experienceArticle > section > header {
    padding-bottom: 7px;
    margin-bottom: 1rem;
  }
  #pageContents.experienceArticle > section > header > h2 {
    font-size: 1rem;
  }
}

#pageContents.experienceArticle > section > dl {
  border-bottom: 1px solid #c3c0b6;
  font-family: "Noto Sans JP", "Lato", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  padding: 20px 0;
  display: grid;
  grid-template-columns: 170px 1fr;
  column-gap: 10px;
  grid-template-rows: 1fr;
  row-gap: 0;
}
#pageContents.experienceArticle > section > dl > dt {
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  color: #7f6000;
  width: 170px;
  padding: 0px 20px;
  line-height: 1.5;
  white-space: nowrap;
  font-weight: 600;
}
#pageContents.experienceArticle > section > dl > dd {
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  line-height: 1.5;
}
#pageContents.experienceArticle > section > dl > dd > small {
  font-size: 0.8rem;
  line-height: 1.4;
  display: block;
  margin: 0.8em 0 0 0;
}

#pageContents.experienceArticle > section > dl > dd > dl {
  margin: 2.4rem 0 0 -170px;
  display: grid;
  grid-template-columns: 160px 1fr;
  column-gap: 10px;
  grid-template-rows: 1fr;
  row-gap: 0;
}
#pageContents.experienceArticle > section > dl > dd > dl + dl {
  margin: 0.8rem 0 0 -170px;
}
#pageContents.experienceArticle > section > dl > dd > dl > dt {
  font-size: 0.8rem;
  letter-spacing: 0.05em;
  color: #7f6000;
  margin: 0;
  padding: 0px 10px;
  font-weight: 600;
  white-space: nowrap;
}
#pageContents.experienceArticle > section > dl > dd > dl > dd {
  margin: 0 0 0 0;
  padding: 0;
}

@media only screen and (max-width: 768px) {
  #pageContents.experienceArticle > section > dl {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 0.25em;
    padding: 10px;
  }
  #pageContents.experienceArticle > section > dl > dt {
    font-size: 0.8125rem;
    padding: 0;
    margin-bottom: 5px;
    width: 100%;
    white-space: normal;
  }
  #pageContents.experienceArticle > section > dl > dd {
    width: 100%;
    font-size: 0.8125rem;
    padding: 0;
  }

  #pageContents.experienceArticle > section > dl > dd > dl {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 0.25em;
    padding: 0;
    margin: 0.5rem 0 0 0;
  }
  #pageContents.experienceArticle > section > dl > dd > dl + dl {
    margin: 0.5rem 0 0 0;
  }
  #pageContents.experienceArticle > section > dl > dd > dl > dt {
    width: 100%;
    font-size: 0.75rem;
    margin: 0;
    padding: 0;
  }
  #pageContents.experienceArticle > section > dl > dd > dl > dd {
    width: 100%;
    font-size: 0.8125rem;
    padding: 0;
  }
}

#pageContents.experienceArticle > section > menu {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  column-gap: 10px;
  grid-template-rows: 1fr;
  row-gap: 0;
  margin: 2rem auto;
}
#pageContents.experienceArticle > section > menu a[role="button"] {
  margin: 0;
}

@media only screen and (max-width: 768px) {
  #pageContents.experienceArticle > section > menu {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 10px;
    grid-template-rows: 1fr 1fr;
    row-gap: 10px;
  }
}

#pageContents > nav,
nav#SearchUI {
  position: relative;
  margin-top: 60px;
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
  max-width: 960px;
  width: calc(100% - 40px);
  border: 1px solid #7f6000;
  padding: 40px 30px 30px;
  background: rgba(255, 255, 255, 0.5);
}
#pageContents > aside + nav {
  margin-top: 80px;
}
#pageContents > nav.withMap {
}
#pageContents > nav.withMap figure,
nav#SearchUI figure.withMap figure {
  float: right;
  width: 192px;
  height: 256px;
  text-align: center;
}
#pageContents > nav.withMap figure > img,
nav#SearchUI.withMap figure > img {
  max-width: 100%;
  max-height: 100%;
}
@media only screen and (max-width: 560px) {
  #pageContents > nav.withMap figure,
  nav#SearchUI.withMap figure {
    float: none;
    width: 100%;
    height: auto;
  }
  #pageContents > nav.withMap figure > img,
  nav#SearchUI.withMap figure > img {
    max-width: 160px;
  }
}

#pageContents > nav > header,
nav#SearchUI > header {
  background-image: url(../img/common/contents_bg.png);
  background-position: center;
  background-repeat: repeat;
  position: absolute;
  top: 0;
  right: auto;
  left: 50%;
  transform: translatex(-50%) translateY(-50%);
  white-space: nowrap;
  color: #7f6000;
  font-size: 1rem;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
}
#pageContents > nav > header > h2,
nav#SearchUI > header > h2 {
  padding: 0 48px;
  position: relative;
  font-size: 1.25rem;
}
#pageContents > nav > header > h2::before,
nav#SearchUI > header > h2::before {
  left: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}
#pageContents > nav > header > h2::after,
nav#SearchUI > header > h2::after {
  right: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}
@media only screen and (max-width: 768px) {
  #pageContents > nav > header,
  nav#SearchUI > header {
  }
  #pageContents > nav > header > h2,
  nav#SearchUI > header > h2 {
    font-size: 1rem;
    padding: 0 32px;
  }
}

#pageContents > nav > div,
nav#SearchUI > div {
  position: relative;
}
#pageContents > nav > dl,
nav#SearchUI > dl {
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-areas: "label input";
  grid-template-columns: 72px 1fr;
  column-gap: 32px;
  grid-template-rows: 1fr;
  row-gap: 0;
  place-items: center start;
}
@media only screen and (max-width: 768px) {
  #pageContents > nav > dl,
  nav#SearchUI > dl {
    grid-template-areas:
      "label"
      "input";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(2, auto);
    row-gap: 8px;
    place-items: start start;
  }
}

#pageContents > nav > dl + dl,
nav#SearchUI > dl + dl {
  margin: 16px 0 0 0;
}
#pageContents > nav > dl dt,
nav#SearchUI > dl dt {
  color: #7f6000;
  font-size: 0.8rem;
  line-height: 1;
  font-weight: 600;
  padding: 0;
}
#pageContents > nav > dl dd,
nav#SearchUI > dl dd {
  border-left: 1px solid rgba(127, 96, 0, 0.33);
  padding: 1rem 0 1rem 1rem;
  font-size: 0.9rem;
  line-height: 1;
  letter-spacing: 0.05em;
  width: 100%;
  overflow: hidden;
}
#pageContents > nav > dl dd ul,
nav#SearchUI > dl dd ul {
  margin: 0 0 -1rem 0;
}
#pageContents > nav > dl dd ul li,
nav#SearchUI > dl dd ul li {
  display: inline-block;
  margin: 0 1rem 1rem 0;
}
#pageContents > nav > dl dd ul li [type="checkbox"],
nav#SearchUI > dl dd ul li [type="checkbox"] {
  display: none;
}

#pageContents > nav > dl dd ul li label,
nav#SearchUI > dl dd ul li label {
  box-sizing: border-box;
  cursor: pointer;
  display: inline-block;
  padding: 5px 0 5px 30px;
  position: relative;
  width: auto;
}
#pageContents > nav > dl dd ul li label::before,
nav#SearchUI > dl dd ul li label::before {
  background: #fff;
  border: 1px solid rgba(127, 96, 0, 0.66);
  border-radius: 3px;
  content: "";
  display: block;
  height: 16px;
  left: 5px;
  margin-top: -8px;
  position: absolute;
  top: 50%;
  width: 16px;
}
#pageContents > nav > dl dd ul li label::after,
nav#SearchUI > dl dd ul li label::after {
  border-right: 2px solid #7f6000;
  border-bottom: 2px solid #7f6000;
  content: "";
  display: block;
  height: 12px;
  width: 6px;
  left: 10px;
  margin-top: -8px;
  position: absolute;
  top: 50%;
  transform: rotate(45deg);
  opacity: 0;
}
#pageContents > nav > dl dd ul li [type="checkbox"]:checked + label::after,
nav#SearchUI > dl dd ul li [type="checkbox"]:checked + label::after {
  opacity: 1;
}

#pageContents > nav > dl dd [type="text"],
nav#SearchUI > dl dd [type="text"] {
  background: white;
  border: 1px solid rgba(127, 96, 0, 0.66);
  border-radius: 3px;
  padding: 0.5em;
  max-width: 100%;
}
#pageContents > nav > dl dd [type="text"].keyword,
nav#SearchUI > dl dd [type="text"].keyword {
  width: 100%;
}

#pageContents > nav > dl dd [type="date"],
nav#SearchUI > dl dd [type="date"] {
  background: white;
  border: 1px solid rgba(127, 96, 0, 0.66);
  border-radius: 3px;
  padding: 0.5em;
  max-width: 100%;
  font-size: 0.85rem;
}

#pageContents > nav [type="submit"],
nav#SearchUI [type="submit"] {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 2rem auto 0 auto;
  width: 128px;
  padding: 0.75rem;
  color: white;
  border: 1px solid #7f6000;
  border-radius: 4px;
  font-size: 1rem;
  line-height: 1;
  font-weight: 600;
  font-family: "Noto Sans JP", sans-serif;
  transition: all 0.3s;
  background: #7f6000;
}
@media only screen and (min-width: 769px) {
  #pageContents > nav [type="submit"]:hover,
  nav#SearchUI [type="submit"]:hover {
    background: white;
    color: #7f6000;
  }
}
@media only screen and (max-width: 520px) {
  #pageContents > nav [type="submit"],
  nav#SearchUI [type="submit"] {
    margin: 2rem auto;
  }
}

#pageContents > nav > ul,
nav#SearchUI > ul {
  margin: 0 0 20px 0;
}
#pageContents > nav > ul > li,
nav#SearchUI > ul > li {
}
#pageContents > nav > ul > li + li,
nav#SearchUI > ul > li + li {
  margin: 1rem 0 0 0;
  padding: 1rem 0 0 0;
  border-top: 1px solid rgba(127, 96, 0, 0.2);
}
#pageContents > nav > ul > li > a,
nav#SearchUI > ul > li > a {
  font-size: 0.95rem;
  line-height: 1.2;
  letter-spacing: 0.05em;
  font-weight: 500;
  position: relative;
  display: block;
}
#pageContents > nav > ul > li > a > time,
nav#SearchUI > ul > li > a > time {
  font-size: 0.8rem;
  display: inline-block;
}
#pageContents > nav > ul > li > a > time::before,
nav#SearchUI > ul > li > a > time::before {
  content: "(";
}
#pageContents > nav > ul > li > a > time::after,
nav#SearchUI > ul > li > a > time::after {
  content: ")";
}
#pageContents > nav > ul > li > a,
nav#SearchUI > ul > li > a {
}

#pageContents > nav > ul > li > a::before,
nav#SearchUI > ul > li > a::before {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(0) rotate(135deg);
}
#pageContents > nav > ul > li > a::after,
nav#SearchUI > ul > li > a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(-8px) rotate(135deg);
}
@media only screen and (min-width: 769px) {
  #pageContents > nav > ul > li > a:hover::before,
  #pageContents > nav > ul > li > a:hover::after,
  nav#SearchUI > ul > li > a:hover::before,
  nav#SearchUI > ul > li > a:hover::after {
    right: 5px;
  }
}

#pageContents > aside,
.about__contents > aside {
  padding: 3rem 0;
  margin: 60px calc((100vw - 100%) / 2);
  max-width: none;
  background: rgba(127, 96, 0, 0.16);
}
#pageContents > aside > div,
.about__contents > aside > div {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 24px;
  grid-template-rows: auto;
  row-gap: 24px;
}

@media only screen and (max-width: 768px) {
  #pageContents > aside,
  .about__contents > aside {
    padding: 1.5rem;
    margin: 20px -20px 20px -20px;
  }
  #pageContents > aside > div,
  .about__contents > aside > div {
    max-width: 480px;
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 16px;
    padding: 0;
  }
}

#pageContents > aside > header,
.about__contents > aside > header {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}
#pageContents > aside article,
.about__contents > aside article {
  position: relative;
  width: 100%;
  border: 1px solid #7f6000;
  padding: 1rem;
  background: rgba(255, 255, 255, 1);
  display: grid;
  grid-template-areas:
    "thumbnail title"
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: auto 1fr;
  column-gap: 0.75rem;
  grid-template-rows: auto 1fr auto;
  row-gap: 0.75rem;
}
#pageContents > aside article > [itemprop="title"],
.about__contents > aside article > [itemprop="title"] {
  grid-area: title;
  color: #7f6000;
  font-size: 1rem;
  line-height: 1.4;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
}
#pageContents > aside article > [itemprop="description"],
.about__contents > aside article > [itemprop="description"] {
  grid-area: description;
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
}
#pageContents > aside article > [itemprop="more"],
.about__contents > aside article > [itemprop="more"] {
  grid-area: more;
}
#pageContents > aside article > [itemprop="thumbnail"],
.about__contents > aside article > [itemprop="thumbnail"] {
  grid-area: thumbnail;
  width: 128px;
}
@media only screen and (max-width: 768px) {
  #pageContents > aside article > [itemprop="thumbnail"],
  .about__contents > aside article > [itemprop="thumbnail"] {
    width: 96px;
  }
}

#pageContents > .lead {
  max-width: calc(790px + 2 * 60px);
  width: 100%;
  padding-left: 60px;
  padding-right: 60px;
  margin: 0 auto 80px auto;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 2;
}
@media only screen and (max-width: 768px) {
  #pageContents > .lead {
    padding-left: 0;
    padding-right: 0;
    margin: 0 auto 60px auto;
    font-size: 0.8rem;
  }
}

#pageContents .c-sliderArticle-slider {
  padding-bottom: 60px;
}
#pageContents .c-sliderArticle-slider__prev,
#pageContents .c-sliderArticle-slider__next {
  bottom: 0;
}
@media only screen and (max-width: 768px) {
  #pageContents .c-sliderArticle-slider {
    padding-bottom: 0;
  }
}
@media only screen and (max-width: 768px) {
  #pageContents .c-sliderArticle-detail-title {
    font-size: 0.8rem;
    margin-bottom: 8px;
    margin-left: 0;
  }

  #pageContents .c-sliderArticle-detail-catch {
    font-size: 1.125rem;
    padding-left: 10px;
    padding-right: 0;
  }

  #pageContents .c-sliderArticle-detail-add {
    padding-left: 10px;
    padding-right: 0;
  }

  #pageContents .swiper-container.maxWidth {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 40px);
  }
}

#pageContents [data-module="personList"],
#pageContents [data-module="modelcourseList"] {
  padding: 0 20px;
}
#pageContents [data-module="personList"] > article,
#pageContents [data-module="modelcourseList"] > article {
}
#pageContents [data-module="personList"] > article + article,
#pageContents [data-module="modelcourseList"] > article + article {
  margin: 80px 0 0 0;
}
@media only screen and (max-width: 640px) {
  #pageContents [data-module="personList"],
  #pageContents [data-module="modelcourseList"] {
    padding: 0;
  }

  #pageContents [data-module="personList"] > article + article,
  #pageContents [data-module="modelcourseList"] > article + article {
    margin: 60px 0 0 0;
  }
}

#pageContents [data-module] > article.listItem {
  max-width: 1080px;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-areas:
    "thumbnail title"
    "thumbnail category"
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: 45% 1fr;
  column-gap: 32px;
  grid-template-rows: auto auto 1fr auto;
  row-gap: 16px;
}
#pageContents [data-module] > article.listItem:nth-of-type(2n) {
  grid-template-areas:
    "title thumbnail"
    "category thumbnail"
    "description thumbnail"
    "more thumbnail";
  grid-template-columns: 1fr 45%;
}
@media only screen and (max-width: 640px) {
  #pageContents [data-module] > article.listItem,
  #pageContents [data-module] > article.listItem:nth-of-type(2n) {
    grid-template-areas:
      "thumbnail"
      "title"
      "category"
      "description"
      "more";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(5, auto);
    row-gap: 8px;
  }
}

#pageContents [data-module="recommendList"] > article.listItem {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-areas:
    "thumbnail title"
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: 40% 1fr;
  column-gap: 32px;
  grid-template-rows: auto 1fr auto;
  row-gap: 16px;
}
#pageContents [data-module="recommendList"] > article.listItem:nth-of-type(2n) {
  grid-template-areas:
    "title thumbnail"
    "description thumbnail"
    "more thumbnail";
  grid-template-columns: 1fr 40%;
}
@media only screen and (max-width: 640px) {
  #pageContents [data-module="recommendList"] > article.listItem,
  #pageContents [data-module="recommendList"] > article.listItem:nth-of-type(2n) {
    grid-template-areas:
      "thumbnail"
      "title"
      "description"
      "more";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(5, auto);
    row-gap: 16px;
  }
}

#pageContents article.listItem > [itemprop="title"] {
  grid-area: title;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: bold;
}
#pageContents article.listItem > [itemprop="title"] > * {
  font-size: 1.125rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: bold;
}

#pageContents article.listItem > [itemprop="category"] {
  grid-area: category;
  color: #888888;
  font-size: 0.875rem;
  font-style: normal;
  text-align: right;
}
#pageContents article.listItem > [itemprop="description"] {
  grid-area: description;
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
}
#pageContents article.listItem > [itemprop="more"] {
  grid-area: more;
}
#pageContents article.listItem > [itemprop="more"] > li {
  margin: 8px 0 0 0;
}

#pageContents [data-module="recommendList"] article.listItem > [itemprop="more"] {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 10px;
  grid-template-rows: 1fr 1fr;
  row-gap: 10px;
}
#pageContents [data-module="recommendList"] article.listItem > [itemprop="more"] > li {
  margin: 0;
}
#pageContents [data-module="recommendList"] article.listItem > [itemprop="more"] a[role="button"] {
  margin: 0;
}

#pageContents article.listItem > [itemprop="thumbnail"] {
  grid-area: thumbnail;
  height: 100%;
}
#pageContents article.listItem > [itemprop="thumbnail"] img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}
#pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 4px;
  grid-template-rows: auto;
  row-gap: 4px;
  height: 100%;
  width: 100%;
}
#pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] > ul > li:nth-of-type(1) {
  grid-column: 1 / span 3;
}
#pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] > ul > li > img {
  aspect-ratio: 4 / 3;
}
#pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] > ul > li:nth-of-type(1) > img {
  aspect-ratio: 16 / 9;
}

/*
  #pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"]{
    display: grid;
	  grid-template-columns: repeat(3,1fr);
	  column-gap: 4px;
	  grid-template-rows: auto;
	  row-gap: 4px;
  }
    #pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] img{
      aspect-ratio: 4 / 3;
    }
    #pageContents [data-module="modelcourseList"] article.listItem > [itemprop="thumbnail"] img:nth-of-type(1){
      grid-column: 1 / span 3;
      aspect-ratio: 16 / 9;
    }
*/

#pageContents header.searchResult {
  margin: 80px auto 40px auto;
}
#pageContents header.searchResult > h2 {
  text-align: center;
  font-size: 0.875rem;
  line-height: 1;
  font-weight: 400;
}
#pageContents header.searchResult > h2 > b {
  display: inline-block;
  margin: 0 0.25em 0 0;
  font-size: 1.2rem;
  font-weight: 700;
  color: #7f6000;
}
#pageContents header.searchResult > h2 > i {
  font-size: 1em;
  font-weight: 500;
  font-style: normal;
  margin: 0 0.25em;
}

#pageContents footer.searchResult {
  margin: 80px auto 0 auto;
  text-align: center;
}
#pageContents footer.searchResult li {
  display: inline-block;
  margin: 0 0.5rem;
}
#pageContents footer.searchResult li a {
  display: inline-block;
  border: 1px solid rgba(127, 96, 0, 0.33);
  padding: 0.5rem;
  color: #7f6000;
  border-radius: 4px;
}
#pageContents footer.searchResult li a:hover {
  border: 1px solid rgba(127, 96, 0, 0.66);
}
#pageContents footer.searchResult li a[aria-current="page"] {
  border: 1px solid rgba(127, 96, 0, 1);
}
@media only screen and (max-width: 768px) {
  #pageContents footer.searchResult {
    margin: 40px auto 0 auto;
  }
  #pageContents footer.searchResult li {
    margin: 0 0.25rem;
  }
}

#pageContents [data-module="searchList"] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 1rem;
  row-gap: 2rem;
  max-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}
@media only screen and (max-width: 960px) {
  #pageContents [data-module="searchList"] {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="searchList"] {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 480px) {
  #pageContents [data-module="searchList"] {
    grid-template-columns: repeat(1, 1fr);
  }
}

#pageContents article.searchItem {
  display: grid;
  grid-template-areas:
    "thumbnail"
    "category"
    "title";
  grid-template-columns: 1fr;
  column-gap: 0;
  grid-template-rows: auto auto auto 1fr auto;
  row-gap: 0;
  background: white;
  padding: 0 0 1rem 0;
  box-shadow: 4px 4px 12px rgba(7, 23, 78, 0.08);
}

/*
  #pageContents article.searchItem > [itemprop="description"]{
    grid-area: description;
    font-size: .75rem;
    line-height: 1.6;
    letter-spacing: 0.05em;
    font-weight: 400;
    margin: 0.5rem 1rem 0 1rem;
  }
*/

#pageContents article.searchItem > [itemprop="thumbnail"] {
  grid-area: thumbnail;
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 4 / 3;
}
#pageContents article.searchItem > [itemprop="thumbnail"] > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  transition: all 0.3s;
}
#pageContents a:hover article.searchItem > [itemprop="thumbnail"] > img {
  transform: scale(1.1);
}

#pageContents article.searchItem > [itemprop="title"] {
  grid-area: title;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 1rem 1rem 0 1rem;
}
#pageContents article.searchItem > [itemprop="icon"] {
  grid-area: category;
  padding: 0 1rem;
  margin: 8px 0 0 0;
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.5rem;
  grid-template-rows: 1fr;
  row-gap: 0;
}
#pageContents [data-module="icon"] {
  padding: 0;
  margin: 8px 0 0 0;
  display: grid;
  grid-template-columns: auto auto 1fr;
  column-gap: 0.5rem;
  grid-template-rows: 1fr;
  row-gap: 0;
}
#pageContents [data-module="icon"] > time {
  display: block;
  font-size: 0.875rem;
  line-height: 1;
  font-weight: 400;
  padding: 0;
  text-align: right;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="icon"] {
    grid-template-areas:
      "area category"
      "time time";
    grid-template-columns: auto 1fr;
    column-gap: 0.5rem;
    grid-template-rows: repeat(2, auto);
    row-gap: 0.5rem;
  }
  #pageContents [data-module="icon"] > [itemprop="area"] {
    grid-area: area;
  }
  #pageContents [data-module="icon"] > [itemprop="category"] {
    grid-area: category;
    text-align: left;
  }
  #pageContents [data-module="icon"] > time {
    grid-area: time;
    font-size: 0.75rem;
  }
}

#pageContents [itemprop="area"] {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #999;
  color: white;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1;
  font-style: normal;
  padding: 4px 8px;
  border-radius: 3px;
}
#pageContents [itemprop="area"].settsu {
  background: #f386a1;
}
#pageContents [itemprop="area"].kobe {
  background: #f386a1;
}
#pageContents [itemprop="area"].hanshin {
  background: #f386a1;
}
#pageContents [itemprop="area"].harima {
  background: #9a8cc0;
}
#pageContents [itemprop="area"].tajima {
  background: #f9a542;
}
#pageContents [itemprop="area"].tamba {
  background: #73c490;
}
#pageContents [itemprop="area"].awaji {
  background: #5aaee0;
}
#pageContents [itemprop="category"] {
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1;
  font-style: normal;
  padding: 4px 0;
  text-align: right;
}

/*
  #pageContents > section,
  #pageContents > article{
    padding: 0 20px;
  }
  #pageContents > section + section,
  #pageContents > article + article{
    padding: 0 20px;
    margin: 80px 0 0 0;
  }
*/

[data-module="workshopList"] {
  margin: 72px auto;
}
@media only screen and (max-width: 768px) {
  [data-module="workshopList"] {
    margin: 36px auto;
  }
}

#pageContents > [data-module="personSection"] {
  margin: 80px auto;
}
#pageContents > [data-module="personSection"] > header {
  position: relative;
  margin: 0 0 64px 0;
  background-repeat: none;
  background-position: center;
  background-size: cover;
  min-height: 110px;
  padding: 2rem 1rem;
}
#pageContents > [data-module="personSection"] > header::before {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  content: "";
  background: rgba(0, 0, 0, 0.1);
}

#pageContents > [data-module="personSection"] > header > h2 {
  position: relative;
  z-index: 5;
}
#pageContents > [data-module="personSection"] > header > h2 > i {
  display: block;
  text-align: center;
  font-size: 2.4rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.4;
  font-weight: 400;
  color: white;
  letter-spacing: 0.04em;
  font-style: normal;
  white-space: nowrap;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.16), -1px 1px 2px rgba(0, 0, 0, 0.16), 1px -1px 2px rgba(0, 0, 0, 0.16), -1px -1px 2px rgba(0, 0, 0, 0.16), 1px 1px 16px rgba(0, 0, 0, 0.16), -1px 1px 16px rgba(0, 0, 0, 0.16), 1px -1px 16px rgba(0, 0, 0, 0.16), -1px -1px 16px rgba(0, 0, 0, 0.16);
}
#pageContents > [data-module="personSection"] > header > h2 > b {
  display: block;
  margin: 0.5rem 0 0 0;
  text-align: center;
  font-size: 1.25rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 600;
  color: white;
  white-space: nowrap;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.16), -1px 1px 2px rgba(0, 0, 0, 0.16), 1px -1px 2px rgba(0, 0, 0, 0.16), -1px -1px 2px rgba(0, 0, 0, 0.16), 1px 1px 16px rgba(0, 0, 0, 0.16), -1px 1px 16px rgba(0, 0, 0, 0.16), 1px -1px 16px rgba(0, 0, 0, 0.16), -1px -1px 16px rgba(0, 0, 0, 0.16);
}

@media only screen and (max-width: 768px) {
  #pageContents > [data-module="personSection"] {
    margin: 60px auto;
  }
  #pageContents > [data-module="personSection"] > header {
    margin: 0 -20px 32px -20px;
  }
  #pageContents > [data-module="personSection"] > header > h2 > i {
    font-size: 2rem;
  }
}

#pageContents > [data-module="videoList"] {
}
#pageContents > [data-module="videoList"] > section {
  margin: 72px auto;
}
#pageContents > [data-module="videoList"] > section > header {
  border-bottom: 1px solid #7f6000;
  margin: 0 50px 16px 50px;
  padding: 0 0 13px 0;
}
#pageContents > [data-module="videoList"] > section > header > h2 {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  #pageContents > [data-module="videoList"] > section {
    margin: 36px auto;
  }
  #pageContents > [data-module="videoList"] > section > header {
    border-bottom: 1px solid #7f6000;
    margin: 0 0 8px 0;
    padding: 0 0 7px 0;
  }
  #pageContents > [data-module="videoList"] > section > header > h2 {
    font-size: 1rem;
  }
}

#pageContents > [data-module="videoList"] > section > figure {
  display: grid;
  grid-template-areas:
    "thumbnail description"
    "thumbnail crip";
  grid-template-columns: 5fr 4fr;
  column-gap: 32px;
  grid-template-rows: 1fr auto;
  row-gap: 32px;
  margin: 32px 0 0 0;
}
#pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure {
  grid-template-areas:
    "description thumbnail"
    "crip thumbnail";
  grid-template-columns: 4fr 5fr;
}
@media only screen and (max-width: 768px) {
  #pageContents > [data-module="videoList"] > section > figure,
  #pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure {
    grid-template-areas:
      "thumbnail"
      "description"
      "crip";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(3, auto);
    row-gap: 24px;
    margin: 8px 0 0 0;
  }
}

#pageContents > [data-module="videoList"] > section > figure > img {
  grid-area: thumbnail;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#pageContents > [data-module="videoList"] > section > figure > ul {
  grid-area: crip;
  padding: 0 50px 0 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 16px;
  grid-template-rows: auto;
  row-gap: 16px;
}
#pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure > ul {
  padding: 0 0 0 50px;
}
@media only screen and (max-width: 768px) {
  #pageContents > [data-module="videoList"] > section > figure > ul,
  #pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure > ul {
    padding: 0 20px;
  }
}
#pageContents > [data-module="videoList"] > section:nth-of-type(2n-1) > figure > ul > li:nth-of-type(2n) {
  /* margin: -16px 0 0 0; */
}
#pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure > ul > li:nth-of-type(2n-1) {
  /* margin: -16px 0 0 0; */
}

#pageContents > [data-module="videoList"] > section > figure > figcaption {
  grid-area: description;
  padding: 0 50px 8px 0;
  font-size: 0.875rem;
  line-height: 2;
  align-self: center;
}
#pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure > figcaption {
  padding: 0 0 8px 50px;
}
@media only screen and (max-width: 768px) {
  #pageContents > [data-module="videoList"] > section > figure > figcaption,
  #pageContents > [data-module="videoList"] > section:nth-of-type(2n) > figure > figcaption {
    padding: 0 20px 8px 20px;
  }
}

#pageContents > [data-module="videoList"] > section > menu {
  margin: 32px auto 0 auto;
}
#pageContents > [data-module="videoList"] > section > menu > li {
  padding: 0 50px;
  text-align: center;
}
#pageContents > [data-module="videoList"] > section > menu > li a {
}

#contentsList,
#terroirPerson,
#introDC {
  padding: 0 20px;
  margin: 80px auto;
  max-width: 960px;
}
#terroirPerson {
  max-width: none;
}

#contentsList header,
#terroirPerson header,
#introDC header {
}

/*
    #contentsList header h2,
    #terroirPerson header h2,
    #introDC header h2{
      font-size: 1.5rem;
      font-family: "Noto Serif JP", serif;
      line-height: 1.5;
      font-weight: 500;
      color: #7f6000;
      letter-spacing: 0.08em;
      padding-bottom: 13px;
      border-bottom: 1px solid #7f6000;
      margin-bottom: 16px;
    }
  */

#contentsList > header > h2,
#terroirPerson > header > h2,
#introDC > header > h2 {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 500;
  margin-bottom: 24px;
  padding: 0 12px;
  font-family: "Noto Serif JP", serif;
}

#contentsList > header > h2 > i,
#terroirPerson > header > h2 > i,
#introDC > header > h2 > i {
  order: 1;
  text-align: center;
  font-size: 1rem;
  color: #7f6000;
  line-height: 1.5;
  font-style: normal;
}
#contentsList > header > h2 > b,
#terroirPerson > header > h2 > b,
#introDC > header > h2 > b {
  order: 2;
  position: relative;
  font-size: 1.5rem;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
  white-space: nowrap;
}
#contentsList > header > h2 > b::before,
#terroirPerson > header > h2 > b::before,
#introDC > header > h2 > b::before {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  left: -12px;
  transform: rotate(-20deg);
}
#contentsList > header > h2 > b::after,
#terroirPerson > header > h2 > b::after,
#introDC > header > h2 > b::after {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  right: -12px;
  transform: rotate(20deg);
}

#terroirPerson .lead {
  margin: 20px auto 48px auto;
  max-width: 790px;
}
#terroirPerson .lead p {
  font-size: 1rem;
  line-height: 1.8;
  letter-spacing: 0.05em;
}
#terroirPerson .lead p + * {
  margin-top: 0.8em;
}

@media only screen and (max-width: 768px) {
  #contentsList,
  #terroirPerson,
  #introDC {
    margin: 60px auto;
  }

  /*
    #contentsList header h2,
    #terroirPerson header h2,
    #introDC header h2{
      font-size: 1rem;
      padding-bottom: 7px;
      margin-bottom: 8px;
    }
*/

  #contentsList > header > h2 > b,
  #terroirPerson > header > h2 > b,
  #introDC > header > h2 > b {
    line-height: 1.2 !important;
    font-size: 1.4rem;
  }
}

#introDC div {
  display: grid;
  grid-template-areas:
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: auto 1fr;
  column-gap: 32px;
  grid-template-rows: 1fr auto;
  row-gap: 16px;
  position: relative;
  width: 100%;
  max-width: 720px;
  margin: 40px auto 120px auto;
  border: 1px solid #7f6000;
  padding: 20px;
  background: rgba(255, 255, 255, 0.5);
}
#introDC [itemprop="thumbnail"] {
  grid-area: thumbnail;
  max-width: 300px;
  width: 100%;
  height: auto;
}
#introDC [itemprop="thumbnail"] img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}
#introDC [itemprop="description"] {
  grid-area: description;
  font-size: 0.875rem;
  line-height: 2;
}
#introDC [itemprop="more"] {
  grid-area: more;
}

@media only screen and (max-width: 640px) {
  #introDC div {
    display: grid;
    grid-template-areas:
      "thumbnail"
      "description"
      "more";
    grid-template-columns: ifr;
    column-gap: 0;
    grid-template-rows: repeat(3, auto);
    row-gap: 16px;
    margin: 20px auto;
  }
  #introDC [itemprop="thumbnail"] {
    max-width: none;
    width: 100%;
    height: auto;
  }
}
#introDC a[role="button"] {
  max-width: none;
  margin: 2rem 0 0 auto;
}

#contentsList div {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 32px;
  grid-template-rows: auto;
  row-gap: 0;
  position: relative;
  margin: 40px 0 0 0;
}
@media only screen and (max-width: 640px) {
  #contentsList div {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(2, auto);
    row-gap: 0;
    margin: 20px 0 0 0;
  }
}

#contentsList article.contentsItem {
  display: grid;
  grid-template-areas:
    "thumbnail"
    "description"
    "more";
  grid-template-columns: 1fr;
  column-gap: 0;
  grid-template-rows: auto 1fr auto;
  row-gap: 20px;
  border: 1px solid rgba(127, 96, 0, 1);
  padding: 0 0 20px 0;
  position: relative;
  margin: 40px 0;
}
@media only screen and (max-width: 640px) {
  #contentsList article.contentsItem {
    margin: 20px 0;
  }
}

#contentsList article.contentsItem > [itemprop="title"] {
  background-image: url(../img/common/contents_bg.png);
  background-position: center;
  background-repeat: repeat;
  position: absolute;
  top: 0;
  right: auto;
  left: 50%;
  transform: translatex(-50%) translateY(-50%);
  white-space: nowrap;
  color: #7f6000;
  font-size: 0.9rem;
  line-height: 1.2;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  white-space: nowrap;
}
#contentsList article.contentsItem > [itemprop="title"] > h3 {
  padding: 0 48px;
  position: relative;
  text-align: center;
}
#contentsList article.contentsItem > [itemprop="title"] > h3::before {
  left: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}
#contentsList article.contentsItem > [itemprop="title"] > h3::after {
  right: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}

#contentsList article.contentsItem > [itemprop="thumbnail"] {
  width: 100%;
  height: auto;
  margin: 40px 0 0 0;
}
#contentsList article.contentsItem > [itemprop="thumbnail"] img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}
#contentsList article.contentsItem > [itemprop="description"] {
  font-size: 0.875rem;
  height: auto;
  line-height: 2;
  padding: 0 20px;
}
#contentsList article.contentsItem > [itemprop="more"] {
  padding: 0 20px;
}
#contentsList article.contentsItem > [itemprop="more"] li {
  text-align: right;
}
#contentsList article.contentsItem > [itemprop="more"] a {
  max-width: none;
  width: auto;
  display: inline-block;
}

#pageContents > ul.articleList {
  margin: 40px auto;
  padding: 0 20px;
  max-width: 768px;
}
@media only screen and (max-width: 768px) {
  #pageContents > ul.articleList {
    margin: 0 auto;
  }
}
#pageContents > ul.articleList > li {
}
#pageContents > ul.articleList > li + li {
  border-top: 1px solid rgba(127, 96, 0, 0.2);
}
#pageContents > ul.articleList > li > a {
  font-size: 1rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 500;
  position: relative;
  display: block;
  padding: 1.5rem 2rem 1.5rem 0;
  transition: all 0.3s;
}
#pageContents > ul.articleList > li > a:hover {
  background: rgba(255, 255, 255, 0.66);
}
#pageContents > ul.articleList > li > a > time {
  font-size: 0.8rem;
  display: inline-block;
}
#pageContents > ul.articleList > li > a > time::before {
  content: "(";
}
#pageContents > ul.articleList > li > a > time::after {
  content: ")";
}

#pageContents > ul.articleList > li > a::before {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(0) rotate(135deg);
}
#pageContents > ul.articleList > li > a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid #7f6000;
  border-left: 1px solid #7f6000;
  transition: all 0.3s;
  transform: translateY(-50%) translateX(-8px) rotate(135deg);
}
@media only screen and (min-width: 769px) {
  #pageContents > ul.articleList > li > a:hover::before,
  #pageContents > ul.articleList > a:hover::after {
    right: 5px;
  }
}

#pageContents [data-module="contentsDC"] {
  padding: 0 50px;
  margin: 0 auto;
  max-width: 960px;
}
#pageContents [data-module="contentsDC"] > section {
  margin: 80px auto;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] {
    padding: 0;
  }
  #pageContents [data-module="contentsDC"] > section {
    margin: 60px auto;
  }
}
#pageContents [data-module="contentsDC"] > section > header > * {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 500;
  margin-bottom: 24px;
  padding: 0 12px;
  font-family: "Noto Serif JP", serif;
}
#pageContents [data-module="contentsDC"] > section > header > * > b {
  order: 2;
  position: relative;
  font-size: 1.5rem;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
}
#pageContents [data-module="contentsDC"] > section > header > * > b::before {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  left: -12px;
  transform: rotate(-20deg);
}
#pageContents [data-module="contentsDC"] > section > header > * > b::after {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  right: -12px;
  transform: rotate(20deg);
}
#pageContents [data-module="contentsDC"] > section > header > * > i {
  order: 1;
  text-align: center;
  font-size: 1rem;
  color: #7f6000;
  line-height: 1.5;
  font-style: normal;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] > section > header > * {
    margin-bottom: 20px;
  }
  #pageContents [data-module="contentsDC"] > section > header > * > b {
    font-size: 1.25rem;
  }
  #pageContents [data-module="contentsDC"] > section > header > * > b::before {
    bottom: 6px;
    height: 14px;
  }
  #pageContents [data-module="contentsDC"] > section > header > * > b::after {
    bottom: 6px;
    height: 14px;
  }
  #pageContents [data-module="contentsDC"] > section > header > * > i {
    margin-bottom: 8px;
    font-size: 0.875rem;
  }
}

#pageContents [data-module="contentsDC"] > section > section {
  max-width: 790px;
  margin: 60px auto;
}
#pageContents [data-module="contentsDC"] > section > section > header {
  padding-bottom: 13px;
  border-bottom: 1px solid #7f6000;
  margin-bottom: 16px;
}
#pageContents [data-module="contentsDC"] > section > section > header > * {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] > section > section {
    margin: 40px auto;
  }
  #pageContents [data-module="contentsDC"] > section > section > header {
    padding-bottom: 7px;
    margin-bottom: 8px;
  }
  #pageContents [data-module="contentsDC"] > section > section > header > * {
    font-size: 1rem;
  }
}

#pageContents [data-module="contentsDC"] > section p {
  font-size: 1rem;
  line-height: 1.5;
  letter-spacing: 0.05em;
}
#pageContents [data-module="contentsDC"] > section p + * {
  margin-top: 0.8em;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] > section p {
    font-size: 0.875rem;
  }
}
#pageContents [data-module="contentsDC"] > section figure {
  max-width: 640px;
  margin: 0 auto;
}

#pageContents [data-module="contentsDC"] #access {
  display: grid;
  grid-template-areas:
    "header header"
    "body body"
    "access1 access2"
    "more more";
  grid-template-columns: repeat(2, 1fr);
  column-gap: 3rem;
  grid-template-rows: auto auto 1fr auto;
  row-gap: 24px;
  position: relative;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] #access {
    display: grid;
    grid-template-areas:
      "header"
      "body"
      "access1"
      "access2"
      "more";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(5, auto);
    row-gap: 24px;
  }
}
#pageContents [data-module="contentsDC"] #access [data-area="header"] {
  grid-area: header;
}
#pageContents [data-module="contentsDC"] #access [data-area="body"] {
  grid-area: body;
}
#pageContents [data-module="contentsDC"] #access [data-area="access1"] {
  grid-area: access1;
  margin: 0;
}
#pageContents [data-module="contentsDC"] #access [data-area="access2"] {
  grid-area: access2;
  margin: 0;
}
#pageContents [data-module="contentsDC"] #access [data-area="more"] {
  grid-area: more;
}
#pageContents [data-module="contentsDC"] #access [data-area="more"] a {
  max-width: 160px;
}

#pageContents [data-module="contentsDC"] > section > section > dl {
  border-bottom: 1px solid #c3c0b6;
  font-family: "Noto Sans JP", "Lato", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  padding: 20px 0;
  display: grid;
  grid-template-columns: 170px 1fr;
  column-gap: 10px;
  grid-template-rows: 1fr;
  row-gap: 0;
}
#pageContents [data-module="contentsDC"] > section > section > dl > dt {
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  color: #7f6000;
  width: 170px;
  padding: 0px 20px;
  line-height: 1.5;
  white-space: nowrap;
  font-weight: 600;
}
#pageContents [data-module="contentsDC"] > section > section > dl > dd {
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  line-height: 1.5;
}
@media only screen and (max-width: 768px) {
  #pageContents [data-module="contentsDC"] > section > section > dl {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 0.25em;
    padding: 10px;
  }
  #pageContents [data-module="contentsDC"] > section > section > dl > dt {
    font-size: 0.8125rem;
    padding: 0;
    margin-bottom: 5px;
    width: 100%;
    white-space: normal;
  }
  #pageContents [data-module="contentsDC"] > section > section > dl > dd {
    width: 100%;
    font-size: 0.8125rem;
    padding: 0;
  }
}

section.requestLogo {
  margin: 80px auto;
  max-width: 960px;
  width: calc(100% - 40px);
}
@media only screen and (max-width: 768px) {
  section.requestLogo {
    margin: 60px auto;
    width: 100%;
  }

  .about__contents section.requestLogo {
    margin: 60px 20px;
    width: calc(100% - 40px);
  }
}

section.requestLogo > header > * {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 500;
  margin-bottom: 24px;
  padding: 0 12px;
  font-family: "Noto Serif JP", serif;
}
section.requestLogo > header > * > i {
  order: 1;
  text-align: center;
  font-size: 1rem;
  color: #7f6000;
  line-height: 1.5;
  font-style: normal;
}

section.requestLogo > header > * > b {
  order: 2;
  position: relative;
  font-size: 1.5rem;
  line-height: 1.5;
  text-align: center;
  font-weight: 500;
}
section.requestLogo > header > * > b::before {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  left: -12px;
  transform: rotate(-20deg);
}
section.requestLogo > header > * > b::after {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  right: -12px;
  transform: rotate(20deg);
}

section.requestLogo > header > * > b span {
  display: inline-block !important;
  font-size: 0.75em !important;
  color: #7f6000 !important;
  margin: 0 0.25em !important;
  font-weight: 400 !important;
  font-family: "Noto Sans JP", sans-serif !important;
}
@media only screen and (max-width: 768px) {
  section.requestLogo > header > * > b {
    line-height: 1.2 !important;
  }
  section.requestLogo > header > * > b span {
    display: block !important;
  }
}

/*
    section.requestLogo > header{
    
    }
    section.requestLogo > header h2{
      font-size: 1.5rem;
      font-family: "Noto Serif JP", serif;
      line-height: 1.5;
      font-weight: 500;
      color: #7f6000;
      letter-spacing: 0.08em;
      padding-bottom: 13px;
      border-bottom: 1px solid #7f6000;
      margin-bottom: 24px;
    }
@media only screen and (max-width: 768px) {
    section.requestLogo > header{
      font-size: 1rem;
      padding-bottom: 7px;
      margin-bottom: 8px;
    }
}
*/

section.requestLogo > [data-module="introduction"] {
  position: relative;
  border: 1px solid #7f6000;
  padding: 20px;
  background: rgba(255, 255, 255, 0.5);

  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 32px;
  grid-template-rows: 1fr;
  row-gap: 16px;
  place-items: center;
}
@media only screen and (max-width: 768px) {
  section.requestLogo > [data-module="introduction"] {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 16px;
  }
}

section.requestLogo figure {
  text-align: center;
}
section.requestLogo figure img {
  max-width: 400px;
  width: 100%;
}
section.requestLogo p {
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
}
section.requestLogo > [data-module="introduction"] > div menu {
  margin-top: 1rem;
}
section.requestLogo > [data-module="introduction"] > div menu a {
  max-width: 160px;
}

section.requestLogo > [data-module="introduction"] > section > menu {
  display: flex;
  flex-flow: wrap;
}
section.requestLogo > [data-module="introduction"] > section > menu li {
  flex: 0 0 50%;
  padding: 0.25rem;
}
@media only screen and (max-width: 768px) {
  section.requestLogo > [data-module="introduction"] > section > menu li {
    flex: 1 0 100%;
    padding: 0.25rem;
  }
}
section.requestLogo > [data-module="introduction"] > section > menu a {
  margin: 0 auto;
  max-width: none;
}

section.requestLogo > [data-module="introduction"] > div section {
  margin: 0 auto;
}
section.requestLogo > [data-module="introduction"] > div section + section {
  margin: 1rem auto 0 auto;
}
section.requestLogo > [data-module="introduction"] > div section > header {
  color: #7f6000;
  font-size: 0.8em;
  line-height: 1.4;
  font-weight: 500;
  margin: 0 0 0.5rem 0;
}

section.requestLogo > section {
}

section.requestLogo > section > * {
}
section.requestLogo > section > * + * {
  margin: 2rem 0 0 0;
}

section.requestLogo > section > menu {
  display: flex;
  flex-flow: wrap;
  justify-content: center;
}
section.requestLogo > section > menu li {
  flex: 1 50%;
  padding: 0 1rem;
}
@media only screen and (max-width: 768px) {
  section.requestLogo > section > menu li {
    flex: 1 1 100%;
    padding: 0.25rem;
  }
}
section.requestLogo > section > menu a {
  margin: 0 auto;
  max-width: none;
  font-size: 0.8em;
  display: flex;
  height: 100%;
  align-items: center;
  line-height: 1.2;
  font-size: 1em;
  padding: 1rem;
}

section.requestLogo > section > section {
  margin: 1.6rem auto 0 auto;
}
section.requestLogo > section > section > header {
  color: #7f6000;
  font-size: 0.9rem;
  line-height: 1.4;
  font-weight: 500;
  margin: 0 0 0.5rem 0;
}

section.requestLogo > section > section > menu {
  display: flex;
  flex-flow: wrap;
  justify-content: center;
}
section.requestLogo > section > section > menu li {
  flex: 1 1 25%;
  padding: 0.25rem;
}
@media only screen and (max-width: 768px) {
  section.requestLogo > section > section > menu li {
    flex: 1 1 50%;
    padding: 0.25rem;
  }
}
section.requestLogo > section > section > menu a {
  margin: 0 auto;
  max-width: none;
  font-size: 0.8em;
  display: flex;
  height: 100%;
  align-items: center;
  line-height: 1.2;
  padding: 0.5rem;
  justify-content: center;
  min-height: 48px;
}
section.requestLogo > section > section > menu li.form {
  width: 50%;
  flex: 0 0 50%;
}
section.requestLogo > section > section > menu li.form a {
  font-size: 1em;
  padding: 1rem;
}

[data-module="listWorkshop"] {
}
[data-module="listWorkshop"] > article {
  position: relative;
  width: 100%;
  max-width: 720px;
  margin: 20px auto;
  border: 1px solid #7f6000;
  padding: 20px;
  background: rgba(255, 255, 255, 0.5);

  display: grid;
  grid-template-areas:
    "thumbnail title"
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: auto 1fr;
  column-gap: 32px;
  grid-template-rows: auto 1fr auto;
  row-gap: 16px;
}
@media only screen and (max-width: 560px) {
  [data-module="listWorkshop"] > article {
    grid-template-areas:
      "title"
      "thumbnail"
      "description"
      "more";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 16px;
  }
}

[data-module="listWorkshop"] > article [itemprop="title"] {
  grid-area: title;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
}
[data-module="listWorkshop"] > article [itemprop="thumbnail"] {
  grid-area: thumbnail;
  text-align: center;
}
[data-module="listWorkshop"] > article [itemprop="thumbnail"] img {
  max-width: 160px;
}
[data-module="listWorkshop"] > article [itemprop="description"] {
  grid-area: description;
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
}
[data-module="listWorkshop"] > article [itemprop="more"] {
  grid-area: more;
  display: flex;
  flex-flow: wrap;
}
[data-module="listWorkshop"] > article [itemprop="more"] li {
  flex: 1 0 100%;
  padding: 0.25rem;
}

[data-module="listWorkshop"] > article [itemprop="more"] a {
  margin: 0 auto;
  max-width: none;
}

#pageContents .listBanner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 24px;
  grid-template-rows: 1fr;
  row-gap: 16px;
  position: relative;
  margin: 40px 0 0 0;
}
@media only screen and (max-width: 768px) {
  #pageContents .listBanner {
    grid-template-columns: repeat(4, 1fr);
    column-gap: 16px;
    grid-template-rows: 1fr;
    row-gap: 16px;
    margin: 20px 0 0 0;
  }
}
#pageContents .listBanner li {
  width: 100%;
  height: 100%;
  background: white;
  max-height: 128px;
}
#pageContents .listBanner li > * {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
#pageContents .listBanner li img {
  max-width: 100%;
  max-height: 100%;
}

#pageContents.modelcourse {
}

#pageContents.modelcourse > header {
  padding: 0;
  display: grid;
  grid-template-columns: 4fr 3fr;
  column-gap: 0;
  grid-template-rows: auto 1fr auto;
  row-gap: 0;
  grid-template-areas:
    "title photo"
    "text photo"
    "map photo";
}
#pageContents.modelcourse > header > h1 {
  grid-area: title;
  padding: 20px 0 0 50px;
}
#pageContents.modelcourse > header > h1 > b {
  padding: 0 32px 0 20px;
}
#pageContents.modelcourse > header > h1 > i {
}
#pageContents.modelcourse > header > p {
  grid-area: text;
  padding: 20px 32px 0 70px;
  margin: 0;
}
#pageContents.modelcourse > header > nav {
  grid-area: map;
  margin: 40px 32px 0 70px;

  position: relative;
  border: 1px solid #7f6000;
  padding: 20px;
  background: rgba(255, 255, 255, 0.5);
  display: grid;
  grid-template-areas:
    "title map"
    "index map";
  grid-template-columns: 3fr 2fr;
  column-gap: 16px;
  grid-template-rows: auto 1fr;
  row-gap: 16px;
}
#pageContents.modelcourse > header > nav > h2 {
  grid-area: title;
  text-align: center;
  color: #7f6000;
  font-weight: 500;
  font-family: "Noto Serif JP", serif;
  font-size: 1.25rem;
  line-height: 1.5;
}
#pageContents.modelcourse > header > nav > ol {
  grid-area: index;
}
#pageContents.modelcourse > header > nav > ol > li {
}
#pageContents.modelcourse > header > nav > ol > li + li {
  margin: 1rem 0 0 0;
}
#pageContents.modelcourse > header > nav > ol > li > a {
  position: relative;
  padding-left: 15px;
  font-size: 0.8rem;
  line-height: 1.25;
  letter-spacing: 0.1em;
  font-weight: 400;
  display: block;
}
#pageContents.modelcourse > header > nav > ol > li > a:hover {
  text-decoration: underline;
}
#pageContents.modelcourse > header > nav > ol > li > a::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 0 5px 8px;
  border-color: transparent transparent transparent #7f6000;
}

#pageContents.modelcourse > header > nav > div {
  grid-area: map;
  background: #bddaee;
  min-height: 160px;
}

#pageContents.modelcourse > header > figure {
  grid-area: photo;
}
#pageContents.modelcourse > header > figure > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media only screen and (max-width: 1024px) {
  #pageContents.modelcourse > header {
    grid-template-columns: 3fr 2fr;
  }
  #pageContents.modelcourse > header > h1 {
    padding: 20px 0 0 20px;
  }
  #pageContents.modelcourse > header > p {
    padding: 20px 32px 0 40px;
  }
  #pageContents.modelcourse > header > nav {
    margin: 40px 32px 0 40px;
  }
}
@media only screen and (max-width: 768px) {
  #pageContents.modelcourse > header {
    padding: 0;
    margin: 0 -20px;
    width: auto;
  }
  #pageContents.modelcourse > header > h1 {
  }
  #pageContents.modelcourse > header > h1 > b {
    padding: 0 16px 0 0;
  }
  #pageContents.modelcourse > header > h1 > i {
    padding-left: 0 16px 0 0;
  }
  #pageContents.modelcourse > header > p {
    padding: 20px 16px 0 20px;
  }
  #pageContents.modelcourse > header > nav {
    margin: 30px 16px 0 20px;
  }
}
@media only screen and (max-width: 680px) {
  #pageContents.modelcourse > header {
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(4, auto);
    row-gap: 24px;
    grid-template-areas:
      "title"
      "photo"
      "text"
      "map";
  }
  #pageContents.modelcourse > header > h1 {
    padding: 0 20px;
  }
  #pageContents.modelcourse > header > h1 > * {
    padding: 0;
  }
  #pageContents.modelcourse > header > p {
    padding: 0 20px;
  }
  #pageContents.modelcourse > header > nav {
    margin: 0 20px;
  }
}
@media only screen and (max-width: 480px) {
  #pageContents.modelcourse > header > nav {
    grid-template-areas:
      "title"
      "index"
      "map";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(3, auto);
    row-gap: 16px;
  }
}

#pageContents.modelcourse > section {
  max-width: 1200px;
  padding: 0 32px;
  margin: 80px auto;
}
@media only screen and (max-width: 768px) {
  #pageContents.modelcourse > section {
    padding: 0;
    margin: 60px auto;
  }
}

#pageContents.modelcourse > section.spotDetail {
}
#pageContents.modelcourse > section.spotDetail > header {
}
#pageContents.modelcourse > section.spotDetail > header > h2 {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-weight: 500;
  margin-bottom: 24px;
  padding: 0 12px;
  font-family: "Noto Serif JP", serif;
}
#pageContents.modelcourse > section.spotDetail > header > h2 > b {
  order: 2;
  position: relative;
  font-size: 1.5rem;
  line-height: 1.4;
  text-align: center;
  font-weight: 500;
  white-space: nowrap;
}
#pageContents.modelcourse > section.spotDetail > header > h2 > b::before {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  left: -12px;
  transform: rotate(-20deg);
}
#pageContents.modelcourse > section.spotDetail > header > h2 > b::after {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  right: -12px;
  transform: rotate(20deg);
}

#pageContents.modelcourse > section.spotDetail > header > h2 > i {
  order: 1;
  text-align: center;
  font-size: 1rem;
  color: #7f6000;
  line-height: 1.5;
  font-style: normal;
}

#pageContents.modelcourse > section.spotDetail > section {
  margin: 60px auto;
  display: grid;
  grid-template-columns: 4fr 3fr;
  column-gap: 32px;
  grid-template-rows: repeat(2, auto);
  row-gap: 16px;
  grid-template-areas:
    "photo header"
    "photo text"
    "more text";
}
#pageContents.modelcourse > section.spotDetail > section + section {
  margin: 100px auto 60px auto;
}

#pageContents.modelcourse > section.spotDetail > section:nth-of-type(2n) {
  grid-template-columns: 3fr 4fr;
  grid-template-areas:
    "header photo"
    "text photo"
    "text more";
}
#pageContents.modelcourse > section.spotDetail > section > header {
  grid-area: header;
}
#pageContents.modelcourse > section.spotDetail > section > header > h3 {
  margin: 0 0 0.25em 0;
}
#pageContents.modelcourse > section.spotDetail > section > header > h3 > b {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 600;
  color: #7f6000;
  letter-spacing: 0.08em;
}
#pageContents.modelcourse > section.spotDetail > section > header > h3 > i {
  position: relative;
  z-index: 2;
  display: inline-block;
  height: 2.2rem;
  width: 1.5rem;
  padding: 0.125rem 0 0 0;
  font-size: 1.1rem;
  font-style: normal;
  font-weight: 600;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1;
  vertical-align: bottom;
  text-align: center;
  color: white !important;
  margin: 0 0.25rem 0 0;
}
#pageContents.modelcourse > section.spotDetail > section > header > h3 > i::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: #7f6000;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 100%;
}
#pageContents.modelcourse > section.spotDetail > section > header > h3 > i::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 1px;
  z-index: -1;
  border: solid transparent;
  border-top-color: #7f6000;
  border-width: 18px 11px 0 11px;
}

#pageContents.modelcourse > section.spotDetail > section:nth-of-type(2n) > menu {
  margin: 0 auto 0 0;
}

#pageContents.modelcourse > section.spotDetail > section > header > p {
  font-size: 1.125rem;
  line-height: 1.5;
  font-weight: 600;
  letter-spacing: 0.05em;
}
#pageContents.modelcourse > section.spotDetail > section > div {
  grid-area: text;
}
#pageContents.modelcourse > section.spotDetail > section > div > p {
  font-size: 0.9rem;
  line-height: 1.8;
}
#pageContents.modelcourse > section.spotDetail > section > div > p + p {
  margin: 0.8em 0 0 0;
}

#pageContents.modelcourse > section.spotDetail > section > figure {
  grid-area: photo;
}
#pageContents.modelcourse > section.spotDetail > section > figure > ul {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  column-gap: 16px;
  grid-template-rows: repeat(2, 1fr);
  row-gap: 16px;
  grid-template-areas:
    "main . ."
    "main . .";
}
#pageContents.modelcourse > section.spotDetail > section > figure > ul > li {
}
#pageContents.modelcourse > section.spotDetail > section > figure > ul > li:nth-of-type(1) {
  grid-area: main;
}
#pageContents.modelcourse > section.spotDetail > section > figure > ul > li > img {
  display: block;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

@media only screen and (max-width: 768px) {
  #pageContents.modelcourse > section.spotDetail > header > h2 > b {
    font-size: 1.25rem;
  }
  #pageContents.modelcourse > section.spotDetail > header > h2 > i {
    margin-bottom: 8px;
    font-size: 0.875rem;
  }

  #pageContents.modelcourse > section.spotDetail > section,
  #pageContents.modelcourse > section.spotDetail > section:nth-of-type(2n) {
    margin: 32px auto 56px auto;
    display: grid;
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(3, auto);
    row-gap: 16px;
    grid-template-areas:
      "photo"
      "header"
      "text"
      "more";
  }
  #pageContents.modelcourse > section.spotDetail > section + section {
    margin: 56px auto 32px auto;
  }

  #pageContents.modelcourse > section.spotDetail > section > header > h3 > b {
    font-size: 1.1rem;
    letter-spacing: 0.05em;
  }
  #pageContents.modelcourse > section.spotDetail > section > header > h3 > i {
  }
  #pageContents.modelcourse > section.spotDetail > section > header > p {
    font-size: 1rem;
    line-height: 1.44;
  }

  #pageContents.modelcourse > section.spotDetail > section > figure {
    margin: 0 -20px 8px -20px;
  }

  #pageContents.modelcourse > section.spotDetail > section > figure > ul {
    column-gap: 8px;
    row-gap: 8px;
  }

  #pageContents.modelcourse > section.spotDetail > section > menu,
  #pageContents.modelcourse > section.spotDetail > section:nth-of-type(2n) > menu {
    margin: 0 0 0 auto;
  }
}

#pageContents.modelcourse section.spotOnsen {
}
#pageContents.modelcourse section.spotOnsen > header {
  padding-bottom: 13px;
  border-bottom: 1px solid #7f6000;
  margin-bottom: 2rem;
}
#pageContents.modelcourse section.spotOnsen > header > h2 {
}
#pageContents.modelcourse section.spotOnsen > header > h2 > b {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
#pageContents.modelcourse section.spotOnsen > header > h2 > i {
}

#pageContents.modelcourse section.spotOnsen > section {
  position: relative;
  width: 100%;
  margin: 20px auto;
  border: 1px solid #7f6000;
  padding: 20px;
  background: rgba(255, 255, 255, 0.5);
  display: grid;
  grid-template-areas:
    "thumbnail title"
    "thumbnail description"
    "thumbnail more";
  grid-template-columns: 2fr 3fr;
  column-gap: 32px;
  grid-template-rows: auto 1fr auto;
  row-gap: 16px;
}
#pageContents.modelcourse section.spotOnsen > section > header {
  grid-area: title;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
}
#pageContents.modelcourse section.spotOnsen > section > figure {
  grid-area: thumbnail;
}
#pageContents.modelcourse section.spotOnsen > section > p {
  grid-area: description;
  font-size: 0.875rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
}
#pageContents.modelcourse section.spotOnsen > section > menu {
  grid-area: more;
  display: flex;
  flex-flow: wrap;
}
#pageContents.modelcourse section.spotOnsen > section > menu > li {
  flex: 1 0 50%;
  padding: 0.25rem;
}
#pageContents.modelcourse section.spotOnsen > section > menu > li a {
  margin: 0 auto;
  max-width: none;
}

@media only screen and (max-width: 768px) {
  #pageContents.modelcourse section.spotOnsen > header {
    padding-bottom: 7px;
    margin-bottom: 8px;
  }
  #pageContents.modelcourse section.spotOnsen > header > h2 > b {
    font-size: 1.2rem;
  }

  #pageContents.modelcourse section.spotOnsen > section {
    padding: 12px;
    grid-template-areas:
      "thumbnail"
      "title"
      "description"
      "more";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(4, auto);
    row-gap: 8px;
  }
  #pageContents.modelcourse section.spotOnsen > section > menu > li {
    flex: 1 1 auto;
  }
  #pageContents.modelcourse section.spotOnsen > section > header {
    margin: 4px 0 0 0;
  }
  #pageContents.modelcourse section.spotOnsen > section > menu {
    margin: 4px 0 0 0;
  }
  #pageContents.modelcourse section.spotOnsen > section > p {
    font-size: 0.8rem;
  }
}

#pageContents.modelcourse > section.spotInfo {
}
#pageContents.modelcourse > section.spotInfo > header {
  padding-bottom: 13px;
  border-bottom: 1px solid #7f6000;
  margin-bottom: 2rem;
}
#pageContents.modelcourse > section.spotInfo > header > h2 {
}
#pageContents.modelcourse > section.spotInfo > header > h2 > b {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
#pageContents.modelcourse > section.spotInfo > header > h2 > i {
}
#pageContents.modelcourse > section.spotInfo > div {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 16px;
  grid-template-rows: 1fr;
  row-gap: 24px;
}

#pageContents.modelcourse > section.spotInfo section {
  display: grid;
  grid-template-areas:
    "title"
    "thumbnail"
    "description"
    "more";
  grid-template-columns: 1fr;
  column-gap: 0;
  grid-template-rows: auto auto 1fr auto;
  row-gap: 8px;
  background: white;
  padding: 1rem;
  box-shadow: 4px 4px 12px rgb(7 23 78 / 8%);
}
#pageContents.modelcourse > section.spotInfo section > header {
  grid-area: title;
}
#pageContents.modelcourse > section.spotInfo section > header > h3 {
}
#pageContents.modelcourse > section.spotInfo section > header > h3 > b {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
}
#pageContents.modelcourse > section.spotInfo section > header > h3 > i {
  position: relative;
  z-index: 2;
  display: inline-block;
  height: 2.2rem;
  width: 1.5rem;
  padding: 0.125rem 0 0 0;
  font-size: 1.1rem;
  font-style: normal;
  font-weight: 600;
  font-family: "Noto Sans JP", sans-serif;
  line-height: 1;
  vertical-align: bottom;
  text-align: center;
  color: white !important;
  margin: 0 0.125rem 0 0;
}
#pageContents.modelcourse > section.spotInfo section > header > h3 > i::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: #7f6000;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 100%;
}
#pageContents.modelcourse > section.spotInfo section > header > h3 > i::after {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: 1px;
  z-index: -1;
  border: solid transparent;
  border-top-color: #7f6000;
  border-width: 18px 11px 0 11px;
}

#pageContents.modelcourse > section.spotInfo section > figure {
  grid-area: thumbnail;
}
#pageContents.modelcourse > section.spotInfo section > dl {
  grid-area: description;
}
#pageContents.modelcourse > section.spotInfo section > dl > dt {
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  color: #7f6000;
  line-height: 1.5;
  font-weight: 600;
}
#pageContents.modelcourse > section.spotInfo section > dl > dd {
  font-size: 0.85rem;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 400;
  margin: 0 0 0.5rem 0;
}

#pageContents.modelcourse > section.spotInfo section > menu {
  grid-area: more;
  display: flex;
  flex-wrap: wrap;
}
#pageContents.modelcourse > section.spotInfo section > menu > li {
  flex: 1 0 25%;
  padding: 0.125rem;
}
#pageContents.modelcourse > section.spotInfo section > menu > li:nth-of-type(1) {
  flex: 1 0 100%;
}
#pageContents.modelcourse > section.spotInfo section > menu > li:nth-of-type(2) {
  flex: 1 0 50%;
}
#pageContents.modelcourse > section.spotInfo section > menu > li a {
  margin: 0 auto;
  max-width: none;
}
#pageContents.modelcourse > section.spotInfo section > menu > li a:not([href]) {
  color: #999;
  border: 1px solid #ccc;
  background: #eee;
}

@media only screen and (max-width: 768px) {
  #pageContents.modelcourse > section.spotInfo > header {
    padding-bottom: 7px;
    margin-bottom: 8px;
  }
  #pageContents.modelcourse > section.spotInfo > header > h2 > b {
    font-size: 1.2rem;
  }

  #pageContents.modelcourse > section.spotInfo > div {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 0.5rem;
    row-gap: 0.75rem;
  }
}

@media only screen and (max-width: 560px) {
  #pageContents.modelcourse > section.spotInfo > div {
    grid-template-columns: 1fr;
  }
}

section.message {
  position: relative;
  margin: 40px auto 80px auto;
  max-width: 960px;
  width: calc(100% - 40px);
  border: 1px solid #7f6000;
  padding: 40px 30px 30px;
  background: rgba(255, 255, 255, 0.5);

  display: grid;
  grid-template-areas: "description image";
  grid-template-columns: 2fr 1fr;
  column-gap: 24px;
  grid-template-rows: 1fr;
  row-gap: 0;
}
section.message > figure {
  grid-area: image;
}
section.message > figure > img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
section.message > div {
  grid-area: description;
}
section.message p {
  font-size: 1rem;
  line-height: 2;
  letter-spacing: 0.05em;
  font-weight: 400;
}
section.message menu {
  margin: 1rem 0 0 0;
}

@media only screen and (max-width: 1000px) {
  section.message {
    margin: 40px 20px 80px 20px;
  }
}
@media only screen and (max-width: 768px) {
  section.message {
    margin: 20px 20px 60px 20px;
    grid-template-areas:
      "image"
      "description";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 16px;
  }
  section.message > p {
    font-size: 1rem;
  }
}

section.message > header {
  background-image: url(../img/common/contents_bg.png);
  background-position: center;
  background-repeat: repeat;
  position: absolute;
  top: 0;
  right: auto;
  left: 50%;
  transform: translatex(-50%) translateY(-50%);
  white-space: nowrap;
  color: #7f6000;
  font-family: "Noto Serif JP", serif;
  font-weight: 500;
  font-size: 1rem;
}
section.message > header > h2 {
  padding: 0 48px;
  position: relative;
  font-size: 1.125rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  section.message > header > h2 {
    font-size: 1rem;
  }
}

section.message > header > h2::before {
  left: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}
section.message > header > h2::after {
  right: 24px;
  position: absolute;
  content: "";
  top: 50%;
  z-index: 100;
  height: 24px;
  width: 1px;
  background: #7f6000;
  transform: translateY(-50%) rotate(25deg);
}

.plusSideButton {
  display: block;
  width: 40px;
  position: fixed;
  z-index: 100;
}
@media only screen and (max-width: 480px) {
  .plusSideButton {
    width: 32px;
  }
}
.plusSideButton.bottom-left {
  left: 0;
  bottom: 40px;
}
.plusSideButton.top-right {
  right: 0;
  top: 144px;
}
@media only screen and (max-width: 1080px) {
  .plusSideButton.top-right {
    top: 112px;
  }
}

.plusSideButton > menu > li {
}
.plusSideButton > menu > li + li {
  margin: 0.5rem 0 0 0;
}

.plusSideButton a {
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  background: #bc3357;
  color: white;
  font-size: 0.9em;
  font-weight: 500;
  letter-spacing: 0.05em;
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  transition: all 0.3s;
  line-height: 1;
  min-height: 128px;
  padding: 0.5rem 0;
  position: relative;
  box-shadow: 0 0 0.25rem rgba(0, 0, 0, 0.33);
}
.plusSideButton a:hover {
  box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.33);
}

@media only screen and (max-width: 480px) {
  .plusSideButton a {
    font-size: 0.8em;
    min-height: 96px;
  }
}
.plusSideButton.bottom-left a {
  border-radius: 0 8px 8px 0;
  left: -4px;
}
.plusSideButton.bottom-left a:hover {
  left: 0;
}
.plusSideButton.top-right a {
  border-radius: 8px 0 0 8px;
  right: -4px;
}
.plusSideButton.top-right a:hover {
  right: 0;
}

.plusSideButton a.experience {
  background: seagreen;
}
.plusSideButton a.booking {
  background: darkorange;
}
.plusSideButton a i {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  margin: 0 0 0.25rem 0;
}
.plusSideButton a i img {
  width: 1.2rem;
}

[data-module="headlineNews"] {
  background: #7f6000;
  display: grid;
  grid-template-areas: "header link more";
  grid-template-columns: auto 1fr auto;
  column-gap: 1rem;
  grid-template-rows: 1fr;
  row-gap: 0rem;
  place-items: center start;
  padding: 0.75rem 50px;
}
@media only screen and (max-width: 768px) {
  [data-module="headlineNews"] {
    grid-template-areas:
      "header more"
      "link link";
    grid-template-columns: 1fr auto;
    column-gap: 1rem;
    grid-template-rows: auto 1fr;
    row-gap: 0.5rem;
    padding: 0.75rem 20px;
  }
}

[data-module="headlineNews"] > header {
  grid-area: header;
}
[data-module="headlineNews"] > header > h2 {
  font-size: 0.95rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1;
  font-weight: 600;
  color: white;
  letter-spacing: 0.08em;
}

[data-module="headlineNews"] > ul {
  grid-area: link;
  border-left: 1px solid rgba(255, 255, 255, 0.33);
  padding: 0 0 0 1rem;
}
[data-module="headlineNews"] > ul > li {
}
[data-module="headlineNews"] > ul > li > a {
  display: block;
  width: 100%;
  font-size: 0.9rem;
  line-height: 1.2;
  font-weight: 400;
  color: white;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  [data-module="headlineNews"] > ul {
    border-top: 1px solid rgba(255, 255, 255, 0.33);
    border-left: none;
    padding: 0.5rem 0 0 0;
    width: 100%;
  }
  [data-module="headlineNews"] > ul > li {
  }
  [data-module="headlineNews"] > ul > li > a {
    font-size: 0.95rem;
    line-height: 1.2;
    font-weight: 400;
    color: white;
    letter-spacing: 0.08em;
  }
}

[data-module="headlineNews"] > menu {
  grid-area: more;
  margin: 0;
  padding: 0;
}
[data-module="headlineNews"] > menu > li {
}
[data-module="headlineNews"] > menu > li > a {
  position: relative;
  font-size: 0.8rem;
  line-height: 1;
  font-weight: 400;
  color: white;
  letter-spacing: 0.08em;
  padding: 2rem;
}
[data-module="headlineNews"] > menu > li > a::before,
[data-module="headlineNews"] > menu > li > a::after {
  position: absolute;
  content: "";
  top: 50%;
  right: 10px;
  z-index: 10;
  height: 8px;
  width: 8px;
  height: 8px;
  border-top: 1px solid white;
  border-left: 1px solid white;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
[data-module="headlineNews"] > menu > li > a::before {
  transform: translateY(-50%) translateX(0) rotate(135deg);
}
[data-module="headlineNews"] > menu > li > a::after {
  transform: translateY(-50%) translateX(-8px) rotate(135deg);
}
[data-module="headlineNews"] > menu > li > a:hover::before,
[data-module="headlineNews"] > menu > li > a:hover::after {
  right: 5px;
}

[data-module="modalArticle"] {
  overflow: scroll;
  position: fixed;
  z-index: 5000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  width: 100vw;
  height: 100vh;
  margin: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
}
[data-module="modalArticle"][aria-hidden="true"] {
  display: none;
}
[data-item="modalArticle"][aria-modal="true"] {
  display: grid;
  place-items: center;
}

/*
  [data-module="modalArticle"]::before{
      content: '';
      display: block;
			position: fixed;
			z-index: 4999;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
	
			width: 100vw;
			height: 100vh;
			margin: 0;
			background: rgba(0,0,0,0.8);
      border: none;
      padding: 0;
  }
*/

[data-item="modalArticle"] > [data-command="close"] {
  -webkit-appearance: none;
  position: fixed;
  z-index: 5000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  width: 100vw;
  height: 100vh;
  margin: 0;
  background: rgba(0, 0, 0, 0.8);
  border: none;
  padding: 0;
}

[data-module="modalArticle"] > [data-module="modalContents"] {
  position: relative;
  z-index: 5001;
  background: white;
  box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.33);
  padding: 2em;
  margin: 8rem 1rem 2rem 1rem;
  max-height: calc(100vh - 10rem);
  max-width: 768px;
  overflow: scroll;
}
@media only screen and (max-width: 768px) {
  [data-item="modalArticle"] {
    height: auto;
  }
  [data-module="modalArticle"] > [data-module="modalContents"] {
    padding: 1em;
    margin: 5rem 1rem 1rem 1rem;
    max-height: calc(100vh - 6rem);
  }
}

[data-module="modalContents"] > header {
  text-align: center;
  display: flex;
  flex-direction: column;
  margin: 0 0 4rem 0;
}
[data-module="modalContents"] > header > h3 {
  order: 2;
}
[data-module="modalContents"] > header > h3 > b {
  display: inline-block;
  position: relative;
  width: auto;
  font-weight: 500;
  margin-bottom: 24px;
  padding: 0 12px;
  font-size: 1.5rem;
  line-height: 1.5;
  font-family: "Noto Serif JP", serif;
}
[data-module="modalContents"] > header > h3 > b::before {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  left: -12px;
  transform: rotate(-20deg);
}
[data-module="modalContents"] > header > h3 > b::after {
  position: absolute;
  content: "";
  bottom: 8px;
  height: 20px;
  width: 1px;
  background: #7f6000;
  z-index: 100;
  right: -12px;
  transform: rotate(20deg);
}

[data-module="modalContents"] > header > p {
  order: 3;
  text-align: left;
  font-weight: 600;
  line-height: 2;
}
[data-module="modalContents"] > header > figure {
  order: 1;
  margin: -2rem -2rem 4rem -2rem;
}
@media only screen and (max-width: 768px) {
  [data-module="modalContents"] > header > figure {
    margin: -1rem -1rem 4rem -1rem;
  }
}

[data-module="modalContents"] > header > menu {
  order: 4;
  text-align: right;
}
[data-module="modalContents"] > header > menu a {
  max-width: none;
  display: inline-block;
  text-align: left;
  width: auto;
  padding-right: 2.5rem;
}

[data-module="modalContents"] > section {
  width: 100%;
  margin: 4rem auto;
}
[data-module="modalContents"] > section > header {
  padding-bottom: 13px;
  border-bottom: 1px solid #7f6000;
  margin-bottom: 2rem;
  clear: both;
}
[data-module="modalContents"] > section > header > h4 {
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  [data-module="modalContents"] > section {
    margin: 2rem auto;
  }
  [data-module="modalContents"] > section > header {
    padding-bottom: 7px;
    margin-bottom: 1rem;
  }
  [data-module="modalContents"] > section > header > h4 {
    font-size: 1.25rem;
  }
}

[data-module="modalContents"] > section > div {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
[data-module="modalContents"] > section > div + div {
  margin: 2rem 0 0 0;
}
@media only screen and (max-width: 560px) {
  [data-module="modalContents"] > section > div {
    display: block;
  }
  [data-module="modalContents"] > section > div + div {
    margin: 1.5rem 0 0 0;
  }
}

[data-module="modalContents"] > section > div > * {
  flex: 1 1 50%;
}
[data-module="modalContents"] > section > div:nth-of-type(2n-1) > figure {
  order: 1;
  width: calc(50% - 1.5rem);
  margin: 0 1.5rem 0 0;
}
[data-module="modalContents"] > section > div:nth-of-type(2n-1) > *:not(figure) {
  order: 2;
}
[data-module="modalContents"] > section > div:nth-of-type(2n) > figure {
  order: 2;
  width: calc(50% - 1.5rem);
  margin: 0 0 0 1.5rem;
}
[data-module="modalContents"] > section > div:nth-of-type(2n) > *:not(figure) {
  order: 1;
}

[data-module="modalContents"] > section > div.bothFigure > figure {
  flex: 0 0 auto;
  width: calc(50% - 0.75rem);
  margin: 0;
}

@media only screen and (max-width: 560px) {
  [data-module="modalContents"] > section figure {
    width: 100% !important;
    margin: 0.8rem 0 !important;
  }
}

[data-module="modalContents"] > section p {
  width: 100%;
  margin: 0 auto;
  max-width: 790px;
  font-size: 1rem;
  line-height: 2;
  font-weight: 500;
  letter-spacing: 0.04em;
}
[data-module="modalContents"] > section p + p {
  margin: 20px auto 0 auto;
}
[data-module="modalContents"] > section p + figure {
  clear: both;
}
@media only screen and (max-width: 768px) {
  [data-module="modalContents"] > section p {
    font-size: 0.875rem;
  }
}

@media only screen and (max-width: 599px) {
  br.u-show--pc-sp {
    display: none;
  }

  .c-fixed-otaLink-header {
    padding: 10px 10px 0;
  }
}

[data-module="modalContents"] > section figure {
}
[data-module="modalContents"] > section figure > dl {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 100%;
  border: 1px solid #7f6000;
  padding: 1rem;
  background-image: url(../img/common/contents_bg.png);
  background-position: center;
  background-repeat: repeat;
}
[data-module="modalContents"] > section figure > dl > [itemprop="title"] {
  order: 2;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.4;
  margin: 0.5rem 0 0.25rem 0;
}
[data-module="modalContents"] > section figure > dl > [itemprop="description"] {
  order: 3;
  font-size: 0.8rem;
  line-height: 1.6;
  text-align: justify;
}
[data-module="modalContents"] > section figure > dl > [itemprop="image"] {
  order: 1;
}
[data-module="modalContents"] > section figure > dl > [itemprop="image"] img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}
[data-module="modalContents"] > section figure > dl > [itemprop="area"] {
}

[data-module="modalContents"] [itemprop="area"] {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #999;
  color: white;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1;
  font-style: normal;
  padding: 4px 8px;
  border-radius: 3px;
  position: absolute;
  top: 1.5rem;
  left: 1.5rem;
}
[data-module="modalContents"] [itemprop="area"].settsu {
  background: #f386a1;
}
[data-module="modalContents"] [itemprop="area"].kobe {
  background: #f386a1;
}
[data-module="modalContents"] [itemprop="area"].hanshin {
  background: #f386a1;
}
[data-module="modalContents"] [itemprop="area"].harima {
  background: #9a8cc0;
}
[data-module="modalContents"] [itemprop="area"].tajima {
  background: #f9a542;
}
[data-module="modalContents"] [itemprop="area"].tamba {
  background: #73c490;
}
[data-module="modalContents"] [itemprop="area"].awaji {
  background: #5aaee0;
}

/* modal-video.js */

[data-video-id] {
  cursor: pointer;
  transform: scale(1);
  transition: transform 0.3s, background 0.3s;
}
[data-video-id]:hover {
  transform: scale(1.01);
  transition: transform 0.2s, background 0.2s;
}
[data-video-id]:active {
  transform: scale(0.99);
  transition: transform 0.1s, background 0.1s;
}

#pageContents.experienceArticle > section dd a[href] {
  text-decoration: underline;
  position: relative;
}
#pageContents.experienceArticle > section dd a[href]::after {
  font-family: "icon-button" !important;
  content: "\ea7e";
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 0 0 0.5rem;
  font-size: 1em;
  text-decoration: none !important;
  position: absolute;
  right: -1.5em;
  bottom: 0;
}

#pageContents.experienceArticle > section dd a[href]:hover {
  color: rgb(127, 96, 0);
}
#pageContents.experienceArticle > section dd a[href]:active {
  color: rgb(127, 96, 0);
}

@charset "UTF-8";
/*** ★" ***/

#pageContents article.searchItem {
  display: grid;
  grid-template-areas:
    "thumbnail"
    "category"
    "title";
  grid-template-columns: 1fr;
  column-gap: 0;
  grid-template-rows: auto auto auto 1fr auto;
  row-gap: 0;
  background: white;
  padding: 0 0 1rem 0;
  box-shadow: 4px 4px 12px rgba(7, 23, 78, 0.08);
  height: 100%;
}

#pageContents [itemprop="category"] {
  font-size: 0.8rem;
  font-weight: 400;
  line-height: 1;
  font-style: normal;
  padding: 4px 0;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#pageContents ul.imageDownload {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: 16px;
  row-gap: 24px;
}
#pageContents ul.imageDownload > li {
  width: 100%;
  height: 100%;
}
#pageContents ul.imageDownload > li > img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

#pageContents ul.imageDownload + p {
  text-align: center;
  color: #7f6000;
  font-weight: bold;
  margin: 2rem 0 0 0;
}

.page-about section.message + section.message {
  grid-template-areas: "image description";
  grid-template-columns: 1fr 2fr;
}
@media only screen and (max-width: 768px) {
  .page-about section.message + section.message {
    grid-template-areas:
      "image"
      "description";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: auto;
    row-gap: 16px;
  }
}

.page-about #modalArticle_02 {
}

.page-about #modalArticle_02 b.kobe {
  color: #f386a1;
  font-weight: 600;
}
.page-about #modalArticle_02 b.harima {
  color: #9a8cc0;
  font-weight: 600;
}
.page-about #modalArticle_02 b.tajima {
  color: #f9a542;
  font-weight: 600;
}
.page-about #modalArticle_02 b.tamba {
  color: #73c490;
  font-weight: 600;
}
.page-about #modalArticle_02 b.awaji {
  color: #5aaee0;
  font-weight: 600;
}

.page-about #modalArticle_02 [data-module="modalContents"] {
}

.page-about #modalArticle_02 [data-module="modalContents"] > section {
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > ul {
  display: grid;
  grid-template-areas:
    "kobe tamba"
    "harima awaji";
  grid-template-columns: repeat(2, 1fr);
  column-gap: 16px;
  grid-template-rows: repeat(2, 1fr);
  row-gap: 16px;
  margin: 1em 0 0 0;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li {
  font-size: 1.1em;
  color: #7f6000;
  font-weight: 600;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li:nth-of-type(1) {
  grid-area: kobe;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li:nth-of-type(2) {
  grid-area: harima;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li:nth-of-type(3) {
  grid-area: tamba;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li:nth-of-type(4) {
  grid-area: awaji;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li > ul {
  margin: 0.75em 0 0 0;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li > ul > li {
  font-size: 1rem;
  color: black;
  font-weight: 400;
  margin: 0.5rem;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > ul > li > ul > li > a {
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section {
  display: grid;
  grid-template-areas:
    "header header"
    "figure description";
  grid-template-columns: 4fr 5fr;
  column-gap: 32px;
  grid-template-rows: auto 1fr;
  row-gap: 16px;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > section:nth-of-type(2n) {
  grid-template-areas:
    "header header"
    "description figure";
  grid-template-columns: 5fr 4fr;
}
@media only screen and (max-width: 640px) {
  .page-about #modalArticle_02 [data-module="modalContents"] > section > section,
  .page-about #modalArticle_02 [data-module="modalContents"] > section > section:nth-of-type(2n) {
    grid-template-areas:
      "header"
      "figure"
      "description";
    grid-template-columns: 1fr;
    column-gap: 0;
    grid-template-rows: repeat(3, auto);
    row-gap: 16px;
  }
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section + section {
  margin: 3rem 0 0 0;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section > header {
  grid-area: header;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > section > header > h5 {
  font-size: 1.25em;
  color: #7f6000;
  line-height: 1.4;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > section > header > h5 > small {
  font-weight: 400;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section > figure {
  grid-area: figure;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section > figure [itemprop="description"] dt {
  font-weight: 600;
  color: #7f6000;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section > figure i {
  display: inline-block;
  height: 0.9em;
  width: 0.9em;
  margin: 0 0.25em 0 0;
}
.page-about #modalArticle_02 [data-module="modalContents"] > section > section > figure i img {
  max-width: 100%;
  vertical-align: middle;
}

.page-about #modalArticle_02 [data-module="modalContents"] > section > section > p {
  grid-area: description;
}

.ly_main * {
  line-height: 1.6;
}
@media (max-width: 767px) {
  .ly_main * {
    font-size: 14px;
  }
}
.ly_main {
  padding: 145px 0 100px;
  background: url(/terroir/assets/img/norihoudai/bg_pattern_01.jpg);
}
@media (max-width: 767px) {
  .ly_main {
    padding: 80px 20px 60px;
  }
}

.ly_contents {
  position: relative;
  margin: auto;
  max-width: 1044px;
  background-color: #fff;
}
.ly_contents::before,
.ly_contents::after {
  content: "";
  position: absolute;
  top: 0;
  width: 9px;
  height: 100%;
  background-repeat: repeat-y;
  background-size: auto;
}
@media (max-width: 767px) {
  .ly_contents::before,
  .ly_contents::after {
    width: 5px;
    background-size: 5px 29px;
  }
}
.ly_contents::before {
  left: 0;
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_04.jpg);
}
.ly_contents::after {
  right: 0;
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_02.jpg);
}

.ly_contents__top,
.ly_contents__bottom {
  position: relative;
  height: 32px;
  width: 100%;
  background-color: #fff;
  background-repeat: repeat-x;
  z-index: 1;
}
@media (max-width: 767px) {
  .ly_contents__top,
  .ly_contents__bottom {
    height: 16px;
    background-size: 29px 5px;
  }
}
.ly_contents__top::before,
.ly_contents__top::after,
.ly_contents__bottom::before,
.ly_contents__bottom::after {
  content: "";
  position: absolute;
  width: 32px;
  height: 32px;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
}
@media (max-width: 767px) {
  .ly_contents__top::before,
  .ly_contents__top::after,
  .ly_contents__bottom::before,
  .ly_contents__bottom::after {
    width: 16px;
    height: 16px;
  }
}
.ly_contents__top::before,
.ly_contents__bottom::before {
  left: 0;
}
.ly_contents__top::after,
.ly_contents__bottom::after {
  right: 0;
}

.ly_contents__top {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_01.jpg);
  background-position: left top;
}
.ly_contents__top::before,
.ly_contents__top::after {
  top: 0;
}
.ly_contents__top::before {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_corner_01.jpg);
}
.ly_contents__top::after {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_corner_02.jpg);
}

.ly_contents__bottom {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_03.jpg);
  background-position: left bottom;
}
.ly_contents__bottom::before,
.ly_contents__bottom::after {
  bottom: 0;
}
.ly_contents__bottom::before {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_corner_03.jpg);
}
.ly_contents__bottom::after {
  background-image: url(/terroir/assets/img/norihoudai/bg_frame_corner_04.jpg);
}

.ly_contents__inner {
  padding: 42px 72px;
}
@media (max-width: 767px) {
  .ly_contents__inner {
    padding: 59px 0 24px;
  }
}

.ly_information {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 20px;
}
@media (max-width: 767px) {
  .ly_information {
    margin-top: 5px;
    padding: 0 20px;
  }
}
.ly_information a {
  color: #108f78;
  text-decoration: underline;
}
.ly_information a:hover {
  text-decoration: none;
}
.ly_information a[target="_blank"]:after {
  content: "";
  display: inline-block;
  margin: 0 0.5em;
  width: 13px;
  height: 12px;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(/terroir/assets/img/norihoudai/icon_blank.png);
}

.rwd-footer-navigation-logo__inner--noMenu {
  position: relative;
  display: block;
  padding: 40px 0;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: middle;
  text-align: center;
}
@media (max-width: 767px) {
  .rwd-footer-navigation-logo__inner--noMenu {
    padding: 15px 10px;
    text-align: left;
  }
}

.bl_MV {
  position: relative;
  z-index: 1;
}
@media (max-width: 767px) {
  .bl_MV::before {
    content: "";
    position: absolute;
    top: -51px;
    left: 16px;
    width: 47px;
    height: 51px;
    background-image: url(/terroir/assets/img/norihoudai/bg_illust_03.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
  }
}
.bl_MV .bl_MV_logo {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 1;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_logo {
    margin-bottom: 20px;
  }
}
.bl_MV .bl_MV_logo li {
  margin: 0 30px;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_logo li {
    margin: 0 14px;
  }
}
.bl_MV .bl_MV_logo li img {
  height: 60px;
  width: auto;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_logo li img {
    height: 30px;
  }
}
.bl_MV .bl_MV_logo::before,
.bl_MV .bl_MV_logo::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
}
.bl_MV .bl_MV_logo::before {
  top: 0;
  left: 37px;
  width: 144px;
  height: 62px;
  background-image: url(/terroir/assets/img/norihoudai/bg_illust_01.jpg);
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_logo::before {
    top: -55px;
    left: 50%;
    width: 93px;
    height: 40px;
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }
}
.bl_MV .bl_MV_logo::after {
  top: 10px;
  right: 65px;
  width: 100px;
  height: 60px;
  background-image: url(/terroir/assets/img/norihoudai/bg_illust_02.jpg);
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_logo::after {
    top: -40px;
    right: 20px;
    width: 50px;
    height: 30px;
  }
}
.bl_MV .bl_MV_ttl {
  position: relative;
  margin-bottom: 20px;
  text-align: center;
  z-index: 1;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_ttl {
    margin-bottom: 24px;
  }
}
.bl_MV .bl_MV_ttl .bl_MV_ttl__main {
  display: inline-block;
  width: 100%;
  max-width: 900px;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_ttl .bl_MV_ttl__main {
    width: calc(100% - 40px);
  }
}
.bl_MV .bl_MV_ttl .bl_MV_ttl__sub {
  display: inline-block;
  margin-top: 16px;
  width: 92%;
  max-width: 830px;
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_ttl .bl_MV_ttl__sub {
    margin-top: 10px;
    width: calc(100% - 36px);
  }
}
.bl_MV .bl_MV_ttl::before,
.bl_MV .bl_MV_ttl::after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: -1;
}
.bl_MV .bl_MV_ttl::before {
  left: -40px;
  bottom: -7px;
  width: 70px;
  height: 76px;
  background-image: url(/terroir/assets/img/norihoudai/bg_illust_03.jpg);
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_ttl::before {
    content: none;
  }
}
.bl_MV .bl_MV_ttl::after {
  right: -39px;
  bottom: -5px;
  width: 108px;
  height: 72px;
  background-image: url(/terroir/assets/img/norihoudai/bg_illust_04.jpg);
}
@media (max-width: 767px) {
  .bl_MV .bl_MV_ttl::after {
    right: 17px;
    bottom: -41px;
    width: 84px;
    height: 31.5px;
    background-image: url(/terroir/assets/img/norihoudai/bg_illust_05.jpg);
  }
}
.bl_MV .bl_items {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  z-index: 0;
}
@media (max-width: 767px) {
  .bl_MV .bl_items {
    padding: 0 20px;
    z-index: 1;
  }
}
.bl_MV .bl_items li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 46.66%;
  max-width: 420px;
}
@media (max-width: 767px) {
  .bl_MV .bl_items li {
    display: block;
    width: 49.152%;
    text-align: center;
  }
}
.bl_MV .bl_items li img {
  max-height: 220px;
}
@media (max-width: 767px) {
  .bl_MV .bl_items li img {
    max-height: 38.66vw;
  }
}
.bl_MV .bl_items .bl_items_photo {
  position: relative;
  z-index: 1;
}
.bl_MV .bl_items .bl_items_detail {
  margin-left: -20px;
}
@media (max-width: 767px) {
  .bl_MV .bl_items .bl_items_detail {
    margin: -20px 0 0;
  }
}
.bl_MV .bl_items::before {
  content: "";
  position: absolute;
  left: 189px;
  bottom: -48px;
  width: 128px;
  height: 48px;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(/terroir/assets/img/norihoudai/bg_illust_05.jpg);
  z-index: 0;
}
@media (max-width: 767px) {
  .bl_MV .bl_items::before {
    content: none;
  }
}
.bl_MV .bl_itemNotes {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 0.8em;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  font-size: 14px;
  line-height: 1.4;
  z-index: 2;
}
@media (max-width: 767px) {
  .bl_MV .bl_itemNotes {
    display: block;
    margin-top: -4px;
    padding: 0 20px;
    font-size: 11px;
  }
}
.bl_MV .bl_itemNotes li {
  width: 46.66%;
  max-width: 420px;
}
@media (max-width: 767px) {
  .bl_MV .bl_itemNotes li {
    margin-top: 6px;
    width: 100%;
    max-width: 100%;
  }
}

.bl_CV {
  position: relative;
  margin-top: 135px;
  text-align: center;
  background-color: #fff2cc;
  border-radius: 20px;
  font-size: 24px;
  line-height: 1.5;
  font-weight: bold;
}
@media (max-width: 767px) {
  .bl_CV {
    margin: 75px 10px 0;
    line-height: 1.2;
    font-size: 16px;
    border-radius: 10px;
  }
}
.bl_CV::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 16px;
  background-image: repeating-linear-gradient(0deg, #108f78, #108f78 10px, transparent 10px, transparent 20px, #108f78 20px), repeating-linear-gradient(90deg, #108f78, #108f78 10px, transparent 10px, transparent 20px, #108f78 20px), repeating-linear-gradient(180deg, #108f78, #108f78 10px, transparent 10px, transparent 20px, #108f78 20px), repeating-linear-gradient(270deg, #108f78, #108f78 10px, transparent 10px, transparent 20px, #108f78 20px);
  background-size: 3px 100%, 100% 3px, 3px 100%, 100% 3px;
  background-position: 0 0, 0 0, 100% 0, 0 100%;
  background-repeat: no-repeat;
}
@media (max-width: 767px) {
  .bl_CV::before {
    top: 6px;
    left: 6px;
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    border-radius: 8px;
    background-image: repeating-linear-gradient(0deg, #108f78, #108f78 5px, transparent 5px, transparent 10px, #108f78 10px), repeating-linear-gradient(90deg, #108f78, #108f78 5px, transparent 5px, transparent 10px, #108f78 10px), repeating-linear-gradient(180deg, #108f78, #108f78 5px, transparent 5px, transparent 10px, #108f78 10px), repeating-linear-gradient(270deg, #108f78, #108f78 5px, transparent 5px, transparent 10px, #108f78 10px);
    background-size: 2px 100%, 100% 2px, 2px 100%, 100% 2px;
  }
}
.bl_CV .bl_CV_inner {
  position: relative;
  padding: 36px 90px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner {
    padding: 26px 25px;
  }
}
.bl_CV .bl_CV_inner_top,
.bl_CV .bl_CV_inner_bottom {
  position: relative;
  width: 100%;
  height: 24px;
  z-index: 2;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_top,
  .bl_CV .bl_CV_inner_bottom {
    height: 12px;
  }
}
.bl_CV .bl_CV_inner_top::before,
.bl_CV .bl_CV_inner_top:after,
.bl_CV .bl_CV_inner_bottom::before,
.bl_CV .bl_CV_inner_bottom:after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  background-image: url(/terroir/assets/img/norihoudai/bg_cv_01.jpg);
  background-repeat: no-repeat;
  background-size: cover;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_top::before,
  .bl_CV .bl_CV_inner_top:after,
  .bl_CV .bl_CV_inner_bottom::before,
  .bl_CV .bl_CV_inner_bottom:after {
    width: 12px;
    height: 12px;
  }
}
.bl_CV .bl_CV_inner_top::before,
.bl_CV .bl_CV_inner_bottom::before {
  left: 10px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_top::before,
  .bl_CV .bl_CV_inner_bottom::before {
    left: 6px;
  }
}
.bl_CV .bl_CV_inner_top:after,
.bl_CV .bl_CV_inner_bottom:after {
  right: 10px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_top:after,
  .bl_CV .bl_CV_inner_bottom:after {
    right: 6px;
  }
}
.bl_CV .bl_CV_inner_top::before,
.bl_CV .bl_CV_inner_top:after {
  top: 10px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_top::before,
  .bl_CV .bl_CV_inner_top:after {
    top: 6px;
  }
}
.bl_CV .bl_CV_inner_top::before {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
.bl_CV .bl_CV_inner_top:after {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}
.bl_CV .bl_CV_inner_bottom::before,
.bl_CV .bl_CV_inner_bottom:after {
  bottom: 10px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_inner_bottom::before,
  .bl_CV .bl_CV_inner_bottom:after {
    bottom: 6px;
  }
}
.bl_CV .bl_CV_inner_bottom:after {
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}
.bl_CV .bl_CV_ttl {
  margin: -165px auto 0;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_ttl {
    position: relative;
    margin: -87px -35px 14px;
    z-index: 2;
  }
}
.bl_CV .bl_CV_point_strong {
  color: #108f78;
  font-size: 28px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_strong {
    font-size: 20px;
  }
}
.bl_CV .bl_CV_point {
  margin-top: 8px;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_txt {
    display: inline-block;
    margin-top: 0.1em;
  }
}
.bl_CV .bl_CV_point_txt__accent {
  position: relative;
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_txt__accent {
    padding: 0.8em 0;
  }
}
.bl_CV .bl_CV_point_txt__accent::before,
.bl_CV .bl_CV_point_txt__accent:after {
  content: "";
  position: absolute;
  top: 50%;
  width: 50px;
  height: 102px;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_txt__accent::before,
  .bl_CV .bl_CV_point_txt__accent:after {
    width: 30px;
    height: 60px;
  }
}
.bl_CV .bl_CV_point_txt__accent::before {
  left: -70px;
  background-image: url(/terroir/assets/img/norihoudai/bg_accent_01.svg);
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_txt__accent::before {
    left: -40px;
  }
}
.bl_CV .bl_CV_point_txt__accent:after {
  right: -70px;
  background-image: url(/terroir/assets/img/norihoudai/bg_accent_02.svg);
}
@media (max-width: 767px) {
  .bl_CV .bl_CV_point_txt__accent:after {
    right: -40px;
  }
}

.el_btn_CV a {
  display: block;
  position: relative;
  margin-top: 25px;
  padding: 36px 30px;
  background-color: #108f78;
  border-radius: 4em;
  color: #fff000;
  text-align: center;
  font-size: 40px;
  line-height: 1.2;
  font-weight: bold;
  letter-spacing: 0.1em;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  -webkit-box-shadow: 4px 4px 0 rgba(16, 53, 52, 0.4);
  box-shadow: 4px 4px 0 rgba(16, 53, 52, 0.4);
  transition: all 0.3s;
}
@media (max-width: 767px) {
  .el_btn_CV a {
    padding: 8px 40px;
    font-size: 18px;
  }
}
.el_btn_CV a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 40px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background-color: #fff000;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media (max-width: 767px) {
  .el_btn_CV a::before {
    left: 20px;
    width: 23px;
    height: 23px;
  }
}
.el_btn_CV a::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 58px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7.5px 0 7.5px 12px;
  border-color: transparent transparent transparent #108f78;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media (max-width: 767px) {
  .el_btn_CV a::after {
    left: 29px;
    border-width: 4px 0 4px 6px;
  }
}
.el_btn_CV a .el_btn_CV_blank {
  position: absolute;
  top: 50%;
  right: 40px;
  width: 18px;
  height: 16px;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(/terroir/assets/img/norihoudai/icon_blank_yellow.png);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
@media (max-width: 767px) {
  .el_btn_CV a .el_btn_CV_blank {
    right: 20px;
    width: 9px;
    height: 8px;
  }
}
.el_btn_CV a:hover {
  background-color: #0a7461;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-transform: translateY(4px);
  transform: translateY(4px);
}

.el_ttl {
  margin: 40px auto 20px;
  padding-bottom: 10px;
  line-height: 1.2;
  font-weight: bold;
  font-size: 20px;
  color: #108f78;
  border-bottom: 2px solid #108f78;
}
@media (max-width: 767px) {
  .el_ttl {
    padding-bottom: 8px;
    margin: 25px auto 10px;
    font-size: 16px;
  }
}

.el_list li {
  display: block;
  margin-top: 8px;
  padding-left: 1em;
  text-indent: -1em;
}
@media (max-width: 767px) {
  .el_list li {
    margin-top: 4px;
  }
}
.el_list li::before {
  content: "・";
}

.el_numList {
  counter-reset: listCounter;
  display: block;
}
.el_numList > li {
  margin-top: 8px;
  padding-left: 1.5em;
  text-indent: -1.5em;
  counter-increment: listCounter;
}
@media (max-width: 767px) {
  .el_numList > li {
    margin-top: 4px;
  }
}
.el_numList > li::before {
  content: counter(listCounter) ".";
  font-weight: bold;
  color: #108f78;
}

.el_note {
  margin-top: 8px;
  font-size: 14px;
}
@media (max-width: 767px) {
  .el_note {
    margin-top: 4px;
  }
}
.el_note li {
  padding-left: 1em;
  text-indent: -1em;
}
.el_note li::before {
  content: "※";
}

.hp_pcOnly {
  display: block;
}
@media screen and (max-width: 670px) {
  .hp_pcOnly {
    display: none;
  }
}

.hp_spOnly {
  display: none;
}
@media screen and (max-width: 670px) {
  .hp_spOnly {
    display: block;
  }
}

.reserve-btn-box {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 50px;
}
.reserve-btn-box .reserve-btn a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  padding: 26px 40px;
  text-decoration: none;
  background-color: seagreen;
  border-radius: 60px;
  z-index: 1;
  transition-property: color;
  transition-duration: 0.35s;
  transition-timing-function: cubic-bezier(0.65, 0, 0.35, 1);
}
.reserve-btn-box .reserve-btn a span {
  font-size: 30px;
  font-weight: 600;
  color: #fff;
  letter-spacing: 0.04em;
  z-index: 2;
}
.reserve-btn-box .reserve-btn a::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 20px;
  width: 20px;
  height: 20px;
  background: url("https://www.hyogo-tourism.jp/terroir/assets/img/experience/icon-window-white.svg") no-repeat 0 0 / contain;
  transform: translateY(-50%) scale(1, 1);
  -webkit-transform: translateY(-50%) scale(1, 1);
  -ms-transform: translateY(-50%) scale(1, 1);
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  z-index: 3;
}
@media screen and (min-width: 1025px) {
  .reserve-btn-box .reserve-btn {
    width: 26%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .reserve-btn-box .reserve-btn {
    width: 60%;
  }
}
@media screen and (max-width: 767px) {
  .reserve-btn-box {
    margin-top: 30px;
  }
  .reserve-btn-box .reserve-btn a {
    padding: 20px 60px 20px 30px;
  }
  .reserve-btn-box .reserve-btn a span {
    font-size: 20px;
  }
}
.experience-price {
  position: absolute;
  top: -30px;
  left: 10px;
  padding: 10px;
  background-color: seagreen;
  border-radius: 8px;
  z-index: 2;
  color: #fff;
}
.experience-price-ttl {
  font-size: 13px;
}
.experience-price p:last-child {
  padding-top: 5px;
  font-size: 26px;
  font-weight: 700;
}
.experience-priority-icon {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  width: 80px;
  height: 80px;
}
.searchItem figcaption.experience-priority-icon {
  width: 50px;
  height: 50px;
}

.dc-hero {
  display: flex;
  justify-content: center;
}
.dc-lead {
  font-weight: 600;
  line-height: 2;
}
@media print, screen and (min-width: 769px) {
  .dc-lead {
    max-width: calc(960px + 2 * 60px);
    width: 100%;
    padding-left: 60px;
    padding-right: 60px;
    margin: 50px auto 80px;
    font-size: 1.15rem;
    text-align: center;
  }
}
@media only screen and (max-width: 768px) {
  .dc-lead {
    margin-top: 20px;
    font-size: 0.85rem;
    line-height: 1.75;
  }
}
.dc-dpass .dc-dpass-title {
  padding-bottom: 13px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  font-size: 1.5rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: 0.08em;
}
@media only screen and (max-width: 768px) {
  .dc-dpass .dc-dpass-title {
    font-size: 1rem;
  }
}
.dc-dpass .dc-dpass-title:nth-of-type(n + 2) {
  margin-top: 50px;
}
.dc-dpass .dc-dpass-day3 .dc-dpass-title {
  border-bottom-color: #273c8f;
  color: #273c8f;
}
.dc-dpass .dc-dpass-day2 .dc-dpass-title {
  border-bottom-color: #eb6100;
  color: #eb6100;
}
.dc-dpass .dc-dpass-list {
  margin-left: 1rem;
  list-style-type: none;
}
.dc-dpass .dc-dpass-list li {
  position: relative;
}
@media only screen and (max-width: 768px) {
  .dc-dpass .dc-dpass-list li {
    font-size: 0.875rem;
  }
}
.dc-dpass .dc-dpass-list li:nth-child(n + 2) {
  margin-top: 1rem;
}
.dc-dpass .dc-dpass-list li::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: -1rem;
  bottom: auto;
  right: auto;
  margin: auto;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
}
.dc-dpass .dc-dpass-day3 .dc-dpass-list li::before {
  background-color: #273c8f;
}
.dc-dpass .dc-dpass-day2 .dc-dpass-list li::before {
  background-color: #eb6100;
}
.dc-dpass .dc-dpass-list li dl {
  display: flex;
  flex-wrap: wrap;
  line-height: 1.5;
}
.dc-dpass .dc-dpass-list li dl dt {
  position: relative;
}
.dc-dpass .dc-dpass-list li dl dt::after {
  content: "：";
}
.dc-dpass .dc-dpass-list li dl dd {
  flex: 1 0 0;
}
@media print, screen and (min-width: 769px) {
  .dc-dpass .dc-dpass-list li dl dt {
    width: 6rem;
    padding-right: 1rem;
    text-align-last: justify;
  }
  .dc-dpass .dc-dpass-list li dl dt::after {
    position: absolute;
    top: 0;
    right: 0;
  }
}
@media only screen and (max-width: 768px) {
  .dc-dpass .dc-dpass-list li dl {
    display: block;
  }
}
.dc-dpass .dc-dpass-day2 {
  margin-top: 50px;
}
@media print, screen and (min-width: 769px) {
  .dc-dpass-box {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .dc-dpass-box-l {
    width: 62%;
  }
  .dc-dpass-box-r {
    width: 36%;
  }
}
@media only screen and (max-width: 768px) {
  .dc-dpass-box {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .dc-dpass-box-r {
    margin-top: 20px;
  }
}
.dc-dpass-box-r a[role="button"] {
  margin: 0;
  color: #fff;
  border-top: none;
  border-radius: 0 0 4px 4px;
}
.dc-dpass-day3 .dc-dpass-box-r a[role="button"] {
  background-color: #2250a8;
  border-color: #2250a8;
}
.dc-dpass-day3 .dc-dpass-box-r a[role="button"]:hover {
  background-color: #fff;
  color: #2250a8;
}
.dc-dpass-day2 .dc-dpass-box-r a[role="button"] {
  background-color: #eb6100;
  border-color: #eb6100;
}
.dc-dpass-day2 .dc-dpass-box-r a[role="button"]:hover {
  background-color: #fff;
  color: #eb6100;
}
@media only screen and (max-width: 768px) {
  .dc-dpass-box-r a[role="button"] {
    max-width: 100%;
  }
}

.dc-dgb {
  margin-left: auto;
  margin-right: auto;
  max-width: 860px;
}

@media print, screen and (min-width: 768px) {
  .dc-dgb {
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-top: 100px;
    margin-bottom: 60px;
    width: calc(100% - 40px);
  }
  .dc-dgb .dc-dgb-l {
    flex: 1 0 0;
  }
  .dc-dgb .dc-dgb-r {
    width: 300px;
  }
}

@media only screen and (max-width: 767px) {
  .dc-dgb {
    position: relative;
    margin-top: 60px;
    margin-bottom: 40px;
  }
  .dc-dgb .dc-dgb-r {
    width: 80%;
    margin-right: auto;
    margin-left: auto;
  }
}

@media only screen and (max-width: 320px) {
  .dc-dgb .dc-dgb-r {
    width: 94%;
  }
}

.dc-dgb .dc-dgb-r img {
  margin-right: auto;
  margin-left: auto;
}
.dc-dgb-r a {
  transition: all 0.4s;
}
.dc-dgb-r a:hover {
  opacity: 0.7;
}
.dc-dgb .dc-dgb-en {
  font-size: 1rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.5;
  font-weight: 500;
  color: #7f6000;
  letter-spacing: 0.05em;
  padding-bottom: 9px;
  padding-left: 20px;
  margin-bottom: 25px;
  border-bottom: 1px solid #7f6000;
}

@media only screen and (max-width: 768px) {
  .dc-dgb .dc-dgb-en {
    margin-left: 0;
    padding-left: 0px;
    margin-bottom: 10px;
    font-size: 0.8rem;
  }
}
.dc-dgb .dc-dgb-catch {
  font-size: 1.875rem;
  font-family: "Noto Serif JP", serif;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 500;
  padding-left: 20px;
  padding-right: 20px;
}

@media only screen and (max-width: 768px) {
  .dc-dgb .dc-dgb-catch {
    font-size: 1.125rem;
    padding-left: 0px;
    padding-right: 0px;
  }
}
.dc-dgb .dc-dgb-title-wrp {
  margin-top: 30px;
  margin-bottom: 30px;
  padding: 20px;
  background-color: #2250a8;
  color: #fff;
}
@media only screen and (max-width: 768px) {
  .dc-dgb .dc-dgb-title-wrp {
    margin-top: 15px;
    margin-bottom: 15px;
    padding: 15px;
  }
}
.dc-dgb .dc-dgb-title {
  font-size: 1.875rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 500;
}
.dc-dgb .dc-dgb-discription {
  font-size: 0.875rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
  font-weight: 500;
  margin-top: 20px;
  padding-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}

@media only screen and (max-width: 768px) {
  .dc-dgb .dc-dgb-title-wrp {
    padding: 15px 10px;
    text-align: center;
  }
  .dc-dgb .dc-dgb-title {
    font-size: 1.225rem;
  }
  .dc-dgb .dc-dgb-discription {
    font-size: 0.775rem;
    margin-top: 10px;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
  }
}
.dc-dgb a[role="button"] {
  margin: 30px 0 0;
  background-color: #2250a8;
  border-color: #2250a8;
  color: #fff;
}
.dc-dgb a[role="button"]:hover {
  background-color: #fff;
  color: #2250a8;
}
.dc-dgb-r .dc-dgb-btn a[role="button"] {
  max-width: 100%;
  margin-top: 15px;
}
@media print, screen and (min-width: 768px) {
  .dc-dgb-r .dc-dgb-btn {
    display: none;
  }
}

@media only screen and (max-width: 767px) {
  .dc-dgb-l .dc-dgb-btn {
    display: none;
  }
}
.guidebook-rule-main-ttl,
.guidebook-rule-sub-ttl {
  font-weight: 700;
  line-height: 1;
}
.guidebook-rule-main-ttl {
  padding: 10px;
  background-color: #a47b51;
  color: #fff;
}
.guidebook-rule-sub-ttl {
  padding-top: 20px;
  padding-bottom: 10px;
  color: #a47b51;
}

.modal-guidebook-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 2000;
  display: none;
}
.modal-guidebook-rule {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40%;
  background-color: #fff;
  padding: 30px;
  border-radius: 5px;
}
.modal-guidebook-rule-inner {
  position: relative;
}
.modal-guidebook-rule li {
  letter-spacing: 0.05rem;
}
@media only screen and (max-width: 767px) {
  .modal-guidebook-rule {
    width: 94%;
    padding: 15px;
  }
  .modal-guidebook-rule li {
    font-size: 1.2rem;
  }
}
.js-modal-guidebook-close {
  position: absolute;
  top: -50px;
  right: -50px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  padding: 15px;
  background-color: #a47b51;
  border-radius: 9999rem;
  cursor: pointer;
  transition: all 0.4s;
}
.js-modal-guidebook-close:hover {
  background-color: #000;
}
.js-modal-guidebook-close button {
  display: inline-block;
  vertical-align: middle;
  color: #333;
  line-height: 1;
  width: 20px;
  height: 2px;
  background: #fff;
  transform: rotate(45deg);
  border: none;
  outline: none;
}
.js-modal-guidebook-close button::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}

@media only screen and (max-width: 767px) {
  .js-modal-guidebook-close {
    top: -60px;
    right: -20px;
  }
}
ul.l-circle {
  margin-left: 1em;
}
ul.l-circle li {
  position: relative;
  margin-bottom: 10px;
  list-style: none;
  font-size: 0.8em;
  line-height: 1.4;
}
ul.l-circle li:last-child {
  margin-bottom: 0;
}
ul.l-circle li:before {
  content: "";
  display: block;
  position: absolute;
  top: 9px;
  left: -10px;
  bottom: auto;
  right: auto;
  margin: auto;
  width: 5px;
  height: 5px;
  border-radius: 50%;
}
ul.l-circle li:before {
  content: "";
  background: #1f1f1f;
}

.dc-dgb-note {
  padding-top: 15px;
}
@media only screen and (max-width: 767px) {
  .dc-dgb-l .dc-dgb-note {
    display: none;
  }
}
@media print, screen and (min-width: 768px) {
  .dc-dgb-r .dc-dgb-note {
    display: none;
  }
}
.trip-list {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 30px;
}
@media only screen and (max-width: 767px) {
 .trip-list {
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
 }
}
.trip-list li {
 background-color: #fff;
 border: 1px solid #c0c0c0;
 transition: border .4s;
}
.trip-list li:hover {
 border-color: #7f6000;
}