@charset "UTF-8";
/*============================================
responsive
============================================*/
/*============================================
#main
============================================*/
#view {
  max-width: 1600px;
  margin: 0 auto;
  z-index: 10;
  position: relative;
  text-align: center; }

.headline .headline__box {
  max-width: 680px;
  margin: -100px auto 0 auto;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  padding: 30px 60px;
  border-radius: 25px;
  background-image: linear-gradient(-45deg, #f5fbfa 50%, #fff 50%);
  position: relative;
  z-index: 5; }
  @media screen and (max-width: 897px) {
    .headline .headline__box {
      margin: -60px 20px 0 20px;
      padding: 20px; } }
  .headline .headline__box h2 {
    text-align: center;
    font-size: 2.5rem;
    padding: 0 0 30px 0;
    font-family: tbudrgothic-std, sans-serif;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 2px; }
    @media screen and (max-width: 897px) {
      .headline .headline__box h2 {
        font-size: 2.0rem;
        padding: 0 0 15px 0; } }
    .headline .headline__box h2 span {
      display: block;
      font-family: "Times New Roman", Times, "serif";
      font-size: 1.5rem;
      font-style: italic;
      color: #4ec0af; }
      @media screen and (max-width: 897px) {
        .headline .headline__box h2 span {
          font-size: 1.4rem; } }

/*============================================
#news
============================================*/
#news {
  padding: 100px 0 120px 0; }
  @media screen and (max-width: 897px) {
    #news {
      padding: 30px 0 60px 0; } }
  #news .news__headline {
    text-align: center; }
    #news .news__headline h2 {
      font-family: "Times New Roman", Times, "serif";
      font-size: 4.0rem;
      font-style: italic;
      font-weight: 400;
      position: relative;
      line-height: 1.6; }
      @media screen and (max-width: 897px) {
        #news .news__headline h2 {
          font-size: 3.0rem; } }
      #news .news__headline h2 span {
        display: block;
        font-size: 1.4rem;
        line-height: 1;
        font-family: tbudrgothic-std, sans-serif;
        font-weight: 700;
        font-style: normal;
        letter-spacing: 2px; }
      #news .news__headline h2 :before {
        position: absolute;
        bottom: -30px;
        left: calc(50% - 50px);
        width: 100px;
        height: 2px;
        content: '';
        background: linear-gradient(-90deg, #efa008, #4ec0af); }
  #news .news__box {
    max-width: 800px;
    margin: 80px auto 0 auto; }
    @media screen and (max-width: 897px) {
      #news .news__box {
        margin: 40px 20px 50px 20px; } }
    #news .news__box .tab .tab__list {
      display: flex;
      justify-content: center; }
      @media screen and (max-width: 897px) {
        #news .news__box .tab .tab__list {
          flex-wrap: wrap; } }
      #news .news__box .tab .tab__list .tab__list__item {
        font-size: 1.4rem;
        padding: 0 0.8rem;
        font-family: tbudrgothic-std, sans-serif;
        font-weight: 400;
        font-style: normal; }
    #news .news__box .news {
      padding: 30px 0 0 0; }
      @media screen and (max-width: 897px) {
        #news .news__box .news {
          padding: 15px 0 0 0; } }
      #news .news__box .news .news__list .news__list__item {
        margin: 0 0 10px 0;
        display: flex;
        align-items: center; }
        #news .news__box .news .news__list .news__list__item p {
          display: inline-block; }
          #news .news__box .news .news__list .news__list__item p.date {
            line-height: 1;
            margin: 0 10px 0 0;
            width: 12%; }
            @media screen and (max-width: 897px) {
              #news .news__box .news .news__list .news__list__item p.date {
                width: 20%; } }
          #news .news__box .news .news__list .news__list__item p.category {
            width: 20%;
            margin: 0 10px 0 0;
            padding: 2px 0;
            text-align: center;
            border: 1px solid #222;
            background: #fff;
            font-size: 1.3rem;
            line-height: 1; }
            @media screen and (max-width: 897px) {
              #news .news__box .news .news__list .news__list__item p.category {
                width: 50%;
                text-align: left;
                border: none;
                background: none; } }
          #news .news__box .news .news__list .news__list__item p.cnt {
            line-height: 1;
            margin: 0 10px 0 0;
            width: 55%;
            display: inline-flex; }
            @media screen and (max-width: 897px) {
              #news .news__box .news .news__list .news__list__item p.cnt {
                width: 90%; } }
        #news .news__box .news .news__list .news__list__item a {
          padding: 20px 10px;
          width: 100%;
          display: block;
          background: #fffcf7 url("../img/common/arw.png");
          background-repeat: no-repeat;
          background-position: center right 3%;
          transition: 0.7s; }
          @media screen and (max-width: 897px) {
            #news .news__box .news .news__list .news__list__item a {
              padding: 10px 10px; } }
          #news .news__box .news .news__list .news__list__item a:hover {
            background: #f4f4f4 url("../img/common/arw.png");
            background-repeat: no-repeat;
            background-position: center right 1.5%; }
  #news .news__btn {
    text-align: center;
    margin: 60px 0 0 0; }
    @media screen and (max-width: 897px) {
      #news .news__btn {
        margin: 30px 0 0 0; } }
    #news .news__btn a {
      font-weight: bold;
      background: url("../img/common/arw.png");
      background-repeat: no-repeat;
      background-position: center right 6%;
      border: 2px solid #ccc;
      border-image: linear-gradient(to right, #efa008 0%, #4ec0af 100%);
      border-image-slice: 1;
      padding: 2rem 8rem;
      transition: 0.5s; }
      #news .news__btn a:hover {
        background: #f4f4f4 url("../img/common/arw.png");
        background-repeat: no-repeat;
        background-position: center right 3%; }

