@charset "utf-8";
/* CSS Document */
:root {
    /* 余白  */
    --pad-l: 1.5em;
    --mar-t: 0.9em;
    --mar-h2: 3em 0 1em;
    /* 色  */
    --orange: #e98446;
    --blue:#07A8AC;
    --white:#fff;
}

#container #breadcrumb span{color:#fff;}

#content :before,
#sidebar-menu-content :before{ font: normal normal normal 100% / 1 FontAwesome;font-size: 125%;}
#content{position: relative;margin-top: 9.8em;z-index: 0;}
#content p{line-height:1.4em;font-size: 16px;}

#content #main{position:initial;padding: 0;}
#content #main :before{color:var(--orange);}
#content #main p{padding-left: 0.5em;}
#content #main h1{
    position: relative;
    z-index: 2;
    background: #EF8346;
    font-size: 165%;
    color: #fff;
    /* top: -7.1em; */
    right: 0;
    width: auto;
    margin: -7.1em calc(50% - 50vw) 0;
    text-align: center;
    padding: 2.3em max(16px, calc((100vw - 960px) / 2)););
    /* left: 50%; */
    transform: translateX(calc((960px - 650px - 2px) /2));
    /* transform: translateX(-50%) translateY(-7.1em); */
}
#content #main h2{
    border-radius: 5px;
    background-color:var(--orange);
    color:var(--white);
    padding: 0.5em;
    margin: var(--mar-h2);
}
#content #main h3{
    border: none;
    border-bottom: double 5px var(--orange);
    padding: 0.5em;
    margin-bottom: 1em;
    font-size: 110%;
}
#content #main h4{
    border: none;
    position: relative;
    padding-left: 0;
    font-size: 100%;
    margin-bottom: 0.5em;
}
#content #main h4:before{
    content: "\f0a9";
    color: var(--orange);
    padding-right: 0.3em;
    left: 0;
    top: 50%;
    font-size: 110%;
}
#content #main .date-tags{
    text-align: left;
    padding-top: calc(16px + 0.7em);
    margin-bottom: 0.6em;
}
#content #main #toc_container{
    border: 4px solid #aaa;
    padding: 5%;
    margin-bottom: 4%;
}
#content #main #toc_container p.toc_title{
    text-align: left;
    position: relative;
    padding-left: var(--pad-l);
    font-size: 20px;
}
#content #main #toc_container p.toc_title:before{
    content: "\f0c9";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
#content #main #toc_container ul.toc_list{/* padding-left: var(--pad-l); */}
#content #main #toc_container ul.toc_list ul{margin:0.4em auto}
#content #main #toc_container ul.toc_list li{padding-left: var(--pad-l);}
#content #main #toc_container ul.toc_list>li{margin-top: var(--mar-t);}
#content #main #toc_container ul.toc_list a{
    color:#444;
    transition:0.1s ease-out;
    position: relative;
}
#content #main #toc_container ul.toc_list a:before{
    content: "\f0da";
    position: absolute;
    left: -0.75em;
    top: 50%;
    transform: translateY(-50%);
    font-size: 125%;
}
#content #main #toc_container ul.toc_list a:hover{color:var(--orange)}
#content #main #toc_container ul.toc_list .toc_list>li>a{font-weight:bold}
#content #main #custom_html-3{margin-bottom:4em}


#content #sidebar{font-size: 80%; padding: 0.7em 0 0.7em 0.5em;}
#content #sidebar :before{color: #2dacaf;}

#content #sidebar h3{background: #2dacaf;text-align: center;color: #fff;}
#content #sidebar .widget_popular_entries .widget-entry-cards .card-thumb::before{color:#fff}
#content #sidebar .widget-entry-cards figure{width:100px;}
#content #sidebar .widget-entry-card-content{margin-left: 106px;font-size: 95%;line-height: 1.2em;padding: 0.3em 0;}
#content #sidebar .widget-entry-cards:not(.large-thumb-on) .card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    line-height: 1.2em;
}  
#content #sidebar .custom-html-widget ul{list-style-type: none;padding-left: 1em;}
#content #sidebar .custom-html-widget ul li{}
#content #sidebar .custom-html-widget ul p{line-height:1.2em;}
#content #sidebar .custom-html-widget ul a{font-size:80%;}

