@charset "UTF-8";
/* //////////////////////////////////////////////////////////
    common
////////////////////////////////////////////////////////// */
* {
  min-width: 0;
  min-height: 0; }

:root {
  color-scheme: light; }

.clearfix::after {
  content: "";
  display: block;
  clear: both; }

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  transition: none !important; }

.pcHide {
  display: none; }
  @media screen and (max-width: 767px) {
    .pcHide {
      display: block !important; } }

@media screen and (max-width: 767px) {
  .spHide {
    display: none !important; } }

.container > main {
  margin: 70px 0 0 0; }

/* //////////////////////////////////////////////////////////
    Animation
////////////////////////////////////////////////////////// */
@keyframes loopBg {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(-50%); } }
@keyframes rotateUb {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(360deg); } }
@keyframes rotateUbRe {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(-360deg); } }
/* //////////////////////////////////////////////////////////
    .global-header
////////////////////////////////////////////////////////// */
.global-header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 12;
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #d2d2d2; }
  .global-header__inner {
    width: 90%;
    margin: 0 auto;
    padding: 15px 0;
    display: flex;
    /*justify-content: space-between;*/ }
  .global-header__logo {
    max-width: 270px;
    margin-right: auto; }
    .global-header__logo img {
      width: 100%;
      height: auto; }
  .global-header__lang-list {
    display: flex;
    align-items: center;
    column-gap: 1rem;
    margin: 0 2.5rem 0 0; }
  .global-header__humberger {
    width: 50px;
    height: 45px;
    position: relative;
    border: none;
    background-color: transparent;
    z-index: 11; }
    .global-header__humberger.active .global-header__humberger__line {
      background-color: transparent; }
      .global-header__humberger.active .global-header__humberger__line:before {
        top: 0;
        transform: rotate(45deg); }
      .global-header__humberger.active .global-header__humberger__line:after {
        top: 0;
        transform: rotate(-45deg); }
    .global-header__humberger__line {
      display: block;
      height: 2px;
      position: absolute;
      top: 23px;
      left: 50%;
      transform: translateX(-50%);
      width: 40px;
      background-color: #36609e;
      transition: 0.4s;
      z-index: 10; }
      .global-header__humberger__line:before, .global-header__humberger__line:after {
        content: "";
        display: block;
        height: 100%;
        position: absolute;
        width: 100%;
        background-color: #36609e;
        transition: inherit; }
      .global-header__humberger__line:before {
        top: -12px; }
      .global-header__humberger__line:after {
        top: 12px; }
  .global-header__nav {
    position: fixed;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background: #ffffffed;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 5%;
    transition: right 0.4s;
    z-index: 10; }
    .global-header__nav.active {
      right: 0; }
    .global-header__nav__area {
      display: flex;
      align-items: center;
      gap: 40px;
      font-weight: 500;
      flex-wrap: wrap;
      max-width: 450px; }
      .global-header__nav__area__logo {
        display: block;
        max-width: 300px;
        margin: 0 auto;
        flex: 0 1 100%; }
      .global-header__nav__area__list {
        flex: 0 1 100%; }
        .global-header__nav__area__list a {
          transition: color 0.3s, background 0.3s;
          border-radius: 5px;
          display: block;
          text-align: center;
          padding: 1em 0;
          border-radius: 0;
          font-size: 18px;
          text-decoration: none;
          color: #000; }
        .global-header__nav__area__list__item {
          flex: 0 1 100%;
          border-bottom: 1px dotted #cecece;
          font-size: 1.8rem; }
          .global-header__nav__area__list__item:last-child {
            border-bottom: none; }
      .global-header__nav__area__lang-list {
        display: flex;
        justify-content: center;
        width: 100%; }
        .global-header__nav__area__lang-list__item {
          border-right: 1px solid #000; }
          .global-header__nav__area__lang-list__item:last-child {
            border-right: none; }
          .global-header__nav__area__lang-list__item a {
            text-underline-offset: 3px;
            color: #36609e;
            font-weight: 600; }
          .global-header__nav__area__lang-list__item a, .global-header__nav__area__lang-list__item b {
            display: inline-block;
            padding: 0.5em 1em; }
  .global-header #js-focus-trap {
    display: none; }

/* //////////////////////////////////////////////////////////
    .global-footer
////////////////////////////////////////////////////////// */
.global-footer {
  display: flex; }
  @media screen and (max-width: 767px) {
    .global-footer {
      flex-wrap: wrap; } }
  .global-footer__main {
    flex: 0 1 70%;
    background: #4b4b4b;
    padding: 40px 5% 5%; }
    @media screen and (max-width: 767px) {
      .global-footer__main {
        flex: 0 1 100%; } }
  .global-footer__nav__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8em 1.6em; }
    .global-footer__nav__list a {
      text-decoration: none;
      color: #fff;
      font-weight: bold; }
  .global-footer__logo {
    flex: 0 1 30%;
    display: flex;
    justify-content: center;
    align-items: center; }
    @media screen and (max-width: 767px) {
      .global-footer__logo {
        flex: 0 1 100%;
        padding: 40px 0; } }
    .global-footer__logo__figure {
      max-width: 80%; }