/*============================================
#about
============================================*/
#about {
  padding: 60px 0;
  background: url("../img/index/about-bg.jpg") no-repeat center center/cover;
  background-attachment: fixed; }
  @media screen and (max-width: 897px) {
    #about {
      padding: 40px 20px;
      background: url("../img/index/about-bg.jpg") no-repeat center top/cover; } }
  #about .inner {
    max-width: 1140px;
    margin: 0 auto; }
    #about .inner .about__box {
      display: flex;
      justify-content: space-between; }
      #about .inner .about__box .about__box__item {
        text-align: center;
        width: calc(100% / 2);
        transition: 0.5s; }
        @media screen and (max-width: 897px) {
          #about .inner .about__box .about__box__item {
            width: 42%; } }
        #about .inner .about__box .about__box__item:first-of-type, #about .inner .about__box .about__box__item:last-of-type {
          border-right: 1px solid #fff;
          border-left: 1px solid #fff; }
          @media screen and (max-width: 897px) {
            #about .inner .about__box .about__box__item:first-of-type, #about .inner .about__box .about__box__item:last-of-type {
              border-right: none;
              border-left: none; } }
        #about .inner .about__box .about__box__item p {
          text-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
          text-align: center; }
        #about .inner .about__box .about__box__item h3 {
          font-size: 1.6rem;
          font-family: tbudrgothic-std, sans-serif;
          font-weight: 400;
          font-style: normal;
          letter-spacing: 2px;
          line-height: 1.6;
          text-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
          padding: 40px 0 0 0; }
          @media screen and (max-width: 897px) {
            #about .inner .about__box .about__box__item h3 {
              padding: 20px 0 0 0;
              font-size: 1.2rem;
              letter-spacing: 0; } }
          #about .inner .about__box .about__box__item h3 span {
            font-family: "Times New Roman", Times, "serif";
            font-style: italic;
            font-size: 3.6rem;
            font-weight: 400;
            line-height: 1;
            padding: 0 0 0.5rem 0;
            display: block; }
            @media screen and (max-width: 897px) {
              #about .inner .about__box .about__box__item h3 span {
                display: none; } }
        #about .inner .about__box .about__box__item a {
          color: #fff; }
        #about .inner .about__box .about__box__item:hover {
          opacity: 0.7; }

