@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
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* タイトル部分 */
h1{
	text-align:center;
	color: #fff;
	margin: 15px;
	padding: 0.5em 1em;
	border-radius:5px;
	background: linear-gradient(#007ab5 0%, #007ab5 50%, #004364 50%, #0099e3 100%);
}
/* ブログカード */
.internal-blogcard::after{
	content: '詳細 \00bb'; /* 内部リンク右下枠の文言 */
	position: absolute;
	bottom: .5rem;
	right: 1rem;
	font-size: 70%;
	background-color: #0000ff; /* 内部リンク右下枠の背景色 */
	padding: .4em 3em;
	font-weight: bold;
	color: #fff; /* 内部リンク右下枠の文字色 */
	border-radius: 2px;
}

/*フッターロゴサイズ*/
.footer-bottom-logo .logo-image {
	padding: 0;
	max-width: 300px;
}

.footer-bottom-logo img {
	height: 80px;
	width: auto;
}

/*アピールエリアサイズを画像に合わせる*/
#appeal { 
	height: calc(100vw * calc(768 / 1366)); 
}

/* 送信ボタン */
input.wpcf7-submit {
    background-color: #3498db; /* ボタンの背景色 */
    color: white;              /* ボタンのテキスト色 */
    border: none;              /* ボーダーを非表示 */
    padding: 10px 20px;        /* 内側の余白 */
    border-radius: 5px;        /* ボタンの角を丸める */
/*     font-size: 24px;           フォントサイズ */
/* 	font: bold;           フォント */ 
    cursor: pointer;           /* ホバー時にカーソルをポインタに */
}

input.wpcf7-submit:hover {
    background-color: #2980b9; /* ホバー時の背景色 */
}

input.wpcf7-submit:focus {
    outline: none;             /* フォーカス時のアウトラインを非表示 */
}
/* 確認画面　戻るボタン */
input.wpcf7-previous {
/*     background-color: #3498db; ボタンの背景色 */
/*     color: white;              ボタンのテキスト色 */
    border: none;              /* ボーダーを非表示 */
    padding: 10px 20px;        /* 内側の余白 */
    border-radius: 5px;        /* ボタンの角を丸める */
    font-size: 12px;           /* フォントサイズ */
    cursor: pointer;           /* ホバー時にカーソルをポインタに */
}

input.wpcf7-previous:hover {
    background-color: #2980b9; /* ホバー時の背景色 */
}

input.wpcf7-previous:focus {
    outline: none;             /* フォーカス時のアウトラインを非表示 */
}

.user-links {
  white-space: nowrap;  /* 折り返し禁止 */
  text-align: right;
  padding: 10px 10px;
  font-size: 14px;
  background: #f9f9f9;
  border-bottom: 1px solid #ccc;
}

.user-links a {
  color: #333;         /* 文字色を指定（好きな色に変更OK） */
  text-decoration: none; /* 下線を消す */
}

.user-links a:hover {
  color: #0073aa;      /* ホバー時の文字色（任意） */
  text-decoration: underline; /* ホバー時は下線を出す場合 */
}

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

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

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