@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* 検索UI */
.guild-search-box{
  margin-bottom:20px;
}

.guild-search-row{
  display:flex;
  gap:10px;
}

.guild-search-row input{
  flex:1;
  padding:10px;
  font-size:16px;
}

.btn-search{
  padding:10px 20px;
  font-size:16px;
  background:#2b7cff;
  color:#fff;
  border:none;
  border-radius:6px;
  cursor:pointer;
}

.btn-search:hover{
  background:#1e63cc;
}

.guild-search-clear{
  margin-top:8px;
}

.guild-search-clear a{
  display:inline-block;
  padding:8px 16px;
  font-size:14px;
  background:#999;
  color:#fff;
  border-radius:6px;
  text-decoration:none;
}

/* 操作ボタン */

.btn-edit{
  display:inline-block;
  padding:6px 14px;
  background:#2b7cff;
  color:#fff;
  border-radius:5px;
  text-decoration:none;
  font-size:14px;
}

.btn-delete{
  display:inline-block;
  padding:6px 14px;
  background:#e53935;
  color:#fff;
  border-radius:5px;
  text-decoration:none;
  font-size:14px;
}

.btn-edit:hover{
  background:#1e63cc;
}

.btn-delete:hover{
  background:#c62828;
}

.guild-search-clear button{
  padding:8px 18px;
  font-size:14px;
  background:#777;
  color:white;
  border:none;
  border-radius:6px;
  cursor:pointer;
}

.guild-search-clear button:hover{
  background:#555;
}

/* 追加・更新ボタン */

input[type="submit"].btn-main-dc{
  display:inline-block !important;
  width:auto !important;
  padding:8px 16px;
  background-color:#16a81d !important;
  color:#ffffff !important;
  border:none;
  border-radius:6px;
  font-size:14px;
  font-weight:bold;
  cursor:pointer;
}

/* マウスオン */

input[type="submit"].btn-main-dc:hover{
  background-color:#27682a !important;
  color:#d32f2f !important;
}

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

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

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