@charset 'UTF-8';
 
 .postsBox {
	border-top: 1px solid #ccc;
	margin-top: 60px;
	padding-top: 60px;
}
.detailList {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}
.detailList li {
	width: 30%;
	margin: 0 5% 30px 0;
	padding: 0;
}
.detailList li h3 {
	font-size: 16px;
}
.detailList li .img {
  margin: 0 0 5px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  padding-top: 108%;
  padding-top: 100%;
}
.detailList li:nth-child(3n){
	margin-right: 0;
}
.blog .contents ul {
	margin: 0!important;
}
.blog .contents ul li {
	list-style: none!important;
}
.popularPostsBox {
	margin-top: 0!important;
}
@media screen and (max-width:768px) {
	.postsBox {
		margin-top: 30px;
		padding-top: 30px;
	}
	.detailList li {
		width: calc(50% - 5px);
		margin: 0 10px 20px 0;
		padding: 0;
	}	
	.detailList li:nth-child(2n) {
		margin-right: 0;
	}	
	.detailList li:nth-child(3n) {
		margin-right: auto;
	}		
	.detailList li h3 {
		font-size: 14px;
	}
}

    .side_blog .side-btn {
        position: fixed;
        bottom: 90px;
        right: 0;
        width: 200px;
        z-index: 10;
    }    
    .side_blog .side-btn__image {
        margin-bottom: 40px;
        box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .2);
    }
    .side_blog .slidebtn__scroll {
        margin-left: 100px;
        margin-right: 20px;   
        box-shadow: 0 5px 5px 0 rgba(0, 0, 0, .2);
    }
    @media screen and (min-width: 769px){
        .side_blog .sp_only {
            display: none;   
        } 
    }    
    @media screen and (max-width: 768px){
        .side_blog .pc_only {
            display: none;   
        }
        
        .side_blog .fixedBanner {
            width: 100%;
            height: 80px;   
            position: fixed;
            bottom: 0;
            left: 0;
            z-index: 20;
            background: #fff;
        }
        .side_blog .fixedBanner a {
            width: 100%;
            height: 80px;
            padding: 10px 0;        
            background: url(https://www.1-daikanyama.jp/wp-content/themes/icci/img/common/fix_bg.png) center center no-repeat;  
            background-size: cover;
            text-align: center;
            display: block;        
            cursor: pointer; 
        }
		.side_blog .fixedBanner a.test1 {
			background: url(https://www.1-daikanyama.jp/wp-content/themes/icci/img/common/test1/fix_bg.png) center center no-repeat;  
            background-size:cover;
		}
				.side_blog .fixedBanner a.test2 {
			background: url(https://www.1-daikanyama.jp/wp-content/themes/icci/img/common/test2/fix_bg.png) center center no-repeat;  
            background-size:cover;
		}
        .side_blog .fixedBanner a:hover {
            opacity: 0.7;           
            cursor: pointer; 
        }
        .side_blog .fixedBanner .l {
            position: absolute;
            bottom: 0;
            left: 0;
        }
        .side_blog .fixedBanner .l img {
            width: auto;
            height: 65px;    
        }    
        .side_blog .fixedBanner a:hover {
            opacity: 0.7;   
        }
        .side_blog .fixedBanner .r {
            position: absolute;
            bottom: 0;
            right: 0;
        }
        .side_blog .fixedBanner .r img {
            width: auto;
            height: 65px;    
        }   
        .side_blog .fixedBanner .c {
            padding: 5px 0 0;    
        }    
        .side_blog .fixedBanner .c img {
            height: 50px;
            width: auto;
        }         
        
    }  
    
iframe.wp-embedded-content {
    max-width: 100%;
}

/*============================================

2022/12/12 ブログ改良

============================================*/

.columnBox .section__ttl {
    text-align: left;
    font-size: 22px;
    line-height: 1.5;
    font-family: inherit;
    border-bottom: 1px solid #877e70;
    color: #877e70;
    font-weight: bold;
    margin: 0 0 30px;
    padding: 0 0 20px!important;
    letter-spacing: 1px;
}

.columnBox #ez-toc-container {
    padding: 30px 0!important;
    margin: 0 0 100px!important;
    background: #fff!important;
    border: none!important;
    border-radius: 0px!important;
    border-top: 1px solid #877e70!important;
    border-bottom: 1px solid #877e70!important;
    webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.mboutputB,
.mboutputT,
.mboutputM {
	background: #f6f6f6;
	padding: 20px;
	margin-bottom: 100px;
	margin-top: 40px;
}

iframe.wp-embedded-content {
	width: 100%;
    border: 5px solid #aba293;
    box-sizing: border-box;
    margin-top: 30px!important;
}

.ez-toc-title {
    color: #877e70;
    font-size: 18px;
    font-weight: bold;
}

.ez-toc-title-container {
	padding: 0!important;
}

.post-dates {
    font-size: 14px;
    font-weight: 300;
    margin-top: 8px;
}

.post-dates .publish-date,
.post-dates .update-date {
    display: inline-block;
}

.post-dates .publish-date {
    margin-right: 8px;
}

.entry-contents .post-detail h2 {
    text-align: left;
    font-size: 22px;
    line-height: 1.5;
    font-family: inherit;
    border-bottom: 1px solid #877e70;
    color: #877e70;
    font-weight: bold;
    margin: 80px 0 30px;
    padding: 0 0 20px;
    letter-spacing: 1px;
}

.entry-contents .post-detail h3 {
    text-align: left;
    font-size: 18px!important;
    line-height: 1.5;
    font-family: inherit!important;
    color: #877e70;
    margin: 60px 0 20px!important;
}

.entry-contents .post-detail h4 {
    text-align: left;
    font-size: 16px!important;
    line-height: 1.5;
    font-family: inherit!important;
    color: #877e70;
    margin: 0 0 20px!important;
}


.ez-toc-list {
	padding: 0px!important;
}

.ez-toc-heading-level-2 > a.ez-toc-link {
    font-size: 17px!important;
    font-weight: normal;	
    /*color: #877e70!important;*/
}

ol {
    counter-reset: cnt!important;
}

.ez-toc-heading-level-2 {
    margin-top: 15px!important;
}

.ez-toc-heading-level-3 > a.ez-toc-link {
    font-size: 16px!important;
    font-weight: normal;	
}

.ez-toc-heading-level-4 > a.ez-toc-link {
    font-size: 14px!important;
    font-weight: normal;	
}

.ez-toc-list-level-3,
.ez-toc-list-level-4{
    padding: 0 0 0 10px!important;
    counter-reset: cnt!important;
}


.ez-toc-heading-level-3 a:before {
	content: counters(cnt, ".") "."!important;
	counter-increment: cnt!important;
}

.ez-toc-heading-level-6 a:before
.ez-toc-heading-level-5 a:before,
.ez-toc-heading-level-4 a:before {
	content:  "・"!important;	
}

.postsBox {
	margin: 0;
	padding: 0;
	border: none;
}

.entry-contents p {
	line-height: 1.5!important;
	margin: 0 0 20px!important;
}

.breadcrumbs {
	padding: 0!important;
}

@media screen and (max-width:768px) {
	.columnBox .section__ttl {
		font-size: 20px;
		margin: 0 0 20px;
		padding: 0 0 15px!important;
	}

	.columnBox #ez-toc-container {
		padding: 20px 0!important;
		margin: 0 0 75px!important;
	}

	.mboutputB,
	.mboutputT,
	.mboutputM {
		background: #f6f6f6;
		padding: 10px;
		margin-bottom: 75px;
		margin-top: 30px;
	}
	
	.courseGallery__btn  {
		font-size: 14px!important;
	}
	
	.post-detail .btnMore a {
		font-size: 16px!important;
	}

	iframe.wp-embedded-content {
		width: 100%;
		border: 5px solid #aba293;
		box-sizing: border-box;
	}

	.ez-toc-title {
		font-size: 17px;
	}

	.entry-contents .post-detail h2 {
		font-size: 20px;
		margin: 60px 0 20px;
		padding: 0 0 15px!important;
	}

	.entry-contents .post-detail h3 {
		font-size: 17px!important;
		margin: 40px 0 15px!important;
	}

	.ez-toc-heading-level-2 > a.ez-toc-link {
		font-size: 17px!important;
	}

	.ez-toc-heading-level-3 > a.ez-toc-link {
		font-size: 15px!important;
	}

	.ez-toc-list-level-3{
		padding: 0 0 10px 10px!important;
		list-style: disc!important;
	}
}
.entry-contents .post-detail h3 {
    background: #f6f6f6;
    padding: 10px 15px;
    color: #333;
 }
 .entry-contents .post-detail img {
 	width: 100%;	
 }
 @media screen and (max-width: 768px) {
 	.columnBox.spBox {
 		padding: 0 20px;
 	}
	.mboutputB, .mboutputT, .mboutputM {
		padding: 10px 5px!important;
	}
	.courseGallery__btn {
		font-size: 12px!important;	
		font-weight: bold;
	}
	.post-detail .btnMore {
		max-width: 100%;	
	}
 }
 
.mboutputB, 
.mboutputT, 
.mboutputM {
	padding: 0!important;
	background: 0!important;
}
.bn img {
	max-width: 100%;
	height: auto;
	box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .2);
}

.post-detail .btnMore {
	max-width: auto!important;
}

.mboutputT .bn img {
	max-width: 90%;
}

	.post-detail .mboutputT .btnMore {
		padding-top :0;	
	}

@media screen and (max-width:768px) {
	.entry-contents p.bn  {
		margin: 0!important;
		padding: 0!important;
	}
	.entry-contents p.bn  img {
		max-width: 100%;
	}	
	.post-detail .mboutputB .btnMore,
	.post-detail .mboutputT .btnMore,
	.post-detail .mboutputM .btnMore {
		max-width: 100%;
	}
	.post-detail .mboutputB,
	.post-detail .mboutputT,
	.post-detail .mboutputM {
		margin-bottom: 50px;
	}
}

/* 監修者ブロック - シンプル洗練デザイン */
.supervisor-block {
    margin: 40px 0;
    padding: 30px;
    background: #f8f9fa;
    border: none;
    border-radius: 0;
    clear: both;
    position: relative;
    box-shadow: none;
    border-left: 4px solid #686255;
}

.supervisor-block-title {
    font-size: 16px;
    font-weight: 600;
    color: #2c2c2c;
    margin-bottom: 25px;
    padding-bottom: 0;
    border-bottom: none;
    font-family: arno-pro-display, serif;
    position: relative;
}

.supervisor-block-content {
    /* コンテンツエリア全体のスタイル */
}

.supervisor-block-user {
    display: grid;
    grid-template-columns: 95px 1fr;
    grid-template-rows: auto;
    gap: 15px 25px;
    grid-template-areas: 
        "photo meta"; /* "photo description" から変更 */
    position: relative;
    padding-bottom: 30px; /* 名前のためのスペース確保 */
}

.supervisor-block-photo {
    grid-area: photo;
    position: relative;
}

.supervisor-block-name {
    position: absolute;
    top: 110px; /* 写真の高さ(95px) + gap(15px) */
    left: 0;
    width: 95px;
    text-align: center;
    z-index: 1;
}

.supervisor-block-position {
    font-size: 14px;
    line-height: 1.7;
    color: #2c2c2c;
}

.supervisor-block-description {
    align-self: start;
    position: relative;
}

/* ソーシャルメディアリンクCSS */
.supervisor-block-social {
    margin-top: 15px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: white;
    text-decoration: none;
    transition: all 0.3s ease;
    position: relative;
}

.social-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.social-link .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.social-link::before {
    content: '';
    width: 16px;
    height: 16px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ウェブサイト（リンクアイコン） */
.icon-website {
    background-color: #6c757d;
}

.icon-website::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

/* Instagram */
.icon-instagram {
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}

.icon-instagram::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E");
}

/* YouTube */
.icon-youtube {
    background-color: #ff0000;
}

.icon-youtube::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z'/%3E%3C/svg%3E");
}

