@charset "UTF-8";

/*!
Theme Name: Simplicity2 child
Template:   simplicity2
Version:    20161002
*/

/* Simplicity子テーマ用のスタイルを書く */





a {
  color: #0066cc;
  text-decoration: none;     /* 通常はアンダーラインなし */
  transition: color 0.2s ease; /* スムーズ変化 */
}

a:hover {
  color: #0066cc;            /* 少し明るい青に変化 */
  text-decoration: underline; /* ホバーでアンダーライン表示 */
  text-underline-offset: 2px; /* 下線位置調整（オプション） */
}



.article p {
font-size:27px;
line-height:2.0;
margin:20px 0;
}

.article p img {
line-height:0;
}

.article h2 {
padding: 0.4em 0.5em;/*文字の上下 左右の余白*/
color: #494949;/*文字色*/
background: #f4f4f4;/*背景色*/
border-left: solid 5px #7db4e6;/*左線*/
border-bottom: solid 3px #d7d7d7;/*下線*/
margin:30px 0 45px 0;
}

.black {
background: #000080;/*背景色*/
padding:15px;
}

/*目次デザインの変更設定*/

#toc_container {
  margin-left: auto;
  margin-right: auto;
}

a {
font-weight:bold;
}

#appreach-box {
border-radius: 5px;
border: solid 1px #1C75BC;
	background-color: #fff;
	margin: 2rem 0;
	padding: 1rem;
}
 
#appreach-box p,
#appreach-box br {
	display: none;
}
 
.appreach-info {
	overflow: hidden;
}
 
#appreach-appname {
	color: #094274;
	font-weight: bold;
}
 
#appreach-developer {
	margin-bottom: 1.5rem;
}



p.post-meta{
  font-size:12px;
}








.article h1 {
  font-size: 33px;
}


@media screen and (max-width:639px){
	

	
 .article h1 {
 	text-align:center;
padding: 0.5em 0;/*上下の余白*/
border-top: solid 3px;/*上線*/
border-bottom: solid 3px;/*下線*/
}

#site-title{
margin-right:0px;
 	}

#site-description{
margin-right:0px;
}

}


span.marker-under {
  font-weight:bold !important;
}


.post-meta {
    background-color:#fff;
	    color: #999;
}






/*プロフィール枠*/
.profile {
  background-color: #fff; /* 背景色 */
  padding: 20px;
  display: flex;
 border: 3px solid #eaedf2 !important; 
	margin:40px 0;
}
.profile_image {
  text-align: center;
  padding-right: 14px;
}
.profile_image img {
  max-width: 80px;
  border-radius: 100%;
}
.profile_text_name {
  font-weight: bold;
  margin: 6px 0;
}
.profile_text_description {
  font-size: .8em;
  margin: 0;
}
	
@media screen and (max-width:480px) {
  .profile {
    display: block;
  }
  .profile_image {
    padding-right: 0;
  }
  .profile_image img {
    max-width: 120px;
  }
  .profile_text_name {
    text-align: center;
    margin-top: 6px;
  }
}
	
	
	
	
	
/* ボタンリンク */


.btl {
  display: flex;                    /* inline-flex → flex に変更 */
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  border-radius: 9999px;
  background: #0071e3;
  color: #ffffff;
  font-size: 17px;
  font-weight: 500;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  text-decoration: none;
  line-height: 1.2;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  min-height: 44px;

  /* ここを追加・変更 */
  margin: 0 auto;
  width: fit-content;
}

.btl:hover {
  background: #0077ed;
  transform: scale(1.03);
	  color: #ffffff;
}

.btl:active {
  background: #0066cc;
  transform: scale(0.97);
	
}











  /* 紹介コードショートコード*/

.referral-card{
    max-width:700px;
    margin:40px auto;
    padding:48px 32px;
    text-align:center;
    background:#f7faff;
    border:1px solid #b8d2ff;
    border-radius:24px;
    box-shadow:0 10px 30px rgba(0,0,0,.04);
}

.referral-label{
    font-size:18px;
    color:#3c4a5d;
    margin-bottom:20px;
}

.referral-code{
    font-size:52px;
    font-weight:700;
    letter-spacing:2px;
    color:#111827;
    margin-bottom:20px;
}

.referral-reward{
    display:inline-block;
    padding:10px 18px;
    border-radius:999px;
    background:#edf4ff;
    color:#2563eb;
    margin-bottom:24px;
}

.referral-copy-btn{
    border:none;
    cursor:pointer;
    color:#fff;
    font-weight:600;
    padding:16px 36px;
    border-radius:999px;
    background:linear-gradient(
        180deg,
        #4d8cff,
        #2563eb
    );
}

.referral-message{
    margin-top:14px;
    opacity:0;
    transition:.3s;
}

.referral-message.show{
    opacity:1;
}





.referral-reward{
    display:block;
    width:fit-content;
    margin:0 auto 24px auto;

    padding:10px 18px;
    border-radius:999px;

    background:#edf4ff;
    color:#2563eb;

    line-height:1.6;
}

.referral-copy-btn{
    display:flex;

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

    gap:10px;

    margin:0 auto;

    border:none;
    cursor:pointer;

    color:#fff;
    font-weight:600;

    padding:16px 36px;

    border-radius:999px;

    background:linear-gradient(
        180deg,
        #4d8cff,
        #2563eb
    );
}


.referral-label{
    line-height:1.6;
}

.referral-code{
    line-height:1.2;
}

.referral-reward{
    line-height:1.6;
}

.referral-copy-btn{
    transition:
        transform .25s ease,
        box-shadow .25s ease,
        background .25s ease !important;
}

.referral-copy-btn:hover{
    background:linear-gradient(
        180deg,
        #4d8cff,
        #2563eb
    ) !important;

    color:#fff !important;

    transform:translateY(-2px) !important;

    box-shadow:
        0 12px 28px rgba(37,99,235,.30) !important;
}

.copy-icon{
    font-size:16px;
    line-height:1;
    opacity:.85;
}

.button-text{
    line-height:1;
}