@charset "UTF-8";
/*
Theme Name:   THE THOR CHILD
Theme URI:    http://fit-jp.com/theme/
Description:  FIT(フィット) が制作するブロガー/アフィリエイター向けWordPressTHEME「THE THOR」の子テーマ
Author:       Kota Naito　@FIT(フィット)
Author URI:   http://fit-jp.com/about/
Template:     the-thor
Version:      1.0
License:      GNU GENERAL PUBLIC LICENSE
License URI:  http://www.gnu.org/licenses/gpl.html
*/
/*---------------------------------------------------------------

　　　　　　　　　　独自のスタイル(CSS)を追加する場合は、
　　　　　　　　　　現在開いている「style.css」ではなく、
　　　　　　　　　　style-user.cssを編集してください。
---------------------------------------------------------------*/
/*==================================================
  1. マーカー
==================================================*/

.marker-g{
  font-weight:normal;
  background:linear-gradient(transparent 85%,#7cfc00 45%);
}

.marker-p{
  font-weight:normal;
  background:linear-gradient(transparent 85%,#f0f 45%);
}

.marker-o{
  font-weight:normal;
  background:linear-gradient(transparent 85%,#ff8c00 45%);
}

.marker-b{
  font-weight:normal;
  background:linear-gradient(transparent 85%,#00bfff 45%);
}

.marker-r{
  font-weight:normal;
  background:linear-gradient(transparent 85%,red 45%);
}

.marker-y{
  font-weight:normal;
  background:linear-gradient(transparent 85%,#ff0 45%);
}


/*==================================================
  2. ボックス装飾
==================================================*/

.box5{
  padding:.5em 1em;
  margin:2em 0;
  border:double 5px #4ec4d3;
}

.box10{
  padding:.5em 1em;
  margin:2em 0;
  color:#000;
  background:#e4fcff;
  border-top:solid 6px #1dc1d6;
  box-shadow:0 3px 4px rgba(0,0,0,.32);
}

.box11{
  padding:.5em 1em;
  margin:2em 0;
  color:#5d627b;
  background:#fff;
  border-top:solid 5px #5d627b;
  box-shadow:0 3px 5px rgba(0,0,0,.22);
}

.box18{
  margin:1em 0;
  position:relative;
  padding:.25em 1em;
  border:solid 2px green;
  border-radius:3px 0 3px 0;
}

.box18:before,
.box18:after{
  content:'';
  position:absolute;
  width:10px;
  height:10px;
  border:solid 2px green;
  border-radius:50%;
}

.box18:after{
  top:-12px;
  left:-12px;
}

.box18:before{
  bottom:-12px;
  right:-12px;
}

.box30{
  margin:2em 0;
  background:#f1f1f1;
  box-shadow:0 2px 4px rgba(0,0,0,.22);
}

.box30 .box-title{
  font-size:1.2em;
  background:#5fc2f5;
  padding:4px;
  text-align:center;
  color:#fff;
  font-weight:700;
  letter-spacing:.05em;
}

.box5 p,
.box10 p,
.box11 p,
.box18 p,
.box30 p{
  margin:0;
  padding:10px;
}

.kakomi-box3{
  margin:0;
  padding:10px;
  width:90%;
  border:1px solid #ccc;
  background:#fff;
  box-shadow:1px 1px 2px #ccc;
}


/*==================================================
  3. 下線装飾
==================================================*/

.simple-border5{
  text-decoration:underline wavy red;
}


/*==================================================
  4. 読了時間
==================================================*/

.rt-reading-time{
  border:2px dotted #ccc;
  padding:.5em;
  display:block;
  text-align:center;
  margin-bottom:1.5em;
}


/*==================================================
  5. カード調整
==================================================*/

/*サイトカード説明消す*/
.content .sitecard__contents .phrase,

/*ブログカード説明消す*/
.content .blogcard__contents .phrase{
display:none;
}

/*カード画像調整*/
.eyecatch .eyecatch__link img{
object-fit:contain;
}

.eyecatch-11::before{
padding-top:55%;
}


/*==================================================
  6. 表の固定スクロール
==================================================*/

.sticky_table thead th{
position:sticky;
top:0;
z-index:1;
}

.sticky_table th:first-child{
position:sticky;
left:0;
}

.sticky_table thead th:first-child{
z-index:2;
}


/*==================================================
  7. 横スクロール案内
==================================================*/

@media screen{

.tableScroll:before{
content:"横にスクロールできます >>>";
font-size:80%;
font-weight:800;
color:#0268b7;

position:sticky;
left:0;

animation:yokoSC 1.5s ease-in-out infinite alternate;
}

}

@keyframes yokoSC{

0%{
opacity:.2;
}

100%{
opacity:1;
}

}


/*==================================================
  8. リスト装飾
==================================================*/

.content ol{
padding:2rem;
border:solid 2px #eca700;
}

.content ol li:before{
background:#eca700;
border:solid 1px #eca700;
color:#fff;
font-weight:bold;
font-size:15px;
width:25px;
height:25px;
padding-top:1px;
}

.content ol li{
border-bottom:dashed 1px #eca700;
padding:.5em .5em .5em 30px;
line-height:1.5em;
}


/*==================================================
  9. アコーディオン
==================================================*/

.accordion details{
background:linear-gradient(135deg,#fff,#fafafa);
border:1px solid #eee;
border-radius:12px;
margin-bottom:14px;
padding:18px 20px;
transition:all .3s ease;
position:relative;
}

.accordion details:not([open]){
box-shadow:
0 4px 12px rgba(0,0,0,.04),
0 1px 2px rgba(0,0,0,.04);
}

.accordion details:not([open]):hover{
box-shadow:
0 10px 28px rgba(0,0,0,.08),
0 2px 6px rgba(0,0,0,.05);

transform:
translateY(-3px)
scale(1.02);
}

.accordion details[open]{
background:
linear-gradient(
135deg,
#f7f7f7,
#fcfcfc
);

border-color:#e5e5e5;

box-shadow:
0 6px 16px rgba(0,0,0,.05);
}

.accordion summary{
cursor:pointer;
font-size:15.5px;
font-weight:500;
letter-spacing:.03em;
color:#333;
position:relative;
list-style:none;
}

.accordion summary::-webkit-details-marker{
display:none;
}

.accordion summary::after{
content:"→";

position:absolute;
right:0;

width:26px;
height:26px;

border-radius:50%;

background:#f2f2f2;
color:#666;

display:flex;
align-items:center;
justify-content:center;

font-size:18px;

transition:
transform .3s ease,
background .3s ease;
}

.accordion details[open] summary::after{
transform:rotate(90deg);
background:#333;
color:#fff;
}

.accordion details::before{
content:"";

position:absolute;

left:0;
top:12px;
bottom:12px;

width:3px;

border-radius:3px;

background:transparent;

transition:
background .3s ease;
}

.accordion details:hover::before{
background:#ddd;
}

.accordion .content{
display:grid;
grid-template-rows:0fr;
transition:grid-template-rows .5s ease;
}

.accordion details[open] .content{
grid-template-rows:1fr;
}

.accordion .inner{
overflow:hidden;
opacity:0;
transform:translateY(-5px);

transition:
opacity .4s ease,
transform .4s ease;

padding-top:12px;
line-height:1.8;
color:#444;

background:#fff;
border-radius:8px;
padding:12px;
}

.accordion details[open] .inner{
opacity:1;
transform:translateY(0);
}

.accordion img{
max-width:100%;
height:auto;
border-radius:8px;
margin-top:10px;
}


/*==================================================
  10. 編集画面だけ表示
==================================================*/

body.wp-admin .accordion{
border:2px dashed #4caf50;
padding:12px;
margin:12px 0;
background:rgba(76,175,80,.05);

position:relative;
}

body.wp-admin .accordion::before{
content:"▼ アコーディオン開始";

position:absolute;

top:-10px;
left:10px;

background:#4caf50;
color:#fff;

font-size:11px;

padding:2px 6px;

border-radius:4px;
}

body.wp-admin .accordion::after{
content:"▲ アコーディオン終了";

position:absolute;

bottom:-10px;
right:10px;

background:#999;
color:#fff;

font-size:11px;

padding:2px 6px;

border-radius:4px;
}
/*---------------------------------------------------------------
トップページだけ世界地図
---------------------------------------------------------------*/

.home body,
body.home{

background-image:
linear-gradient(
rgba(252,250,245,0.985),
rgba(252,250,245,0.985)
),
url("https://ryo-yasukawa.com/wp-content/uploads/2026/05/blog-background-world-map.jpg");

background-repeat:repeat;
background-position:center center;
background-size:cover;
background-attachment:fixed;

}

/*---------------------------------------------------------------

---------------------------------------------------------------*/

/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/
/*---------------------------------------------------------------

---------------------------------------------------------------*/