/* X (旧Twitter) */
.icon-x {
    background-color: #000000;
}

.icon-x::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z'/%3E%3C/svg%3E");
}

/* トグル機能のCSS - 装飾削除版 */
.supervisor-toggle-wrapper {
    margin-top: 8px;
}

.supervisor-toggle-btn {
    position: relative;
    background-color: #c9aa7a;
    color: #ffffff;
    border: 2px solid #b8956a;
    padding: 8px 24px;
    border-radius: 25px;
    font-size: 12px;
    font-weight: 600;
    font-family: arno-pro-display, serif;
    cursor: pointer;
    margin-top: 12px;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.supervisor-toggle-btn:hover {
    background-color: #b8956a;
    border-color: #c9aa7a;
}

.supervisor-description-short,
.supervisor-description-full {
    margin-bottom: 0;
}

.supervisor-block-photo {
    flex-shrink: 0;
    width: 95px !important;
    height: 95px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: none !important;
    box-shadow: none !important;
}

.supervisor-block-photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border: none !important;
}

.supervisor-block-meta {
    display: block; /* contentsから変更 */
    grid-area: meta; /* grid-areaを指定 */
}

.supervisor-block-name {
    font-size: 18px;
    font-weight: 700;
    color: #2c2c2c;
    margin-bottom: 12px;
    font-family: arno-pro-display, serif;
}

