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

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.header {
	align-items: flex-start;
}
.tagline,
.logo
{
	text-align: right;
}
.tagline {
	margin-inline: 0;
	text-shadow: 
		1px  1px 0 #fff, -1px  1px 0 #fff,
		1px -1px 0 #fff, -1px -1px 0 #fff,
		1px  0px 0 #fff, -1px  0px 0 #fff,
		0px  1px 0 #fff,  0px -1px 0 #fff !important;
}
header .logo-text {
	padding-block: 0;
	font-size: clamp(18px, 2.5vw, 38px);
	text-shadow: 
		2px  2px 0 #fff, -2px  2px 0 #fff,
		2px -2px 0 #fff, -2px -2px 0 #fff,
		2px  0px 0 #fff, -2px  0px 0 #fff,
		0px  2px 0 #fff,  0px -2px 0 #fff !important;
}
.site-name-text-link {
	padding-inline: 0;
}

.profile-image-glow {
	display: block;
	position: relative;
	box-shadow: inset 0 0 6px 9px rgba(255, 255, 255, 1);
	border-radius: 50%;
	max-width: 40%;
	margin-inline: auto;
}

.profile-image-glow > img {
	display: block;
	position: relative;
	z-index: -1;
	
	/* ★サイズを100%ではなく99%にして、わずかに縮める */
	width: 99%;
	height: 99%;
	margin: 0.5% auto; /* 中央に寄せる */

	/* ★画像のフチを強制的に丸くシャープに切り取る */
	clip-path: circle(49.5% at center); 
}

/* プロフィール全体のリスト */
.profile-spec-list {
    margin: 1.5em 0;
    padding: 0;
}

/* 各行のコンテナ（div） */
.profile-spec-list div {
    display: flex;
    flex-wrap: wrap;        /* スマホ等で極端に幅が狭くなった時は自動で改行 */
    margin-bottom: .4em;
    line-height: 1.6;
}

/* 項目名（種類、体長、特徴など） */
.profile-spec-list dt {
    width: 3em;             /* 項目名を4文字分に固定 */
    font-weight: bold;
    text-align: justify;
    text-align-last: justify; /* 2文字や3文字の項目も4文字幅に均等割付 */
    position: relative;
}

/* コロン（：）の疑似要素 */
.profile-spec-list dt::after {
    content: "：";
    position: absolute;
    right: -1em;            /* 4文字幅のすぐ右側にコロンを固定 */
}

/* 説明文（2行目以降もここを基準に揃う） */
.profile-spec-list dd {
    flex: 1;                /* 残りの横幅をすべて使う */
    min-width: 200px;       /* スマホでの最小幅 */
    margin-left: 1.0em;     /* コロンの分の余白を確保 */
    padding: 0;
}

.entry-card-title {
	color: #833613;
	font-size: 18px;
}
.entry-card .entry-card-snippet {
	color: #333;
	font-size: 15px;
}

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

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
	main.main, div.sidebar {
		padding: 16px;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
	.header div.header-in {
		min-height: 130px !important;
		justify-content: flex-start;
		margin-right: .2em;
	}
	.header {
		aspect-ratio: auto;
		background-image: url(https://nui.akisora.net/wp-content/uploads/2026/06/main1_sp.png);
		background-size: 100%;
		background-position: center;
	}
	
	.tagline {
		display: none;
	}
	header .logo-text {
		padding-inline: .4em;
	}
	
	.profile-image-glow {
	  max-width: 80%; /* スマホ対応：横幅を親要素に合わせる */
	}
	
	.profile-spec-list div {
		flex-direction: column;	
	}
}