/*============================================
#business
============================================*/
#business {
  padding: 100px 0; }
  @media screen and (max-width: 897px) {
    #business {
      padding: 30px 0 40px; } }
  #business .business__headline {
    text-align: center;
    padding: 0 0 80px 0; }
    @media screen and (max-width: 897px) {
      #business .business__headline {
        padding: 0 0 60px 0; } }
    #business .business__headline h2 {
      font-family: "Times New Roman", Times, "serif";
      font-size: 4.0rem;
      font-style: italic;
      font-weight: 400;
      position: relative;
      line-height: 1.6; }
      @media screen and (max-width: 897px) {
        #business .business__headline h2 {
          font-size: 3.0rem; } }
      #business .business__headline h2 span {
        display: block;
        font-size: 1.4rem;
        line-height: 1;
        font-family: tbudrgothic-std, sans-serif;
        font-weight: 700;
        font-style: normal;
        letter-spacing: 2px; }
      #business .business__headline h2 :before {
        position: absolute;
        bottom: -30px;
        left: calc(50% - 50px);
        width: 100px;
        height: 2px;
        content: '';
        background: linear-gradient(-90deg, #efa008, #4ec0af); }
  #business .business__box {
    display: flex;
    max-width: 1140px;
    margin: 0 auto; }
    @media screen and (max-width: 897px) {
      #business .business__box {
        display: block; } }
    #business .business__box .business__box__item {
      max-width: 520px;
      padding: 60px;
      background: #fff;
      border-radius: 10px;
      box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; }
      @media screen and (max-width: 897px) {
        #business .business__box .business__box__item {
          padding: 15px;
          margin: 0 20px; } }
      #business .business__box .business__box__item p:not(:last-of-type) {
        padding: 0 0 15px 0; }
        @media screen and (max-width: 897px) {
          #business .business__box .business__box__item p:not(:last-of-type) {
            padding: 0 0 8px 0; } }
      #business .business__box .business__box__item h3 {
        font-size: 2.5rem;
        position: relative;
        margin: 0 0 60px 0;
        font-family: tbudrgothic-std, sans-serif;
        font-weight: 700;
        font-style: normal;
        letter-spacing: 3px; }
        @media screen and (max-width: 897px) {
          #business .business__box .business__box__item h3 {
            font-size: 2.0rem;
            margin: 0 0 40px 0; } }
        #business .business__box .business__box__item h3::after {
          position: absolute;
          content: "";
          width: 100px;
          height: 2px;
          background-color: #efa008;
          left: 0;
          bottom: -20px;
          text-align: left; }
      #business .business__box .business__box__item .business__btn {
        text-align: right;
        margin: 60px 0 0 0; }
        @media screen and (max-width: 897px) {
          #business .business__box .business__box__item .business__btn {
            text-align: center;
            margin: 40px 0 25px 0; } }
        #business .business__box .business__box__item .business__btn a {
          font-weight: bold;
          background: url("../img/common/arw.png");
          background-repeat: no-repeat;
          background-position: center right 6%;
          border: 2px solid #ccc;
          border-image: linear-gradient(to right, #efa008 0%, #4ec0af 100%);
          border-image-slice: 1;
          padding: 2rem 8rem;
          transition: 0.5s; }
          @media screen and (max-width: 897px) {
            #business .business__box .business__box__item .business__btn a {
              padding: 2rem 6rem; } }
          #business .business__box .business__box__item .business__btn a:hover {
            background: #e4e4e4 url("../img/common/arw.png");
            background-repeat: no-repeat;
            background-position: center right 3%; }
  #business .zaitaku {
    position: relative;
    padding: 80px 0;
    z-index: 1; }
    @media screen and (max-width: 897px) {
      #business .zaitaku {
        padding: 200px 0 0 0; } }
    #business .zaitaku::after {
      content: '';
      top: 0;
      left: 0;
      width: 60%;
      height: 100%;
      position: absolute;
      background: url("../img/index/business-bg-01.jpg");
      background-size: cover;
      z-index: -1; }
      @media screen and (max-width: 897px) {
        #business .zaitaku::after {
          width: 100%;
          height: 300px; } }
    #business .zaitaku .business__box {
      justify-content: flex-end; }
  #business .tashokushu {
    position: relative;
    padding: 80px 0;
    z-index: 1; }
    @media screen and (max-width: 897px) {
      #business .tashokushu {
        padding: 200px 0 0 0;
        margin: 40px 0 0 0; } }
    #business .tashokushu::after {
      content: '';
      top: 0;
      right: 0;
      width: 60%;
      height: 100%;
      position: absolute;
      background: url("../img/index/business-bg-02.jpg");
      background-size: cover;
      z-index: -1; }
      @media screen and (max-width: 897px) {
        #business .tashokushu::after {
          width: 100%;
          height: 300px; } }
  #business .jigyou {
    position: relative;
    padding: 80px 0;
    z-index: 1; }
    @media screen and (max-width: 897px) {
      #business .jigyou {
        padding: 200px 0 0 0;
        margin: 40px 0 0 0; } }
    #business .jigyou::after {
      content: '';
      top: 0;
      left: 0;
      width: 60%;
      height: 100%;
      position: absolute;
      background: url("../img/index/business-bg-03.jpg");
      background-size: cover;
      z-index: -1; }
      @media screen and (max-width: 897px) {
        #business .jigyou::after {
          width: 100%;
          height: 300px; } }
    #business .jigyou .business__box {
      justify-content: flex-end; }
  #business .guideline {
    position: relative;
    padding: 80px 0;
    z-index: 1; }
    @media screen and (max-width: 897px) {
      #business .guideline {
        padding: 200px 0 0 0;
        margin: 40px 0 0 0; } }
    #business .guideline::after {
      content: '';
      top: 0;
      right: 0;
      width: 60%;
      height: 100%;
      position: absolute;
      background: url("../img/index/business-bg-04.jpg");
      background-size: cover;
      z-index: -1; }
      @media screen and (max-width: 897px) {
        #business .guideline::after {
          width: 100%;
          height: 300px; } }

