@charset "UTF-8";

@import url("https://fonts.googleapis.com/css2?family=Spartan:wght@400;700&display=swap");
:root {
  --easing: cubic-bezier(.2, 1, .2, 1);
  --transition: .8s var(--easing);
  --color-base: #f8f8f8;
  --color-gray: #ddd;
  --color-theme: #f5695f;
  --color-theme-darken: #f12617;
  --box-shadow: .8rem .8rem 1.2rem rgba(0, 0, 0, .05), -.8rem -.8rem 1.2rem #fff;
  --box-shadow-hover: 1rem 1rem 1.5rem rgba(0, 0, 0, .08), -1rem -1rem 1.5rem #fff;
  --box-shadow-inset: inset .8rem .8rem 1.2rem rgba(0, 0, 0, .05), inset -.8rem -.8rem 1.2rem #fff;
  --box-shadow-dark: .8rem .8rem 1.2rem rgba(0, 0, 0, .1), -.8rem -.8rem 1.2rem rgba(#fff,.2);
}

.fw-bold-test {
  /* font-weight: bold;
  font-size: 20px;
  color: #f12617; */
}

/*----------------------------------------
	こじまんの部屋
----------------------------------------*/
.travel-history-year {
  min-width: 52px;
}
.travel-history-month {
  min-width: 36px;
}
.travel-history-detail {
  min-width: 36px;
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*600px以下*/
@media screen and (max-width: 600px){
}

/*----------------------------------------
	お役立ち情報フォーム div版
----------------------------------------*/
.helpful-form-div {
  display: flex;
  flex-direction: column;
}

.helpful-form-div .form-div-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 25px 0;
  gap: 10px;
  border-bottom: 1px dashed #ccc;
}

.helpful-form-div .form-div-row:first-child {
  border-top: 1px dashed #ccc;
}

.form-div-row-label {
  width: 30%;
}

.form-div-row-input {
  width: 70%;
}

.pic-group-area-group-input .form-div-row-label {
  width: 25%;
}

.pic-group-area-group-input .form-div-row-input {
  width: 75%;
}

.form-div-row.required .inputLabel {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.input_placeholder {
  font-size: 16px;
}

/* 旅行日程 */
.form-div-row-input .inputField_parallel {
  display: flex;
  flex-direction: row;
}

.form-div-row-input .inputField_parallel_label {
  width: 12%;
}

.form-div-row-input .inputField_parallel_input {
  width: 88%;
}

/* 写真グループ */
.form-div-row-pic-group {
  margin-bottom: 25px;
  padding: 25px 0;
  border-bottom: 1px dashed #ccc;
}
.helpful-form-div .row-pic-group1 {
  margin-bottom: 0;
}

/* アコーディオン対応 */
.pic-group-contents-area {
  display: none;
}

.pic-group-title {
  transition: background .3s ease;
  cursor: pointer;
  position: relative;
}

.pic-group-title::before,
.pic-group-title::after{
  position:absolute;
  content:'';
  top:1px;
  right:20px;
  bottom:0;
  width:12px;
  height:2px;
  margin:auto;
  background:#151E2F;
}
.pic-group-title::after{
  transform:rotate(-90deg);
  transition:transform 0.3s;
}
.pic-group-title.active::after{transform:rotate(0deg);}

/* hover */
.pic-group-title:hover {
  background-color: #F2F2F2;
}

/* 写真グループ表題 */
.form-div-row-pic-group-row.pic-group-title-explanation {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 25px 0;
  gap: 10px;
}

.form-div-row-pic-group-row.pic-group-area {
  width: 95%;
  margin-left: auto;
}

.pic-group-area-group-title {
  display: flex;
  flex-direction: column;
  padding-top: 25px;
  padding-bottom: 25px;
}

.pic-group-area-group {
  border-top: 1px dashed #ccc;
  border-bottom: 1px dashed #ccc;
}

.pic-group-area-group-title .form-div-row-label,
.pic-group-area-group-title .form-div-row-input {
  width: 100%;
}

.pic-group-area-group-input {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-bottom: 25px;
}

.form-div.helpful-form.button-wrap {
  margin-top: 50px;
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*600px以下*/
@media screen and (max-width: 600px){
  /*必要ならばここにコードを書く*/
  .helpful-form-div .form-div-row {
    flex-direction: column;
  }
  .form-div-row-label {
    width: 100%;
  }
  .form-div-row-input {
    width: 100%;
  }

  .form-div-row-pic-group-row.pic-group-title-explanation {
    flex-direction: column;
  }

  .pic-group-area-group-input {
    flex-direction: column;
  }
  .pic-group-area-group-input .form-div-row-label {
    width: 100%;
  }
  .pic-group-area-group-input .form-div-row-input {
    width: 100%;
  }

  .form-div-row-input textarea {
    min-height: initial;
    height: 90px !important;
  }

  .pic-group-area-group-input textarea {
    min-height: initial;
    height: 90px !important;
  }

  .form-div-row-input .inputField_parallel_label {
  width: 15%;
}

.form-div-row-input .inputField_parallel_input {
  width: 85%;
}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}


/*----------------------------------------
	お役立ち情報フォーム table版
----------------------------------------*/
/* お役立ち情報フォーム */
.helpful-form-table {
  /* font-size: 1em; */
}

.mw_wp_form {
  margin-bottom: 100px;
}

.helpful-form-table th {
  text-align: left;
  width: 28%;
}

.helpful-form-table th .inputLabel_require {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.helpful-form-table th,
.helpful-form-table td {
  padding: 0.6em 0.7em;
  font-size: 1rem;
  /* font-size: 2rem; */
}

.helpful-form-table td {
  background-color: white;
}

.helpful-form {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

.helpful-form input {
  width: 15%;
}

.helpful-form button {
  padding: 8px 18px;
  width: auto;
  /* width: 15%; */
}

/*必須ラベル*/
.require {
  display: inline-block;
  /* margin-left: 5px; */
  margin-top: -3px;
  padding: 0 5px;
  background: #37952F;
  color: #fff;
  font-weight: normal;
  font-size: 11px;
  vertical-align: middle;
}

.inputField_parallel {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px
}

.inputField_parallel_label {
  width: 60px;
}


@media screen and (max-width: 767px) {
  .helpful-form-table,
  .helpful-form-table tbody,
  .helpful-form-table tr,
  .helpful-form-table th,
  .helpful-form-table td {
    display: block;
  }

  .helpful-form-table th {
    width: 100%;
  }
}

/* トップページ */
/*----------------------------------------
	メインビジュアル
----------------------------------------*/
.main-visual {
  margin-top: 8px;
}

.main-visual-img {
  position: relative;
  overflow: hidden;
  height: 215px;
  /* height: 600px; */
}

.main-visual-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 767px) {
  .main-visual-img {
    height: 110px;
  }

  .main-visual {
    margin-top: 8px;
  }
}


/* 新着タブ */
/*----------------------------------------
	Tab
----------------------------------------*/
.tabs {
  margin-bottom: 30px;
}

.tabs .tab-list {
  display: flex;
  gap: 5px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.tabs .tab-list li {
  margin: 0;
}
.tabs .tab {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  bottom: -1px;
  margin: 0;
  padding: 10px 20px;
  border-radius: 4px 4px 0 0;
  border: 1px solid #ddd;
  background: #f2f2f2;
  cursor: pointer;
}
.tabs .tab.is-active {
  background: #fff;
  border-bottom: 1px solid #fff;
}

.tabs .tab-panel {
  padding: 0;
}

.tabs .tab-panel .archive_list {
  list-style: none;
  padding: 10px;
  margin: 0;
}


/*----------------------------------------
	Tabパネル
----------------------------------------*/
.tab-panel {
  display: none;
  padding: 30px;
  border: 1px solid #ddd;
}
.tab-panel.is-active {
  display: block;
}

/* コンテンツ */
.media {
  display: flex;
  flex-direction: row;
  gap: 10px;
  /* align-items: center; */
  padding: 20px 0;
  color: inherit;
  text-decoration: none;
  transition: color .3s;
}

.archive_list li:not(:first-child) {
  /* border-top: 1px solid #e7e7e7; */
}

.media__body {
  /* font-size: 14px; */
}

.kojiman_title_area {
  display: flex;
  flex-direction: row;
  gap: 5px;
  flex-direction: row;
  align-items: center;
}

.kojiman_cate {
  list-style: none;
  padding: 0;
}

/* .kojiman_cate_title {
  display: flex;
  flex-direction: row;
  justify-content: start;
  gap: 5px;
} */
.kojiman_cate_list {
  margin: 0 !important;
}
.kojiman_cate_list a {
  display: inline-block;
  text-decoration: none;

  padding: 5px;
  background-color: #8ec54a;
  color: white;
  padding-top: 0;
  padding-bottom: 0;
}

.kojiman_cate_list_helpful a {
  background-color: #f3631b;
}


/* 2025.11.8 から編集 */
.kojiman_stadium_news {
  display: flex;
  flex-direction: row;
  gap: 5px;
}

.kojiman_news {
  width: 50%;
}

.kojiman_news ul,
.kojiman_yaneura_news_area ul,
.kojiman_news ul li {
  padding: 0;
  margin: 0;
}

.kojiman_news ul,
.kojiman_yaneura_news_area ul {
  list-style: none;
  border-top: 2px dotted rgb(238, 238, 238);
}

.kojiman_news_area a {
  text-decoration: none;
  color: rgb(51, 51, 51);
}

.kojiman_news_media_link {
  display: flex;
  gap: 6px;
  padding: 12px 8px;
  border-bottom: 2px dotted rgb(238, 238, 238);
}

.media__thumb {
  position: relative;
  transition: .3s;
  width: 120px;
  height: 80px;
  overflow: hidden;
  /* flex-shrink: 0; */
}

.media__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.media__body {
  width: calc(100% - 120px);
}

.kojiman_cate_title {
  display: flex;
  flex-direction: column;
  justify-content: start;
}

/* .kojiman_cate_title_area {
  display: flex;
  flex-direction: row;
  align-items: center;
} */

.new_icon {
  display: inline-block;
  width: 26px;
  position: relative;
  top: -1px;
}
.new_icon::after {
  display        : inline-block;       /* インラインボックス定義  */
  margin         : 0 auto;
  content        : "NEW";              /* 表示する文字            */
  background     : #ff0000;            /* 背景色                  */
  color          : #ffffff;            /* 文字色                  */
  font-weight    : bold;               /* 太字                    */
  font-size      : 10pt;               /* ベースの文字サイズ      */
  letter-spacing : -1px;               /* 文字間隔詰め            */
  line-height    : 1;                  /* 1行の高さ               */
  vertical-align : top;                /* 基準の高さ位置          */
  margin         : 0;                  /* 外余白なし              */
  padding        : 2px;                /* 反転時の内余白          */
  transform      : scale(0.6)          /* 文字サイズ変更          */
                   translateX(-30%);    /* 横位置調整              */
                                       /* ブリンクのアニメ指定    */
  animation      : newAnime .7s infinite alternate;
}
@keyframes newAnime {
   0% { color      : #ff0000;          /* ブリンク時の文字色      */
        background : #ffffff;          /* ブリンク時の背景色      */
      }
 100% { color      : #ffffff;          /* ブリンク時の文字色      */
        background : #ff0000;          /* ブリンク時の背景色      */
      }
}

.kojiman_cate_title .kojiman_cate_title_title {
  font-size: 16px;
  line-height: 16px;
}

.kojiman_cate_title .new-entry-card-post-date,
.kojiman_cate_title .popular-entry-card-update-date {
  font-size: 11.2px;
  line-height: 11.2px;
}

.kojiman_cate_title .new-entry-card-date .entry-date {
  margin-left: -1px;
}

/* 投稿フォーム */
.contact-btn2 {
  display: inline-block;
  padding: 14px 28px;
  background: #007aff;
  color: white;
  border-radius: 12px;
  text-decoration: none;
  font-size: 16px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.contact-btn2:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 16px rgba(0,0,0,0.15);
}

.contact-btn3 {
  display: inline-block;
  padding: 10px 24px;
  border: 1px solid #aaa;
  color: #333;
  border-radius: 8px;
  text-decoration: none;
  font-size: 14px;
  letter-spacing: 0.5px;
  transition: 0.3s;
}
.contact-btn3:hover {
  border-color: #333;
  color: #000;
  background: #f5f5f5;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
  
  /* 新着タブ */
  /* コンテンツ */
  .media {
    flex-direction: column;
  }
  .kojiman_title_area {
    flex-direction: column;
    align-items: start;
  }
  .kojiman_cate_title {
    flex-direction: column;
  }
  .kojiman_cate {
    padding-left: 0 !important;
  }

  .kojiman_stadium_news {
    flex-direction: column;
    gap: 1.8em;
  }

  .kojiman_news {
    width: 100%;
  }
  .kojiman_news .has-text-align-center {
    margin-bottom: 1.8em;
  }

}

/*600px以下*/
@media screen and (max-width: 600px){
  /*必要ならばここにコードを書く*/
  .helpful-form-table th,
  .helpful-form-table td {
    font-size: 2rem;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}