body{
  font-size : 16px;
  font-family : メイリオ, Hiragino Kaku Gothic Pro, sans-serif;
  
}

#wrap{
  width : 1000px;
  padding-top : 20px;
  padding-left : 20px;
  padding-right : 20px;
  padding-bottom :20px;
  margin-left : auto;
  margin-right : auto;
}

.btn-border-bottom{
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 0.25em 0;
  text-decoration: none;
  color: #dc143c;  
}

.btn-border-bottom::before{
  position: absolute;
  content: '';
  width: 100%;
  height: 1px;
  top:100%;
  left: 0;
  border-radius: 4px;
  background:#dc143c;
  transition: .2s;
}

#footer{
  text-align : right;
}.btn-border-bottom:hover:before {
  top: -webkit-calc(100% - 3px);
  top: calc(100% - 3px);
}


#posts artecle{
  padding :0;
  -webkit-text-size-adjust: 100%
}

p.margin-left{
	margin-left: 40px;
}

h2.margin-left{
	margin-left: 40px;
}

p.margin-left-double{
	margin-left: 80px;
}

h2.margin-left-double{
	margin-left: 80px;
}

p.margin-left-half{
	margin-left: 10px;
}

p.margin-left-height{
	margin-left: 40px;
  line-height: 40%
}

.line {
  text-decoration: underline;
}


/* 以下110行までは、外部リンクを表示するためのcss */
.external-link {
  text-decoration: none;
  color: #5a6168;
  font-weight: bold;
  position: relative;
  display: inline-block;
  transition: all 0.3s;
}

/* ↗部分のスタイル */
.external-link::after {
  content: ' ↗';
  display: inline-block;
  color: #5a6168; /* ↗の色をオレンジに変更 */
  font-weight: 900; /* ↗をより太く */
  transition: transform 0.3s;
}

.external-link:hover {
  color: #dc143c;
  transform: translateY(-2px);
}

.external-link:hover::after {
  transform: translate(2px, -2px);
  color: #dc143c; /* ホバー時に矢印の色も少し濃くする */
}

/* 以下139行までは、内部リンクを表示するためのcss */

/* 内部リンクの基本スタイル */
.internal-link {
  text-decoration: none;          /* 通常時は下線なし */
  color: #5a6168;
  font-weight: bold;
  position: relative;
  display: inline-block;
  transition: color 0.3s, transform 0.3s, text-decoration-color 0.3s;
}

/* ↘ 表示を完全にやめる */
/* ::after 自体を削除、もしくは無効化 */
.internal-link::after {
  content: none;
}

/* ホバー時の挙動 */
.internal-link:hover {
  color: #dc143c;                 /* クリムゾンに変更 */
  transform: translateY(-2px);    /* 少し上に動く */
  text-decoration: underline;     /* ホバー時のみ下線表示 */
  text-decoration-color: #dc143c; /* 下線の色もクリムゾン */
}

/* internal-link と external-link を設定した際に文字サイズ変更を防ぐ */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.internal-link,
.external-link {
  font-size: 1em;
}