@charset "UTF-8";

/* 企画形態選択ページ (application/index.php, index_Xcard1-7.php) 専用。
   common_general.css の上に読み込む。 */

/* --- 本文の基本規則（旧 page-form.css より） ---
   main 配下（サイドバー .main_left と本文 .main_right）だけに効かせる。
   「main p」のように要素セレクタで囲むこと。.main_right p のようにクラスで囲むと
   詳細度が上がり、共通 CSS の単一クラス規則（.link、表セルの .date など）を逆転する。
   img はサイドバーのバナーの幅指定でもある（.adsbygoogle 用の CSS は他に無い）。
   旧 page-guide.css の裸の img がヘッダー・フッターのアイコンにも効いていたので裸のまま。 */

img {
  pointer-events: none;
  width: 100%;
}

main p {
  text-align: justify;
}


/* --- ここからページ固有 --- */

.select_header {
  padding: 5px;
  background-color: var(--themevintage);
}

.select_header p {
  font-size: 15px;
  text-align: center;
  padding: 10px 0px;
  margin: 0 auto;
  color: var(--white);
}

.category-wrap {
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 20px;
}

.category-wrap p {
  text-align: center;
  padding: 0;
  line-height: 1.5em;
}

.category {
  width: calc((100% - 20px) / 2);
  box-sizing: border-box;
  padding: 10px;
}

.category:hover>p {
  color: var(--white);
}

.category_booth {
  border: 1px solid var(--booth);
}

.category_booth:hover {
  background-color: var(--booth);
}

.category_booth p {
  color: var(--booth);
}

.category_sympo {
  border: 1px solid var(--sympo);
}

.category_sympo:hover {
  background-color: var(--sympo);
}

.category_sympo p {
  color: var(--sympo);
}

.category_indoor {
  border: 1px solid var(--indoor);
}

.category_indoor:hover {
  background-color: var(--indoor);
}

.category_indoor p {
  color: var(--indoor);
}

.category_stage {
  border: 1px solid var(--stage);
}

.category_stage:hover {
  background-color: var(--stage);
}

.category_stage p {
  color: var(--stage);
}

.category_field {
  border: 1px solid var(--field);
}

.category_field:hover {
  background-color: var(--field);
}

.category_field p {
  color: var(--field);
}

.category_decoration {
  border: 1px solid var(--decoration);
}

.category_decoration:hover {
  background-color: var(--decoration);
}

.category_decoration p {
  color: var(--decoration);
}

.category-name1 {
  font-size: 18px;
  font-weight: 500;
}

.category-name2 {
  font-size: 14px;
}

/* --- リンク --- */

.linkwrap a {
  position: relative;
  font-weight: 500;
}

.linkwrap a:hover {
  opacity: 0.5;
  cursor: pointer;
}

.linkwrap {
  display: flex;
  margin-top: 5%;
}

.linkwrap div {
  width: 100%;
  display: flex;
  justify-content: center;
}

.linkwrap div:hover {
  opacity: 0.5;
}

.linkwrap a {
  display: flex;
  position: relative;
  font-weight: bold;
  z-index: 2;
  align-items: center;
  font-size: 13px;
}

.triangle {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 9px solid var(--themevintage);
  border-right: 0;
  transform: translateY(-35%);
  margin-top: 10.5px;
  margin-left: 2px;
}