/* //////////////////////////////////////////////////////////
    .global-btn
////////////////////////////////////////////////////////// */
.global-btn {
  text-align: center;
  margin: 40px 0 0 0; }
  @media screen and (max-width: 767px) {
    .global-btn {
      margin: 30px 0 0 0; } }
  .global-btn a {
    display: inline-block;
    background: #36609e;
    color: #fff;
    border: 1px solid #36609e;
    line-height: 1;
    padding: 0.9em 1.5em;
    text-decoration: none;
    font-size: 18px;
    font-weight: bold;
    min-width: 300px;
    border-radius: 3px;
    transition: background 0.3s, color 0.3s; }
    @media screen and (max-width: 767px) {
      .global-btn a {
        font-size: 16px; } }
    .global-btn a:after {
      font-family: "Font Awesome 6 Free";
      content: '\f061';
      font-weight: 900;
      display: inline-block;
      margin: 0 0 0 0.5em;
      transition: color 0.2s, transform 0.3s; }
    .global-btn a:hover {
      background: none;
      color: #36609e; }
      .global-btn a:hover:after {
        color: #36609e;
        transform: translateX(7px); }
  .global-btn.btn-white a {
    background: #fff;
    color: #000;
    border: 1px solid #fff; }
    .global-btn.btn-white a:hover {
      color: #fff;
      background: none; }
      .global-btn.btn-white a:hover:after {
        color: #fff; }

/* //////////////////////////////////////////////////////////
    .modal
////////////////////////////////////////////////////////// */
.modal {
  display: none;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100; }

.modal__bg {
  background: rgba(0, 0, 0, 0.8);
  height: 100vh;
  position: absolute;
  width: 100%; }

.modal__content {
  background: #fff;
  padding: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  max-width: 1400px;
  border-radius: 10px;
  z-index: 10; }
  @media screen and (max-width: 767px) {
    .modal__content {
      width: 88%;
      max-height: 500px;
      overflow-y: scroll;
      padding: 25px; } }

.f-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row; }
  @media screen and (max-width: 767px) {
    .f-container {
      flex-wrap: wrap; } }

.modal__content .story-images, .collection-images {
  flex-basis: 45%; }
  @media screen and (max-width: 767px) {
    .modal__content .story-images, .collection-images {
      flex-basis: 100%; } }

.modal__content .txtBox {
  flex-basis: 55%;
  padding: 1em 5em; }
  @media screen and (max-width: 767px) {
    .modal__content .txtBox {
      flex-basis: 100%;
      padding: 2em 0; } }

.collection-information .itemTtlBox {
  border-bottom: 2px solid #111111; }

.modal__content .txtBox .ttl01 {
  font-size: 26px;
  text-align: left;
  margin-bottom: 0.5em; }
  @media screen and (max-width: 767px) {
    .modal__content .txtBox .ttl01 {
      font-size: 23px; } }

.collection-information .itemTtlBox .ttl02 {
  font-size: 20px;
  margin-bottom: 0.8em; }
  @media screen and (max-width: 767px) {
    .collection-information .itemTtlBox .ttl02 {
      font-size: 17px; } }

.modal__content .scroll {
  overflow-x: scroll; }

.collection-information .detailBox {
  border-bottom: 1px solid #707070;
  padding: 0 2em 1em 0; }

.collection-information .detailBox {
  padding: 0 0 1em 0;
  margin-top: 2em; }

.collection-information .scroll {
  height: 49vh; }
  @media screen and (max-width: 767px) {
    .collection-information .scroll {
      height: auto; } }

.collection-information .itemtagList {
  margin-bottom: 1em; }

.collection-information .itemtagList li {
  display: inline-block;
  margin-right: 1em;
  font-size: 14px; }
  .collection-information .itemtagList li a {
    text-decoration: none;
    color: #3B9DB4; }

.collection-information .txt01 {
  line-height: 2.1 !important;
  text-align: justify !important;
  text-justify: inter-ideograph !important;
  margin-bottom: 1em; }

.modal__content .txtBox .txt01 {
  font-size: 16px;
  line-height: 1.8;
  text-align: left; }

.collection-information .itemmoreBtn a {
  background: #EDEDED;
  font-size: 14px;
  color: #555555;
  padding: 0.2em 1em;
  border-radius: 5px;
  display: inline-block;
  margin: 0 auto 1em 0; }

.collection-information .one-pointBox {
  background: #F4F4F4;
  padding: 1em 2em;
  margin-bottom: 2em; }

.collection-information .one-pointBox .ttl {
  font-size: 20px;
  margin-bottom: 0.4em; }

.collection-information .one-pointBox .txt {
  font-size: 16px;
  text-align: justify;
  text-justify: inter-ideograph; }

.collection-information .otherTxt p {
  font-size: 12px;
  font-weight: 100;
  line-height: 1.8;
  margin-bottom: 0; }
.collection-information .otherTxt table {
  border-collapse: collapse; }
  .collection-information .otherTxt table tbody tr th, .collection-information .otherTxt table tbody tr td {
    padding: 1em;
    font-size: 13px; }
  .collection-information .otherTxt table tbody tr th {
    background: #f1f1f1;
    border-bottom: 1px solid #fff; }
  .collection-information .otherTxt table tbody tr td {
    border-bottom: 1px solid #f1f1f1; }

.modal__content .collection-information .btnList {
  margin-top: 2em; }

.modal__content .btnList {
  margin-top: 4em;
  text-align: right; }
  @media screen and (max-width: 767px) {
    .modal__content .btnList {
      text-align: center; } }

.modalBtn.js-modal-close {
  background: #B4B4B4;
  color: #fff; }

.modalBtn:not(:last-child) {
  margin-right: 0.4em; }

.modalBtn {
  border-radius: 6px;
  padding: 0.6em 2em;
  color: #fff;
  font-size: 18px;
  text-align: center;
  text-decoration: none;
  font-weight: bold; }
  @media screen and (max-width: 767px) {
    .modalBtn {
      padding: 0.6em 1em;
      font-size: 16px; } }

.modalBtn.btn-shop {
  background: #BC2525;
  color: #fff; }

.imgMain {
  margin-bottom: 2em;
  width: 100%; }
  @media screen and (max-width: 767px) {
    .imgMain {
      margin-bottom: 0.5em; } }

.imgMain figure, .gallery figure {
  width: 100%;
  position: relative;
  overflow: hidden; }

.imgMain figure img, .gallery figure img {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  margin: auto;
  object-fit: cover; }

.imgMain figure::after, .gallery figure::after {
  content: "";
  display: block;
  padding-top: 100%; }

ul.gallery {
  width: 100%;
  height: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
  gap: 1em;
  flex-wrap: wrap; }
  @media screen and (max-width: 767px) {
    ul.gallery {
      gap: 0.5em; } }

.modal .gallery li {
  background: #000; }

ul.gallery li {
  width: 14%;
  height: auto;
  float: left; }

.imgMain figure, .gallery figure {
  width: 100%;
  position: relative;
  overflow: hidden; }

.modal .gallery figure img.current {
  opacity: 1 !important; }

ul.gallery li img {
  width: 100%;
  height: auto; }

.imgMain figure::after, .gallery figure::after {
  content: "";
  display: block;
  padding-top: 100%; }

.collection-information {
  text-align: left; }

.modal__content .otherTitle {
  font-size: 20px;
  border-bottom: 2px solid #000;
  margin: 30px 0 0 0;
  padding: 0 0 15px 0; }
.modal__content .otherVideo {
  margin: 30px 0 0 0; }
  .modal__content .otherVideo iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9; }
.modal__content .otherMap {
  margin: 30px 0 0 0; }
  .modal__content .otherMap iframe {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9; }
.modal__content table {
  margin: 30px 0 0 0; }

.modal__close-icon {
  position: absolute;
  top: -60px;
  right: 0;
  color: #fff;
  font-size: 35px;
  cursor: pointer;
  transition: transform 0.3s; }
  .modal__close-icon:hover {
    transform: scale(1.2); }

/* //////////////////////////////////////////////////////////
    .mainvisual
////////////////////////////////////////////////////////// */
@keyframes mainvisualBg {
  0% {
    transform: translate(-50%, -50%) scale(1.2);
    opacity: 0; }
  15% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.7; }
  85% {
    opacity: 0.7; }
  to {
    opacity: 0.2; } }
.mainvisual {
  height: 56vw;
  overflow: hidden;
  position: relative; }
  @media screen and (max-width: 767px) {
    .mainvisual {
      height: 550px; } }
  .mainvisual.active .mainvisual__logo {
    opacity: 1;
    transform: translate(-50%, -50%); }
  .mainvisual.active:before {
    animation: mainvisualBg 7.5s linear both;
    animation-timing-function: ease;
    animation-delay: 0.5s; }
  .mainvisual:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background: url("../images/mainvisual-bg_ground.jpg") no-repeat center;
    background-size: cover;
    opacity: 0; }
  .mainvisual:after {
    content: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 25%;
    background: #fff; }
  .mainvisual__inner {
    max-width: 1200px;
    width: 90%;
    margin: 0 auto; }
  .mainvisual__logo {
    font-family: 'Caveat', cursive;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-60%, -50%);
    width: 45%;
    font-size: 4vw;
    text-align: center;
    opacity: 0;
    transition: opacity 0.6s, transform 0.6s;
    transition-delay: 7.5s;
    color: #555; }
    @media screen and (max-width: 767px) {
      .mainvisual__logo {
        width: 100%;
        font-size: 11vw; } }
    .mainvisual__logo img {
      width: 100%;
      height: auto; }
  .mainvisual__ub-list__item {
    position: absolute;
    z-index: 1;
    animation: rotateUb 15s linear infinite forwards;
    opacity: 0;
    transition: opacity 3s; }
    .mainvisual__ub-list__item img {
      width: 100%;
      height: auto; }
    .mainvisual__ub-list__item.item-01 {
      width: 50%;
      top: -23%;
      right: -12%;
      animation: rotateUb 35s linear infinite forwards;
      transition-delay: 1s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-01 {
          width: 75%;
          top: -20%;
          right: -28%; } }
    .mainvisual__ub-list__item.item-02 {
      width: 26%;
      top: -13%;
      left: 38%;
      animation: rotateUb 20s linear infinite forwards;
      transition-delay: 4s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-02 {
          width: 34%;
          top: -8%;
          left: 28%; } }
    .mainvisual__ub-list__item.item-03 {
      width: 23%;
      bottom: -9%;
      left: 29%;
      animation: rotateUbRe 25s linear infinite forwards;
      transition-delay: 3s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-03 {
          width: 36%; } }
    .mainvisual__ub-list__item.item-04 {
      width: 32%;
      top: -17%;
      left: 3%;
      animation: rotateUbRe 17s linear infinite forwards;
      transition-delay: 2s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-04 {
          width: 60%;
          top: -6%;
          left: -23%; } }
    .mainvisual__ub-list__item.item-05 {
      width: 36%;
      bottom: -4%;
      left: -8%;
      animation: rotateUb 30s linear infinite forwards;
      transition-delay: 6s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-05 {
          width: 52%;
          bottom: -4%;
          left: -18%; } }
    .mainvisual__ub-list__item.item-06 {
      width: 29%;
      bottom: -11%;
      right: 13%;
      animation: rotateUbRe 20s linear infinite forwards;
      transition-delay: 5s; }
      @media screen and (max-width: 767px) {
        .mainvisual__ub-list__item.item-06 {
          width: 54%;
          bottom: 1%;
          right: -13%; } }
    .mainvisual__ub-list__item.active {
      opacity: 1; }

/* //////////////////////////////////////////////////////////
    .page
////////////////////////////////////////////////////////// */
.page__section {
  position: relative; }
  .page__section__inner {
    max-width: 1200px;
    width: 90%;
    margin: 0 auto;
    padding: 80px 0;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 767px) {
      .page__section__inner {
        padding: 60px 0; } }
    .page__section__inner p:not(.page__title__read) {
      margin: 20px 0 0 0;
      font-size: 16px;
      line-height: 1.7; }
      .page__section__inner p:not(.page__title__read).txtR {
        text-align: right; }
      .page__section__inner p:not(.page__title__read).mt-large {
        margin: 40px 0 0 0; }
  .page__section.bg-gray {
    background: #efefef; }
  .page__section.bg-about {
    background: url("../images/mainvisual__about_us.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-about:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-about_us_history {
    background: url("../images/mainvisual__about_us_history.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-about_us_history:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-traditional_crafts {
    background: url("../images/mainvisual__traditional_crafts.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-traditional_crafts:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-umbrella {
    background: url("../images/mainvisual__umbrella.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-umbrella:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-umbrella_parts {
    background: url("../images/mainvisual__umbrella_parts.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-umbrella_parts:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-umbrella_select {
    background: url("../images/mainvisual__umbrella_select.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-umbrella_select:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section.bg-umbrella_history {
    background: url("../images/mainvisual__umbrella_history.jpg") no-repeat center;
    background-attachment: cover;
    color: #fff; }
    .page__section.bg-umbrella_history:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.4;
      width: 100%;
      height: 100%; }
  .page__section .width-600 {
    max-width: 600px; }
  .page__section .width-700 {
    max-width: 700px; }
  .page__section .width-800 {
    max-width: 800px; }
  .page__section .width-900 {
    max-width: 900px; }
  .page__section .width-1000 {
    max-width: 1000px; }
  .page__section .width-1100 {
    max-width: 1100px; }
  .page__section .width-1200 {
    max-width: 1200px; }
  .page__section__table {
    border-collapse: collapse;
    width: 100%;
    margin: 40px 0 0 0; }
    .page__section__table tbody tr th, .page__section__table tbody tr td {
      padding: 1em;
      font-size: 16px; }
    .page__section__table tbody tr th {
      background: #f1f1f1;
      border-bottom: 1px solid #fff; }
    .page__section__table tbody tr td {
      border-bottom: 1px solid #f1f1f1; }
  .page__section__map {
    margin: 40px 0 0 0; }
    .page__section__map iframe {
      width: 100%;
      height: 100%;
      aspect-ratio: 16/9; }
  .page__section .embed-youtube {
    margin: 40px 0 0 0; }
    .page__section .embed-youtube iframe {
      width: 100%;
      height: 100%;
      aspect-ratio: 16/9; }
  .page__section .title-h3 {
    border-bottom: 2px solid #dedede;
    font-size: 24px;
    margin: 50px 0 0 0;
    padding: 0 0 15px 0;
    position: relative; }
    .page__section .title-h3:after {
      content: "";
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 100px;
      height: 2px;
      background: #36609e; }
  .page__section .title-h4 {
    font-size: 20px;
    border-left: 4px solid #36609e;
    margin: 40px 0 0 0;
    padding: 0 0 0 15px; }
  .page__section .figure-item {
    margin: 40px auto 0; }
    .page__section .figure-item figcaption {
      text-align: center;
      font-size: 15px;
      margin: 10px 0 0 0; }
  .page__section .ol-list {
    margin: 30px 0 0 0; }
    .page__section .ol-list li {
      margin: 10px 0 0 0; }
  .page__section .ul-list {
    margin: 30px 0 0 0; }
    .page__section .ul-list.fs-18 {
      font-size: 18px; }
    .page__section .ul-list li {
      margin: 10px 0 0 0; }
      .page__section .ul-list li i {
        color: #36609e; }
  .page__section .parts-main-list {
    display: flex;
    justify-content: space-between;
    margin: 30px 0 0 0;
    column-gap: 1%; }
    @media screen and (max-width: 767px) {
      .page__section .parts-main-list {
        flex-wrap: wrap; } }
    .page__section .parts-main-list__item img {
      margin: 4% 0 0 0;
      border-radius: 10px; }
      .page__section .parts-main-list__item img:first-child {
        margin: 0 0 0 0; }
    .page__section .parts-main-list__item:first-child {
      flex: 0 1 49.7%; }
      @media screen and (max-width: 767px) {
        .page__section .parts-main-list__item:first-child {
          flex: 0 1 100%; } }
    .page__section .parts-main-list__item:last-child {
      flex: 0 1 48.5%; }
      @media screen and (max-width: 767px) {
        .page__section .parts-main-list__item:last-child {
          margin: 4% 0 0 0;
          flex: 0 1 100%; } }
  .page__section .parts-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 30px 0 0 0; }
    .page__section .parts-list__item {
      background: #e5f3fe;
      border: 1px solid #dae7f3;
      padding: 1.5em;
      border-radius: 5px;
      font-size: 20px;
      margin: 15px 0 0 0;
      flex: 0 1 32%;
      box-shadow: 0px 10px 10px -6px rgba(0, 135, 213, 0.1); }
      @media screen and (max-width: 767px) {
        .page__section .parts-list__item {
          flex: 0 1 48.5%;
          padding: 1em 0.5em;
          font-size: 17px; } }
      .page__section .parts-list__item span {
        display: block; }
      .page__section .parts-list__item__figure {
        overflow: hidden;
        margin: 0 auto;
        border-radius: 5px; }
      .page__section .parts-list__item__title {
        font-weight: bold;
        color: #36609e;
        text-align: center;
        border-bottom: 1px solid #fff;
        margin: 20px 0 0 0;
        padding: 0 0 10px 0; }
        @media screen and (max-width: 767px) {
          .page__section .parts-list__item__title {
            margin: 10px 0 0 0; } }
      .page__section .parts-list__item__text {
        font-size: 16px;
        margin: 15px 0 0 0;
        text-align: center; }
        @media screen and (max-width: 767px) {
          .page__section .parts-list__item__text {
            font-size: 14px; } }
  .page__section .history-list {
    margin: 40px 0 0 0; }
    .page__section .history-list__item {
      display: flex;
      align-items: center;
      gap: 3%;
      border-top: 1px dashed #D9DCDB;
      padding: 20px 0; }
      @media screen and (max-width: 767px) {
        .page__section .history-list__item {
          flex-wrap: wrap;
          padding: 35px 0; } }
      .page__section .history-list__item:last-child {
        border-bottom: 1px dashed #D9DCDB; }
      .page__section .history-list__item__year {
        font-size: 28px;
        border-right: 2px solid #36609e;
        padding: 0 2% 0 0;
        flex: 0 1 120px; }
        @media screen and (max-width: 767px) {
          .page__section .history-list__item__year {
            flex: 0 1 100%;
            border-right: none;
            border-bottom: 1px solid #36609e;
            padding: 0 0 20px 0; } }
        .page__section .history-list__item__year strong {
          color: #36609e; }
        .page__section .history-list__item__year small {
          font-size: 16px; }
        .page__section .history-list__item__year span {
          font-size: 15px;
          display: block; }
      .page__section .history-list__item__text {
        flex: 0 1 calc(100% - 130px); }
        @media screen and (max-width: 767px) {
          .page__section .history-list__item__text {
            flex: 0 1 100%;
            padding: 20px 0 0 0; } }
  .page__section .face-img {
    max-width: 200px;
    width: 100%;
    max-height: 200px;
    height: auto;
    overflow: hidden;
    margin: 40px auto 0;
    border-radius: 50%; }
.page__title {
  margin: 80px 0 0 0; }
  .page__title:nth-of-type(1) {
    margin: 0 0 0 0; }
  .page__title__main {
    font-size: 28px;
    font-weight: bold;
    text-align: center;
    position: relative;
    padding: 0 0 30px 0;
    color: #4b4b4b; }
    @media screen and (max-width: 767px) {
      .page__title__main {
        font-size: 24px;
        padding: 0 0 20px 0; } }
    .page__title__main:after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100px;
      height: 1px;
      background: #000; }
  .page__title__read {
    margin: 30px 0 0 0;
    font-size: 17px;
    text-align: center;
    line-height: 1.8; }
  .page__title.color-white {
    color: #fff; }
    .page__title.color-white .page__title__main {
      color: #fff; }
      .page__title.color-white .page__title__main:after {
        background: #fff; }
.page__mainvisual {
  width: 100%;
  height: 350px;
  background-size: cover;
  display: flex;
  align-items: center;
  position: relative; }
  @media screen and (max-width: 767px) {
    .page__mainvisual {
      height: 300px; } }
  .page__mainvisual__inner {
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    z-index: 5; }
  .page__mainvisual__title {
    color: #fff;
    font-size: 33px; }
.page__form {
  margin: 30px 0 0 0; }
  .page__form table {
    max-width: 800px;
    margin: 0 auto;
    width: 100%; }
    .page__form table tbody tr {
      border-bottom: 1px solid #dcdcdc; }
      .page__form table tbody tr th, .page__form table tbody tr td {
        padding: 1.2rem 1.2rem;
        border-bottom: 1px solid #dcdcdc;
        line-height: 1.8; }
        @media screen and (max-width: 767px) {
          .page__form table tbody tr th, .page__form table tbody tr td {
            font-size: 13px;
            padding: 0.8rem 0; } }
      .page__form table tbody tr th {
        font-weight: 500; }
        @media screen and (max-width: 767px) {
          .page__form table tbody tr th {
            width: 35%; } }
      .page__form table tbody tr:last-child th, .page__form table tbody tr:last-child td {
        border-bottom: none; }
  .page__form input[type="text"] {
    width: 100%;
    border-radius: 5px;
    border-color: #dcdcdc;
    border: 1px solid #dcdcdc;
    background: #f7f7f7; }
  .page__form label {
    margin: 0 1.6rem 0 0; }
  .page__form textarea {
    width: 100%;
    border-radius: 5px;
    border-color: #dcdcdc;
    border: 1px solid #dcdcdc;
    background: #f7f7f7; }
  .page__form__submit {
    margin: 30px 0 0 0; }
    .page__form__submit input {
      background: #36609e;
      border: 1px solid #36609e;
      color: #fff;
      font-weight: bold;
      padding: 0.8em 2em;
      display: block;
      max-width: 400px;
      width: 100%;
      margin: 0 auto;
      cursor: pointer;
      transition: background 0.3s, color 0.3s; }
      @media screen and (max-width: 767px) {
        .page__form__submit input {
          padding: 0.6em 2em; } }
      .page__form__submit input:hover {
        background: none;
        color: #36609e; }

/* //////////////////////////////////////////////////////////
    .sort-tag
////////////////////////////////////////////////////////// */
.sort-tag {
  margin: 40px 0 0 0; }
  .sort-tag__list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 35px; }
    @media screen and (max-width: 767px) {
      .sort-tag__list {
        gap: 10px 20px; } }
    .sort-tag__list__item {
      margin: 15px 0 0 0; }
      @media screen and (max-width: 767px) {
        .sort-tag__list__item {
          margin: 10px 0 0 0; } }
  .sort-tag__label {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-size: 18px; }
    @media screen and (max-width: 767px) {
      .sort-tag__label {
        font-size: 15px; } }
    .sort-tag__label__indicator {
      position: absolute;
      top: 2px;
      left: 0;
      height: 20px;
      width: 20px;
      background: #E6E6E6;
      border-radius: 4px;
      transition: all 0.2s; }
      .sort-tag__label__indicator:after {
        content: "";
        position: absolute;
        display: none;
        left: 7px;
        top: 4px;
        width: 6px;
        height: 10px;
        border: solid #fff;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
        transition: all 0.2s; }
    .sort-tag__label__checkbox {
      position: absolute;
      z-index: -1;
      opacity: 0; }
      .sort-tag__label__checkbox:checked {
        display: block; }
        .sort-tag__label__checkbox:checked ~ .sort-tag__label__indicator {
          background: #36609e; }
        .sort-tag__label__checkbox:checked ~ .sort-tag__label__indicator:after {
          display: block; }
        .sort-tag__label__checkbox:checked:focus ~ .sort-tag__label__indicator {
          background: #5786e0; }
    .sort-tag__label:hover .sort-tag__label__checkbox:not(:checked) ~
    .sort-tag__label__indicator {
      background: #c9c9c9; }

/* //////////////////////////////////////////////////////////
    .union-link
////////////////////////////////////////////////////////// */
.union-link__list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 2%; }
  @media screen and (max-width: 767px) {
    .union-link__list {
      gap: 10px 2%; } }
  .union-link__list__item {
    flex: 0 1 32%; }
    @media screen and (max-width: 767px) {
      .union-link__list__item {
        flex: 0 1 49%; } }
    .union-link__list__item a {
      display: flex;
      justify-content: space-between;
      align-items: center;
      position: relative;
      text-decoration: none;
      padding: 15px;
      border-radius: 5px;
      background: #fff;
      box-shadow: 0px 0px 10px 0px #d8d8d8;
      transition: transform 0.3s;
      min-height: 190px; }
      @media screen and (max-width: 767px) {
        .union-link__list__item a {
          display: block;
          min-height: auto;
          display: block;
          height: 100%; } }
      .union-link__list__item a:hover {
        transform: translateY(-10px); }
      .union-link__list__item a:after {
        content: "Read more ≫";
        position: absolute;
        bottom: 15px;
        right: 15px;
        color: #fff;
        font-weight: bold;
        font-size: 11px;
        background: #36609e;
        line-height: 1;
        padding: 0.5em 1.2em;
        border-radius: 30px; }
    .union-link__list__item span {
      display: block; }
    .union-link__list__item.hide_item {
      display: none; }
  .union-link__list .found__box {
    flex: 0 1 100%;
    text-align: center;
    font-size: 18px; }
.union-link__thum {
  flex: 0 1 32%;
  position: relative;
  overflow: hidden; }
  .union-link__thum img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover; }
  .union-link__thum:before {
    content: "";
    padding-top: 100%;
    display: block; }
.union-link__info {
  flex: 0 1 63%;
  padding: 15px 0 25px; }
  @media screen and (max-width: 767px) {
    .union-link__info {
      padding: 15px 0 35px; } }
  .union-link__info__name {
    font-size: 18px;
    font-weight: bold;
    color: #000;
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #e9e9e9; }
  .union-link__info__sub {
    font-size: 14px;
    color: #797979; }

/* //////////////////////////////////////////////////////////
    .member-list
////////////////////////////////////////////////////////// */
.member-list {
  margin: 50px 0 0 0; }
  .member-list__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e5e5e5;
    padding: 30px 0; }
    .member-list__item:last-child {
      border-bottom: 1px solid #e5e5e5; }
    .member-list__item__figure {
      flex: 0 1 45%; }
    .member-list__item__text {
      flex: 0 1 52%; }

/* //////////////////////////////////////////////////////////
    .crafts-list
////////////////////////////////////////////////////////// */
.crafts-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 30px 0 0 0; }
  .crafts-list__item {
    flex: 0 1 47%;
    border-left: 1px solid #000;
    margin: 3% 0 0 0;
    padding: 1% 0 1% 2%; }
    @media screen and (max-width: 767px) {
      .crafts-list__item {
        flex: 0 1 100%;
        margin: 30px 0 0 0;
        padding: 10px 0 10px 20px; } }
    .crafts-list__item__title {
      font-size: 20px;
      font-weight: 600; }
    .crafts-list__item__info {
      margin: 10px 0 0 0; }
      .crafts-list__item__info a {
        color: #36609e;
        transition: opacity 0.3s; }
        .crafts-list__item__info a:hover {
          opacity: 0.5; }

/* //////////////////////////////////////////////////////////
    .crafts-ol-list
////////////////////////////////////////////////////////// */
.crafts-ol-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 20px 0 0 0; }
  .crafts-ol-list:after {
    content: "";
    flex: 0 1 31%; }
  .crafts-ol-list__item {
    flex: 0 1 31%;
    margin: 3% 0 0 0;
    position: relative; }
    @media screen and (max-width: 767px) {
      .crafts-ol-list__item {
        flex: 0 1 49%; } }
    .crafts-ol-list__item:after {
      content: "\f30b";
      font-weight: 900;
      font-family: "Font Awesome 6 Free";
      font-size: 60px;
      position: absolute;
      top: 50%;
      right: -10%;
      transform: translateY(-50%);
      color: #36609e;
      text-shadow: 1px 1px 0 #fff,-1px 1px 0 #fff,1px -1px 0 #fff,-1px -1px 0 #fff;
      z-index: 1; }
      @media screen and (max-width: 767px) {
        .crafts-ol-list__item:after {
          font-size: 30px; } }
    .crafts-ol-list__item:last-child:after {
      content: none; }
    .crafts-ol-list__item figcaption {
      position: absolute;
      bottom: 10px;
      left: 10px;
      font-size: 17px;
      font-weight: bold;
      background: #36609e;
      color: #fff;
      line-height: 1;
      padding: 0.3em 0.8em;
      border-radius: 3px;
      word-break: break-all;
      max-width: 95%; }
      @media screen and (max-width: 767px) {
        .crafts-ol-list__item figcaption {
          font-size: 13px;
          padding: 0.3em 0.3em;
          line-height: 1.3; } }

/* //////////////////////////////////////////////////////////
    .crafts-column
////////////////////////////////////////////////////////// */
.crafts-column {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 60px 0; }
  @media screen and (max-width: 767px) {
    .crafts-column {
      flex-wrap: wrap; } }
  .crafts-column__info {
    flex: 0 1 37%; }
    @media screen and (max-width: 767px) {
      .crafts-column__info {
        flex: 0 1 100%; } }
    .crafts-column__info__title {
      font-family: 'Zen Antique', serif; }
      .crafts-column__info__title em {
        display: block;
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        letter-spacing: 1px;
        color: #36609e; }
      .crafts-column__info__title strong {
        display: block;
        font-size: 40px;
        font-weight: 500;
        letter-spacing: 2px; }
      .crafts-column__info__title small {
        display: block;
        font-size: 20px;
        font-weight: 500;
        letter-spacing: 1px; }
    .crafts-column__info__text {
      border-top: 1px solid #d8d8d8;
      line-height: 2;
      margin: 20px 0 0 0;
      padding: 20px 0 0 0; }
  .crafts-column__img {
    flex: 0 1 60%; }
    @media screen and (max-width: 767px) {
      .crafts-column__img {
        flex: 0 1 100%;
        margin: 40px 0 0 0; } }

/* //////////////////////////////////////////////////////////
    .news-link
////////////////////////////////////////////////////////// */
.news-link {
  margin: 30px auto 0; }
  .news-link__list__item {
    border-bottom: 1px solid #e2e2e2; }
    .news-link__list__item:last-child {
      border-bottom: none; }
    .news-link__list__item a, .news-link__list__item b {
      display: flex;
      column-gap: 2%;
      text-decoration: none;
      font-weight: bold;
      padding: 1.3em 0; }
    .news-link__list__item a {
      transition: opacity 0.3s; }
      .news-link__list__item a .news-link__list__item__title {
        color: #36609e; }
      .news-link__list__item a:hover {
        opacity: 0.6; }
    .news-link__list__item span {
      display: block; }
    .news-link__list__item__date {
      flex: 0 1 13%;
      font-weight: 500;
      color: #8f8f8f; }
    .news-link__list__item__title {
      flex: 0 1 85%; }

/* //////////////////////////////////////////////////////////
    .qa-block
////////////////////////////////////////////////////////// */
.qa-block {
  margin: 40px 0 0 0; }
  .qa-block__list__item {
    background: #fff;
    padding: 1.5em;
    border-radius: 10px;
    font-size: 18px;
    margin: 20px 0 0 0;
    border: 1px solid #d8d8d8;
    line-height: 1.7; }
    .qa-block__list__item:first-child {
      margin: 0 0 0 0; }
    .qa-block__list__item__q {
      display: flex;
      align-items: baseline;
      border-bottom: 1px dashed #d0d0d0;
      padding: 0 0 15px 0;
      font-size: 16px; }
      .qa-block__list__item__q:before {
        content: "Q.";
        display: inline-block;
        margin: 0 0.6em 0 0;
        color: #36609e;
        font-weight: bold;
        font-size: 22px; }
    .qa-block__list__item__a {
      display: flex;
      align-items: baseline;
      color: #D82B4C;
      font-weight: bold;
      margin: 15px 0 0 2em; }
      .qa-block__list__item__a:before {
        content: "A.";
        display: inline-block;
        margin: 0 0.6em 0 0;
        font-size: 22px; }

/* //////////////////////////////////////////////////////////
    .sns-icon
////////////////////////////////////////////////////////// */
.sns-icon {
  margin: 40px 0 0 0; }
  .sns-icon__list {
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 25px; }
    .sns-icon__list__item {
      line-height: 1; }
      .sns-icon__list__item i {
        font-size: 40px; }
      .sns-icon__list__item.item-facebook a {
        display: flex;
        align-items: center;
        gap: 15px;
        text-decoration: none;
        color: #1877f2; }
      .sns-icon__list__item.item-facebook i {
        color: #1877f2; }
      .sns-icon__list__item.item-x i {
        color: #000; }
      .sns-icon__list__item.item-line i {
        color: #00B900;
        font-size: 35px; }
      .sns-icon__list__item.item-instagram i {
        color: #CF2E92; }

/* //////////////////////////////////////////////////////////
    .insta-embed
////////////////////////////////////////////////////////// */
.insta-embed {
  display: flex;
  justify-content: center;
  column-gap: 1%;
  flex-wrap: wrap;
  margin: 30px 0 0 0; }
  .insta-embed li {
    flex: 0 1 24%;
    margin: 10px 0 0 0; }
    @media screen and (max-width: 767px) {
      .insta-embed li {
        flex: 0 1 49%; } }
    .insta-embed li img {
      object-fit: cover;
      aspect-ratio: 1/1; }

/* //////////////////////////////////////////////////////////
    Top - トップページ
////////////////////////////////////////////////////////// */
/* 
    .top-topics
---------------------------------------------------------- */
.top-topics {
  margin: 0 0 80px 0;
  position: relative;
  z-index: 5; }
  .top-topics__list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    .top-topics__list__item {
      flex: 0 1 29.5%; }
      @media screen and (max-width: 767px) {
        .top-topics__list__item {
          flex: 0 1 100%;
          margin: 0 0 30px 0; } }
      .top-topics__list__item a {
        text-decoration: none; }
        .top-topics__list__item a:hover .top-topics__list__item__cap:after {
          transform: translateX(7px); }
      .top-topics__list__item span {
        display: block; }
      .top-topics__list__item__cap {
        text-align: center;
        font-weight: bold;
        color: #36609e;
        margin: 15px 0 0 0;
        line-height: 1; }
        .top-topics__list__item__cap:after {
          font-family: "Font Awesome 6 Free";
          content: '\f061';
          font-weight: 900;
          display: inline-block;
          margin: 0 0 0 0.5em;
          transition: transform 0.5s; }

/* 
    .top-category
---------------------------------------------------------- */
.top-category {
  margin: 30px 0 0 0; }
  .top-category__list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    .top-category__list__item {
      flex: 0 1 32%;
      margin: 2% 0 0 0; }
      @media screen and (max-width: 767px) {
        .top-category__list__item {
          flex: 0 1 100%; } }
      .top-category__list__item__title {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        z-index: 2;
        width: max-content; }
        .top-category__list__item__title:after {
          font-family: "Font Awesome 6 Free";
          content: '\f061';
          font-weight: 900;
          display: inline-block;
          margin: 0 0 0 0.5em;
          transition: transform 0.5s; }
      .top-category__list__item a {
        position: relative;
        overflow: hidden;
        display: block; }
        .top-category__list__item a:after {
          content: "";
          position: absolute;
          top: 0;
          left: 0;
          background: #000;
          opacity: 0.4;
          width: 100%;
          height: 100%;
          transition: opacity 0.6s; }
        .top-category__list__item a:hover img {
          transform: scale(1.2); }
        .top-category__list__item a:hover .top-category__list__item__title:after {
          transform: translateX(10px); }
        .top-category__list__item a:hover:after {
          opacity: 0; }
      .top-category__list__item img {
        transition: transform 0.6s; }

/* 
    .top-other
---------------------------------------------------------- */
.top-other {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1350px;
  margin: 0 auto; }
  @media screen and (max-width: 767px) {
    .top-other {
      flex-wrap: wrap;
      justify-content: center;
      width: 95%; } }
  .top-other__outer {
    padding: 0 0 60px 0; }
  .top-other__box {
    padding: 60px 0;
    flex: 0 1 49.5%;
    background: #000;
    color: #fff;
    position: relative;
    margin: 1% 0 0 0; }
    @media screen and (max-width: 767px) {
      .top-other__box {
        flex: 0 1 100%;
        padding: 40px 0; } }
    .top-other__box__inner {
      position: relative;
      z-index: 2; }
    .top-other__box.box-crafts {
      background: url("../images/top-other__crafts.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box.box-course {
      background: url("../images/top-other__course.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box.box-umbrella {
      background: url("../images/mainvisual__umbrella.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box.box-umbrella_history {
      background: url("../images/mainvisual__umbrella_history.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box.box-umbrella_parts {
      background: url("../images/mainvisual__umbrella_parts.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box.box-umbrella_select {
      background: url("../images/mainvisual__umbrella_select.jpg") no-repeat center;
      background-size: cover; }
    .top-other__box:after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      background: #000;
      opacity: 0.5;
      width: 100%;
      height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-union_member - 組合企業検索
////////////////////////////////////////////////////////// */
.page-union_member .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__union_member.jpg") no-repeat center;
  background-attachment: fixed;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-union_member .page__mainvisual {
      height: 300px;
      background-attachment: inherit; } }

/* //////////////////////////////////////////////////////////
    .page-traditional_crafts - 東京都伝統工芸品東京洋傘とは
////////////////////////////////////////////////////////// */
.page-traditional_crafts .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__traditional_crafts.jpg") no-repeat center;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-traditional_crafts .page__mainvisual {
      height: 300px; } }
  .page-traditional_crafts .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-about - 組合のご紹介
////////////////////////////////////////////////////////// */
.page-about .page__mainvisual {
  background: url("../images/mainvisual__about_us.jpg") no-repeat center;
  background-size: cover;
  position: relative; }
  .page-about .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-about_us_history - 組合の歴史
////////////////////////////////////////////////////////// */
.page-about_us_history .page__mainvisual {
  background: url("../images/mainvisual__about_us_history.jpg") no-repeat center;
  background-size: cover;
  position: relative; }
  @media screen and (max-width: 767px) {
    .page-about_us_history .page__mainvisual {
      height: 300px; } }
  .page-about_us_history .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-umbrella - 傘の使い方、お手入れ方法
////////////////////////////////////////////////////////// */
.page-umbrella .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__umbrella.jpg") no-repeat center;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-umbrella .page__mainvisual {
      height: 300px; } }
  .page-umbrella .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-umbrella_history - 洋傘の歴史
////////////////////////////////////////////////////////// */
.page-umbrella_history .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__umbrella_history.jpg") no-repeat center;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-umbrella_history .page__mainvisual {
      height: 300px; } }
  .page-umbrella_history .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-umbrella_parts - 傘の部品解説
////////////////////////////////////////////////////////// */
.page-umbrella_parts .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__umbrella_parts.jpg") no-repeat center;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-umbrella_parts .page__mainvisual {
      height: 300px; } }
  .page-umbrella_parts .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }

/* //////////////////////////////////////////////////////////
    .page-umbrella_select - 傘の選び方
////////////////////////////////////////////////////////// */
.page-umbrella_select .page__mainvisual {
  height: 450px;
  background: url("../images/mainvisual__umbrella_select.jpg") no-repeat center;
  background-size: cover; }
  @media screen and (max-width: 767px) {
    .page-umbrella_select .page__mainvisual {
      height: 300px; } }
  .page-umbrella_select .page__mainvisual:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    opacity: 0;
    width: 100%;
    height: 100%; }