/*============================================
#event
============================================*/
#event {
  padding: 0 0 120px 0;
  position: relative; }
  @media screen and (max-width: 897px) {
    #event {
      padding: 0 0 40px 0; } }
  #event::before {
    content: "";
    width: 70%;
    height: 300px;
    background: #fccc24 url("../img/index/event-bg.png");
    background-size: cover;
    position: absolute;
    top: 130px; }
    @media screen and (max-width: 897px) {
      #event::before {
        width: 100%;
        height: 250px;
        background-position: top; } }
  #event .event__headline {
    text-align: center;
    padding: 0 0 80px 0; }
    #event .event__headline h2 {
      font-family: "Times New Roman", Times, "serif";
      font-size: 4.0rem;
      font-style: italic;
      font-weight: 400;
      position: relative;
      line-height: 1.6; }
      @media screen and (max-width: 897px) {
        #event .event__headline h2 {
          font-size: 3.0rem; } }
      #event .event__headline h2 span {
        display: block;
        font-size: 1.4rem;
        line-height: 1;
        font-family: tbudrgothic-std, sans-serif;
        font-weight: 700;
        font-style: normal;
        letter-spacing: 2px; }
      #event .event__headline h2 :before {
        position: absolute;
        bottom: -30px;
        left: calc(50% - 50px);
        width: 100px;
        height: 2px;
        content: '';
        background: linear-gradient(-90deg, #efa008, #4ec0af); }
  #event .event__box {
    position: relative;
    max-width: 1140px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 897px) {
      #event .event__box {
        margin: 40px 20px 0 20px;
        flex-wrap: wrap; } }
    #event .event__box .event__box__item {
      background: #fff;
      width: 20%;
      box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
      padding: 5px;
      border-radius: 15px;
      transition: 0.5s; }
      @media screen and (max-width: 897px) {
        #event .event__box .event__box__item {
          width: 46%;
          margin: 0 0 3% 0; } }
      #event .event__box .event__box__item figure {
        padding: 0 !important;
        margin: 0 !important;
        z-index: 5; }
        #event .event__box .event__box__item figure figcaption {
          font-size: 1.3rem;
          font-weight: bold;
          text-align: center;
          max-width: 90%;
          padding: 5px;
          margin: -36px auto -2px auto;
          z-index: 10; }
          @media screen and (max-width: 897px) {
            #event .event__box .event__box__item figure figcaption {
              max-width: 100%;
              padding: 0;
              margin: 0;
              font-size: 1.2rem; } }
          #event .event__box .event__box__item figure figcaption span {
            display: inline-block;
            width: 90%;
            padding: 10px 10px 0 10px;
            border-radius: 15px 15px 0 0;
            background: #fff url(../img/common/arw.png);
            background-repeat: no-repeat;
            background-position: top 65% right 6%; }
            @media screen and (max-width: 897px) {
              #event .event__box .event__box__item figure figcaption span {
                width: 100%;
                background: #fff;
                padding: 5px 0 0 0;
                border-radius: 0; } }
      #event .event__box .event__box__item:hover {
        opacity: 0.9; }

