@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/


/*
Theme Name:az-theme
Author: ri
Description: -
Version: 1.0
*/
body, table {
  font-family: "Open Sans", "Meiryo", sans-serif;
  color: #222222;
}

body {
  background-color: #FFF101;
}

footer {
  color: #ffffff;
  background-color: #EE1D23;
}

div.menubutton {
  background-color: #1D4B9F;
}

div.store-card {
  border-color: #2758A7 !important;
}

div.store-card div.card-title {
  color: #ffffff;
  background-color: #2758A7 !important;
}

h1 {
  color: #2758A7 !important;
  font-size: 1.1em;
  padding: 0.1em;
  margin: 0.1em;
  font-weight: bold;
}

h1.bd-title {
  font-size: 1.5em;
}

/* 縺顔衍繧峨○繧ｻ繧ｯ繧ｷ繝ｧ繝ｳ縺ｮ繧ｹ繧ｿ繧､繝ｫ */
#news-section {
  background-color: #ffffff;
  /* 閭梧勹繧堤區縺ｫ險ｭ螳� */
  margin: 40px 0;
  padding: 20px;
  border: 1px solid #ddd;
  /* 繧ｻ繧ｯ繧ｷ繝ｧ繝ｳ縺ｮ譫�邱壹ｒ阮�＞繧ｰ繝ｬ繝ｼ縺ｫ險ｭ螳� */
  border-radius: 8px;
  /* 隗偵ｒ蟆代＠荳ｸ縺上☆繧� */
}

#news-section h2 {
  font-size: 24px;
  margin-bottom: 20px;
  color: #333;
}

.news-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.news-item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ddd;
  padding: 10px 20px;
  transition: background-color 0.3s ease;
}

.news-item a {
  display: flex;
  align-items: center;
  width: 100%;
  text-decoration: none;
}

.news-item:hover {
  background-color: #f5f5f5;
  /* 繝帙ヰ繝ｼ譎ゅ�閭梧勹濶ｲ */
}

.news-date {
  font-size: 14px;
  color: #333;
  margin-right: 20px;
  white-space: nowrap;
}

.news-category {
  font-size: 14px;
  color: #fff;
  background-color: #2758A7;
  padding: 5px 10px;
  border-radius: 20px;
  margin-right: 20px;
}

.news-title {
  font-size: 16px;
  color: #2758A7;
  flex-grow: 1;
}

/* 謚慕ｨｿ繝壹�繧ｸ蜈ｨ菴薙�繧ｹ繧ｿ繧､繝ｫ */
#single-post {
  background-color: #ffffff;
  /* 閭梧勹繧堤區縺ｫ險ｭ螳� */
  margin: 40px auto;
  padding: 20px;
  border: 1px solid #ddd;
  /* 譫�邱壹ｒ阮�＞繧ｰ繝ｬ繝ｼ縺ｫ險ｭ螳� */
  border-radius: 8px;
  /* 隗偵ｒ蟆代＠荳ｸ縺上☆繧� */
  max-width: 800px;
  /* 譛€螟ｧ蟷�ｒ險ｭ螳� */
}

/* 謚慕ｨｿ繧ｿ繧､繝医Ν縺ｮ繧ｹ繧ｿ繧､繝ｫ */
.post-title {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 20px;
  color: #333;
}

/* 謚慕ｨｿ繝｡繧ｿ諠��ｱ縺ｮ繧ｹ繧ｿ繧､繝ｫ */
.post-meta {
  font-size: 14px;
  color: #777;
  margin-bottom: 20px;
}

.post-meta .post-date,
.post-meta .post-category {
  display: inline-block;
  margin-right: 10px;
}

.post-meta .post-category {
  color: #fff;
  background-color: #2758A7;
  padding: 5px 10px;
  border-radius: 20px;
}

/* 謚慕ｨｿ譛ｬ譁��繧ｹ繧ｿ繧､繝ｫ */
.post-content {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
}

/* 逕ｻ蜒上�繧ｹ繧ｿ繧､繝ｫ */
.post-content img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 20px 0;
}

/* 繝ｪ繝ｳ繧ｯ縺ｮ繧ｹ繧ｿ繧､繝ｫ */
article a {
  color: #0073aa;
  text-decoration: none;
}

article a:hover {
  text-decoration: underline;
}

/* 繝壹�繧ｸ繝阪�繧ｷ繝ｧ繝ｳ縺ｮ繧ｹ繧ｿ繧､繝ｫ */
.post-pagination {
  display: flex;
  justify-content: space-between;
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid #ddd;
}

.post-pagination .prev-post,
.post-pagination .next-post {
  font-size: 14px;
}

.post-pagination a {
  color: #0073aa;
  text-decoration: none;
}

.post-pagination a:hover {
  text-decoration: underline;
}

/* 繝｢繝ｼ繝€繝ｫ縺ｮ繧ｹ繧ｿ繧､繝ｫ */
.modal {
  display: none;
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  /* 閭梧勹繧貞濠騾乗�縺ｮ鮟偵↓險ｭ螳� */
}

.modal-content {
  display: block;
  margin: auto;
  max-width: 80%;
  max-height: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
}

.modal-close {
  position: absolute;
  top: 20px;
  right: 30px;
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  cursor: pointer;
}

.modal-close:hover {
  color: #ccc;
}

/* 繝｡繝�ぅ繧｢繧ｯ繧ｨ繝ｪ�医Ξ繧ｹ繝昴Φ繧ｷ繝門ｯｾ蠢懶ｼ� */
@media (max-width: 768px) {
  article {
    padding: 15px;
  }

  .post-title {
    font-size: 24px;
  }

  article p {
    font-size: 14px;
  }
}