#content #sidebar .widget_categories{text-align:center;}
#content #sidebar .widget_categories ul{
    display:flex;
    margin: auto;
    width:95%;
    text-align:left;
    gap: 3%;
    flex-wrap: wrap;
}
#content #sidebar .widget_categories ul .cat-item{margin:0.3em 0}
#content #sidebar .widget_categories ul .cat-item a{
    display: inline-block;
    width: auto;
    font-size: 75%;
    border: 1px solid;
    /* border-radius: 2em; */
    padding: 0.2em 1em;
}
#content #sidebar .widget_categories ul .cat-item a:before{
    content:"\f02c";
    color:#2dacaf;
    padding-right: 0.25em;
    vertical-align:middle;
}
#content #sidebar .toc_widget h3{margin-bottom:0}
#sidebar-scroll{padding-top:5%}
#content #sidebar .toc_widget ul{padding-left:1em;}
#content #sidebar .toc_widget ul li a{
    color:#000;
    text-decoration: none;
    margin: 0.15em auto;
    display: inline-block;
}
#content #sidebar .toc_widget ul li a:hover{
    text-decoration:underline; 
 }
#content #sidebar .toc_widget ul li a:before{
    content: "\f0da";
    padding-right:0.25em;
 }
#content #sidebar .toc_widget>ul{padding: 1em;background: #fbfbfb;max-height: 500px;overflow-y: scroll;}
#content #sidebar .toc_widget ul.toc_widget_list>li{margin-top: var(--mar-t);}
#content #sidebar .toc_widget ul.toc_widget_list>li:first-child{margin-top:0}
#content #sidebar .toc_widget ul.toc_widget_list>li>a{font-weight:bold}
#content #sidebar .toc_widget ul.toc_widget_list>li>a:before{content: "";padding-right:0.25em;color: var(--orange);}


#content .tagcloud{display:flex;flex-wrap:wrap;width: 100%;}
#content .tagcloud a{
	display: inline-block;
	width: auto;
    font-size: 75%;
	background:none;
	border: 1px solid #ddd;
	color:#333;
	margin-bottom: 0.5em;
	border-radius: 2em;
	padding: 0.2em 1.5em;
	line-height: initial;}
#content .tagcloud a:before{
	content: "\f02e";
	color: #F5BD66 !important;
	padding-right: 0.25em;
	font: normal normal normal 100% / 1 FontAwesome;
	font-size: 110%;
}
#content .tagcloud a:hover{background:#e7e7e7}

/*------------------*/
/*  CTA関係         */
/*------------------*/
.btnBox{display: flex;justify-content: space-between;margin: 1em 0;}
.btnBox a {
    text-decoration:none;
    width: 49%;
    transition:ease-in-out 0.2s;
    border: 2px solid #000;
    border-radius: 1em;
}
.btnBox a dl{
    display:grid;
    padding: 0.7em 0.5em 0.7em 23%;
    margin: auto;
    position: relative;
}
.btnBox a dl dt{
    color: #000;
    font-size: 107%;
    order: 2;
    font-weight: bold;
    padding: 0.2em;
}
.btnBox a dl dd{
    color: #000;
    font-size: 79%;
    order: 1;
    border-bottom: 1px solid;
    margin-bottom: 0.3em;
    padding: 0.3em;

    span{color:#fc7f92}
}
.btnBox a dl dt,
.btnBox a dl dd{margin-left: 0;width: 100%;line-height: 1.2em;}
.btnBox a dl:before{
    content:"";
    position:absolute;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 18%;
    height: 72px;
    max-width: 20%;
    top: 0;
    bottom: 0;
    left: 3%;
    margin: auto;
}
.btnBox a:hover{
    opacity:0.8;
    background:#fff5f5;
    text-decoration:none;
}
.btnBox a.ank_counseling dl:before{background-image: url("images/icon_counseling.png");}
.btnBox a.ank_request dl:before{background-image: url("images/icon_request.png");}

#content .author-infos{
    margin: var(--mar-h2);
    border-radius: 10px;
    border: 1px solid var(--orange);
}
#content #main .author-infos h2{
    margin: auto;
}
#content .author-infos dl.author-info__list{
    padding: 0.75em 3.5%;
    margin: 0;
}
#content .author-infos dl.author-info__list .author-info__row{
    margin: 4px auto;
	font-size:80%;
}
#content .author-infos dl.author-info__list .author-info__row:first-child{margin-top:0;}
#content .author-infos dl.author-info__list .author-info__row:last-child{margin-bottom:0;}
#content .author-infos dl.author-info__list .author-info__row dt{
    width: 7em;
}
#content .author-infos dl.author-info__list .author-info__row dd{
    margin: 0;
    max-width: calc(100% - 8em);
}