.tab-area {
  display: flex;
  justify-content: space-around;
  cursor: pointer; }
  @media screen and (max-width: 897px) {
    .tab-area {
      flex-wrap: wrap; } }
  .tab-area .tab {
    text-align: center;
    color: #999; }
    @media screen and (max-width: 897px) {
      .tab-area .tab {
        width: 33%;
        margin: 2% 0; } }
  .tab-area .tab.active {
    font-weight: bold;
    color: #222; }

.content-area {
  text-align: center; }
  @media screen and (max-width: 897px) {
    .content-area {
      text-align: left; } }
  .content-area .content {
    display: none; }
  .content-area .content.show {
    display: block; }

/* ラッパーを整える */
.filter-area {
  text-align: center;
  margin-bottom: 20px;
  font-size: 16px; }

/* セレクトボックスをカスタム */
#category-filter {
  appearance: none;
  /* 初期の矢印非表示（モダンブラウザ） */
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 8px 12px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #fff;
  background-image: url("data:image/svg+xml;utf8,<svg fill='gray' height='16' viewBox='0 0 24 24' width='16' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px 12px;
  cursor: pointer;
  transition: border-color 0.3s ease; }

#category-filter:hover,
#category-filter:focus {
  border-color: #666;
  outline: none; }

.post-item a {
  margin: 5px 0 0 0;
  padding: 20px 10px;
  width: 100%;
  display: block;
  background: #fffcf7 url("../img/common/arw.png");
  background-repeat: no-repeat;
  background-position: center right 3%;
  transition: 0.7s; }

@media screen and (max-width: 897px) {
  .post-item a {
    padding: 10px 10px;
    box-sizing: border-box; } }
.post-item a:hover {
  background: #f4f4f4 url("../img/common/arw.png");
  background-repeat: no-repeat;
  background-position: center right 1.5%; }

.post-item .date {
  color: #666;
  font-size: 1.5rem; }

.post-item .cnt {
  font-weight: 700; }

/*============================================
  ADD SCSS 2025.06.30
============================================*/
#news .news__headline h2 :before {
  background: linear-gradient(-90deg, #4e9ac0, #7ad6de); }

#news .news__btn a {
  font-weight: bold;
  background: url(../img/common/arw.png);
  background-repeat: no-repeat;
  background-position: center right 6%;
  border: 2px solid #ccc;
  border-image: linear-gradient(to right, #7ad6de 0%, #4e9ac0 100%);
  border-image-slice: 1;
  padding: 2rem 8rem;
  transition: 0.5s; }

/*============================================
  ADD SCSS 2025.07.11
============================================*/
#about {
  background: linear-gradient(269deg, rgba(124, 199, 238, 0.7) 24%, rgba(126, 201, 240, 0.7) 40%, rgba(115, 190, 229, 0.7) 57%, rgba(126, 201, 240, 0.7) 79%), url(../img/common/view__box-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }

.hero {
  width: 100%;
  height: calc(100vh - 90px);
  overflow: hidden;
  position: relative; }

.hero img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: none; }

.hero img.pc {
  display: block; }

@media screen and (max-width: 768px) {
  .hero {
    height: auto;
    position: relative; }

  .hero img {
    position: static;
    width: 100%;
    height: auto;
    object-fit: contain;
    display: none; }

  .hero img.sp {
    display: block; } }