.supervisor-block-description {
    line-height: 1.7;
    color: #2c2c2c;
    font-size: 14px;
}

.supervisor-block-description p {
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 1.7;
    color: #2c2c2c;
}

.supervisor-block-description p:first-child {
    margin-bottom: 8px;
}

.supervisor-block-description p:last-child {
    margin-bottom: 0;
}

.supervisor-profile {
    margin-bottom: 15px;
}

/* 監修者ブロック - リンクスタイル */
/* 監修者名のリンク */
.supervisor-name-link {
    color: #c9aa7a;
    text-decoration: none;
    transition: color 0.3s ease, text-decoration 0.3s ease;
}

.supervisor-name-link:hover {
    color: #b8956a;
    text-decoration: underline;
}

/* Markdown形式のテキストリンク [テキスト](URL) */
.supervisor-text-link {
    color: #c9aa7a;
    text-decoration: underline;
    transition: color 0.3s ease, text-decoration 0.3s ease;
}

.supervisor-text-link:hover {
    color: #b8956a;
    text-decoration: none;
}

/* 自動検出されたURLリンク */
.supervisor-auto-link {
    color: #c9aa7a;
    text-decoration: underline;
    word-break: break-all;
    transition: color 0.3s ease;
}

.supervisor-auto-link:hover {
    color: #b8956a;
}