#content .wp-block-list{
    padding: 0;
}
#content .wp-block-list li{
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.4;
    margin: 0.25em auto;
}
#content .wp-block-list li:before{
	content:"・";
	font-size: 100%;
}


@media screen and (max-width: 1255px){
    #content{
}
    #content #main{margin: 0;}
    #content #sidebar{margin: 0;}
}
@media screen and (max-width: 1023px){
    /*必要ならばここにコードを書く*/
    
    #content{/* width: 90%; */}
    #content #main{margin: 0;}
    #content #main h1{padding: 3em 5% 2em;/* top: -7.6em; */margin-top: -8.1em;*/transform: translateX(calc((960px - 650px) / 2));*/transform: translateX(calc((960px - 650px) / 2));transform: translateX(0);}
    #content #main #sidebar{margin: 0;}
    
    .btnBox{flex-wrap: wrap;}
    .btnBox a{margin:0.5em auto;}
    .btnBox a dl{padding: 3% 2% 2% 23%;}
    .btnBox a dl:before{width: 15%;left: 5%;}
    .btnBox a dl dt{
        font-size: 2.9vw;
    }
    .btnBox a dl dd{}
    .btnBox a dl dd span{}
    .btnBox a dl dt,
    .btnBox a dl dd{padding-left: 2%;}
    
    .btnBox a:hover{}
    .btnBox a.ank_counseling dl:before{}
    .btnBox a.ank_request dl:before{}
}

@media screen and (max-width: 959px){
    #content{
    margin-top: 9.5em;
}
    #content #main{}
    #content #main h1{
    /* top: -7.5em; */
}
    #content #main #sidebar{}
    
    
    .btnBox{flex-wrap: wrap;}
    .btnBox a{width: 75%;/* max-width: 320px; */}
    .btnBox a dl{padding: 3% 2% 2% 23%;}
    .btnBox a dl:before{}
    .btnBox a dl dt{font-size: 3.2vw;}
    .btnBox a dl dd{font-size: 2vw;}
    .btnBox a dl dd span{}
    .btnBox a dl dt,
    .btnBox a dl dd{padding-left: 2%;}
    
    .btnBox a:hover{}
    .btnBox a.ank_counseling dl:before{}
    .btnBox a.ank_request dl:before{}
}
@media screen and (max-width: 480px){
    #content{}
    #content #main{}
    #content #main h1{
	    /* top: -8.2em; */
	    margin-top: -8.1em;
	    margin-top: -9em;
	}
    #content #main #sidebar{}
    
    
    .btnBox{flex-wrap: wrap;}
    .btnBox a{width: 80%;}
    .btnBox a dl{padding: 5% 3% 4% 23%;}
    .btnBox a dl:before{}
    .btnBox a dl dt{font-size: 5vw;}
    .btnBox a dl dd{font-size: 3.5vw;}
    .btnBox a dl dd span{}
    .btnBox a dl dt,
    .btnBox a dl dd{padding-left: 2%;}
    
    .btnBox a:hover{}
    .btnBox a.ank_counseling dl:before{}
    .btnBox a.ank_request dl:before{}

	#content .author-infos{
	    margin: var(--mar-h2);
	    border-radius: 10px;
	    border: 1px solid var(--orange);
	}
	#content #main .author-infos h2{}
	#content .author-infos dl.author-info__list{}
	#content .author-infos dl.author-info__list .author-info__row{
    flex-wrap: wrap;
    margin: .5em auto;
}
	#content .author-infos dl.author-info__list .author-info__row dt{
    width: 100%;
    font-size: 110%;
}
	#content .author-infos dl.author-info__list .author-info__row dd{
    width: 100%;
    max-width: max-content;
}
}