/* スマートフォン対応 */
@media screen and (max-width: 768px) {
    .supervisor-block {
        margin: 30px 0;
        padding: 25px 15px;
        border-left: 3px solid #686255;
    }
    
    .supervisor-block-content {
        text-align: center;
    }

    .supervisor-block-user {
        display: grid;
        grid-template-columns: 80px 1fr;
        grid-template-rows: auto;
        gap: 0 15px;
        grid-template-areas:
            "photo profile"
            "description description";
        margin-bottom: 0;
        /* リセット */
        padding-bottom: 0;
        justify-items: unset;
    }
    
    .supervisor-block-photo {
        grid-area: photo;
        flex-shrink: 0;
        width: 80px !important;
        height: 80px !important;
        margin: 0;
        border-radius: 50% !important;
        align-self: start;
        position: relative;
    }

    .supervisor-block-meta {
        display: contents; /* 子要素をグリッドアイテムとして扱う */
    }

    .supervisor-profile {
        grid-area: profile;
        margin-bottom: 0;
        text-align: left;
        align-self: center;
    }
    
    .supervisor-block-name {
        font-size: 16px;
        font-weight: 600;
        text-align: left;
        margin-bottom: 8px;
        /* PC用スタイルをリセット */
        position: static;
        width: auto;
        background: transparent;
        padding: 0;
        border-radius: 0;
        box-shadow: none;
        transform: none;
    }

    .supervisor-block-position {
        font-size: 14px;
        color: #2c2c2c;
    }
    
    .supervisor-block-description {
        grid-area: description;
        text-align: center;
        line-height: 1.6;
        font-size: 14px;
        max-width: 100%;
        margin-top: 20px;
    }
    
    .supervisor-block-description p {
         text-align: center;
         margin-bottom: 12px;
     }
     
     /* ソーシャルメディアリンク - スマートフォン対応 */
     .supervisor-block-social {
         margin-top: 10px;
         justify-content: center;
     }
     
     .social-link {
         width: 28px;
         height: 28px;
     }
     
     .social-link::before {
         width: 14px;
         height: 14px;
      }

    /* 新しいHTML構造に合わせたボタンのスタイル */
    .supervisor-block-user .supervisor-toggle-btn {
        display: block;
        margin: 20px auto 0;
    }
}
