@charset "UTF-8";



/*
本間るみ子オフィシャルサイト CSS仕様
----------------------------------------------------------------------------------------------------
html5使用、可変式（リキッドデザイン）
モバイル：ブレイクポイント：768px
PCコンテンツ最大幅：1000px
----------------------------------------------------------------------------------------------------
*/










/*
----------------------------------------------------------------------------------------------------
body
----------------------------------------------------------------------------------------------------
*/
body {
	background-color: #FFFFFF;
	color: #663333;
}










/*
----------------------------------------------------------------------------------------------------
基本
----------------------------------------------------------------------------------------------------
*/
a {
	color: #CC0033;
}
a:hover {
	color: #663300;
	transform: translateY(-1px);
}



p.detail {
    text-align: right;
}
p.pager {
    text-align: center;
}
p.detail a,
p.pager a {
    font-size: 1.4rem;
	display: inline-block;
}
p.detail a:hover,
p.pager span.next a:hover {
	transform: translateX(1px);
}
p.pager span.previous a:hover {
	transform: translateX(-1px);
}
p.detail a:after,
p.pager span.next a:after {
    content: " ＞";
}
p.pager span.previous a:before {
    content: "＜ ";
}
p.internalLinkBtn {
    font-size: 1.4rem;
	line-height: 1.3;
	min-width: 14em;
	height: 7rem;
    display:table;
	text-align: center;
	margin: 0 auto 2rem;
}
p.internalLinkBtn a {
	width: 100%;
	height: 100%;
    display: table-cell;
	vertical-align: middle;
    background-color: #CC0033;
    color: #FFFFFF;
}
p.internalLinkBtn a:hover {
    color: #FFFF00;
}






main h1 {
    font-size: 2.8rem;
    margin: 0 auto 5rem;
	text-align: center;
}
main h1.pageTitle {
    position: relative;
    padding: 0.5rem 1.5em;
    border-bottom: 3px solid #CC9999;
    font-weight: bold;
	display: inline-block;
}
main h1.pageTitle:before,
main h1.pageTitle:after {
    position: absolute;
    top: 100%;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}
main h1.pageTitle:before {
    border: 12px solid;
    border-color: transparent;
    border-top-color: #CC9999;
    margin-left: -12px;
}
main h1.pageTitle:after {
    border: 8px solid;
    border-color: transparent;
    border-top-color: white;
    margin-left: -8px;
}
@media screen and (max-width: 768px) {
}

/* スマホはtelリンク解除 */
@media (min-width: 769px) {
    a[href^="tel:"] {
        pointer-events: none;
        cursor: default;
        color: #000000;
    }
}







/*
----------------------------------------------------------------------------------------------------
ヘッダー 
----------------------------------------------------------------------------------------------------
*/
header {
	margin: 0 auto;
	padding: 0;
}
#headerWrapper {
	width: 100%;
    background-color: #FFFFFF;
	text-align: center;
}
#headerWrapper .inner {
    width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0;
}
#headerWrapper h1 {
    padding: 30px 0;
	text-align: center;
}
.home #headerWrapper h1 {
    text-align: center;
}
#headerNavWrapper {
	background-color:rgba(102,51,51,0.10);
	margin-bottom: 10px;
}
#headerNavWrapper nav ul li {
    margin: 0;
	display: inline-block;
}
#headerNavWrapper nav ul li a {
	font-size: 1.6rem;
    /*padding: .3em .5em;*/
	padding: .3em .67em; /*WP用空き調整*/
    display: block;
}





/*
----------------------------------------
スマホ用メニュー（ハンバーガーメニュー他）
----------------------------------------
*/
@media screen and (max-width: 1000px) {
    /*スマホ用ヘッダーメニュー*/
    #spHeader {
        display: block;
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 40px;
        background-color: #FEF4F4;
        z-index: 1000;
    }
        #spHeader p {
        text-align: left;
    }
        #spHeader p a {
        padding: 0;
        display: block;
    }

    /*表示メニューブロック*/
    .global-nav {
        position: fixed;
        right: -100vw; /* これで隠れる */
        top: 0;
        width: 100vw; /* スマホに収まるくらい */
        padding-top: 0;
        padding-bottom: 0;
        background-color: #fff;
        transition: all .6s;
        z-index: 200;
        overflow-y: auto; /* メニューが多くなったらスクロールできるように */
    }

    /*メニューボタン*/
    .hamburger {
        position: absolute;
        right: 0;
        top: 0;
        width: 40px; /* クリックしやすいようにちゃんと幅を指定する */
        height: 40px; /* クリックしやすいようにちゃんと高さを指定する */
        cursor: pointer;
        z-index: 300;
    }

    /*表示メニュー UL*/
    .global-nav__list {
        margin: 0;
        padding: 0;
        list-style: none;
        font-size: 12px;
    }

    /*表示メニュー LI*/
    .global-nav__cate {
        text-align: center;
        padding: .5em 14px;
        background-color: #663333;
        font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";color: #FFFFFF;
		background-image: url("images/headerSpMenuBG.png");
		background-repeat: no-repeat;
    }
    .global-nav__item {
        text-align: left;
        padding: 0 14px;
    }
    .global-nav__item a {
        display: block;
        padding: 8px 0;
        border-bottom: 1px solid #eee;
        text-decoration: none;
        color: #111;
    }
    .global-nav__item.noline a {
        border-bottom: 0;
    }
    .global-nav__item a:hover {
        background-color: #eee;
    }
    .hamburger__line {
        position: absolute;
        left: 11px;
        width: 18px;
        height: 2px;
        background-color: #000;
        transition: all .6s;
    }
    .hamburger__line--1 {
        top: 14px;
    }
    .hamburger__line--2 {
        top: 20px;
    }
    .hamburger__line--3 {
        top: 26px;
    }
    .black-bg {
        position: fixed;
        left: 0;
        top: 0;
        width: 100vw;
        height: 100vh;
        z-index: 100;
        background-color: #000;
        opacity: 0;
        visibility: hidden;
        transition: all .6s;
        cursor: pointer;
    }
    
    /* 表示された時用のCSS */
    .nav-open .global-nav {
        right: 0;
    }
    .nav-open .black-bg {
        opacity: .8;
        visibility: visible;
    }
    .nav-open .hamburger__line--1 {
        transform: rotate(45deg);
        top: 20px;
        background-color: #FFFFFF;
    }
    .nav-open .hamburger__line--2 {
        width: 0;
    }
    .nav-open .hamburger__line--3 {
        transform: rotate(-45deg);
        top: 20px;
        background-color: #FFFFFF;
    }
    #spHeaderBottom {
        display: block;
        position: fixed;
        left: 0;
        top: 40px;
        width: 100%;
        height: 40px;
        background-color: #000000;
        box-shadow: 0 2px 6px rgba(0,0,0,.3);
        z-index: 999;
    }
}
@media print {
    /*スマホ用ヘッダーメニュー*/
    #spHeader {
        display: none;
    }
}
/*
スマホ用メニュー（ハンバーガーメニュー他）
----------------------------------------
*/










/*
----------------------------------------------------------------------------------------------------
ページナビ（パンくず、ページタイトル）
----------------------------------------------------------------------------------------------------
*/
#pageNavi {
}
.home #pageNavi {
	display: none;
}
#pageNavi #pageTitle h1 {
    font-size: 1.4rem;
	text-align: right;
    display: inherit;
    padding: 0;
    margin-bottom: 0;
}

#breadCrumb {
}
#breadCrumb ul {
        font-size: 1.4rem;
        display: flex;
}
#breadCrumb ul li:before {
    white-space: pre-wrap;
    content: " > ";
}
#breadCrumb ul li:first-child:before {
    content: "";
}
#breadCrumb ul li br {
    display: none;
}
@media screen and (min-width: 1001px) {
    #spHeader {
        display: none;
    }
}
@media screen and (max-width: 1000px) {
    #headerWrapper .inner {
		padding: 20px 0;
    }
    #headerTop,
    #headerNavWrapper {
        display: none;
    }
}
@media screen and (max-width: 768px) {
    #pageNavi {
        display: none;
    }
}











/*
----------------------------------------------------------------------------------------------------
フッター
----------------------------------------------------------------------------------------------------
*/
#footerWrapper {
	width: 100%;
	margin: 0;
	text-align: center;
}
#footerWrapper #footerAddress {
	text-align: left;
	width: 100%;
	margin: 0;
}
#footerWrapper #footerAddress .inner {
    margin: 0 auto 1rem;
    padding: 0;
}
#footerWrapper #footerAddress table {
    margin: 0 0 2rem;
	width: 100%;
	max-width: 420px;
}
#footerWrapper #footerAddress table th,
#footerWrapper #footerAddress table td {
    vertical-align: middle;
	padding: 0 1rem;
}
#footerWrapper #footerAddress table a:hover {
	transform: translateX(1px);
}
#footerWrapper #footerAddress img {
    margin: 0 1rem 2rem;
}
#footerWrapper #footerSiteMap .inner {
    margin: 0 auto;
    padding: 1rem 0;
}
#footerSiteMap {
	background-color: #FEF4F4;
    margin: 0 auto;
}
footer nav ul {
    margin-bottom: 3rem;
	font-size: 1.4rem;
}
footer nav ul li {
    display: inline-block;
}
footer nav ul li a {
    padding: 0 .2em;
    margin: 0 1em;
    display: block;
}
footer #copyright p {
	font-size: 1.2rem;
}
@media screen and (max-width: 768px) {
	footer nav ul li a {
		padding: .5em;
	}
}



/* PAGETOP用 
--------------------------------------------------*/
#pageTop {
	position: fixed;
	width: 150px;
	height: 60px;
	bottom: 0px;
	right: 0px;
	z-index: 9999;
}
#pageTop {
    overflow: hidden;
    cursor: pointer;
}
#pageTop a {
    opacity: 1;
}
#pageTop img {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
    display: block;
    -webkit-transition: .4s ease-in-out;
    transition: .4s ease-in-out;
}
#pageTop:hover img:nth-of-type(2) {
    top: 0%;
    opacity: 0;
}
#pageTop img:last-child {
    display: none;
}

@media screen and (max-width: 768px) {
    #pageTop {
        right: 0px;
        bottom: 0px;
        width: 40px;
        height: 40px;
        overflow: hidden;
    }
    #pageTop img:first-child,
    #pageTop img:nth-last-child(2) {
        display: none;
    }
    #pageTop img:last-child {
        display: block;
    }
}
@media print {
	#pageTop img {display: none;}
}








/*
----------------------------------------------------------------------------------------------------
コンテンツ
----------------------------------------------------------------------------------------------------
*/
main {
	background-color: #FFFFFF;
    margin: 0 auto 0;
}
main .inner,
main .section {
    width: 100%;
    padding: 50px 0;
}
main #pageNavi .inner {
    padding: 0 0 20px;
}
main #pageTopImg {
    width: 100%;
    margin-bottom: 3rem;
}
main #entryWrapper {
    margin: 0 auto 8rem;
}
main .entrySection h1 {
	font-size: 2rem;
	padding-top: .2em;
	padding-bottom: .5em;
	margin: 0 auto 1rem;
	position: relative;
}
main .entrySection h1::before {
	position: absolute;
	content: "";
	top: -3px;
	left: 0;
	width: 100%;
	height: 3px;
	background: -webkit-repeating-linear-gradient(-45deg, #efeaea, #efeaea 2px, #fff 2px, #fff 4px);
	background: repeating-linear-gradient(-45deg, #efeaea, #efeaea 2px, #fff 2px, #fff 4px);
}
main .entrySection h1::after {
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	width: 100%;
	height: 6px;
	background: -webkit-repeating-linear-gradient(-45deg, #efeaea, #efeaea 2px, #fff 2px, #fff 4px);
	background: repeating-linear-gradient(-45deg, #efeaea, #efeaea 2px, #fff 2px, #fff 4px);
}
main .entrySection h1 + p {
    margin: 0 auto 1.5rem;
	font-size: 1.6rem;
}
@media screen and (max-width: 768px) {
    main {
        width: 100%;
    }
}

/*グーグルマップ レスポンシブ
----------------------------------------*/
.googleMap {
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
}

.googleMap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}





/*
----------------------------------------------------------------------------------------------------
トップページ　index.html
----------------------------------------------------------------------------------------------------
*/
.home #topSlider {
    text-align: center;
}
.home main #topSlider .inner {
    padding: 0 0 5rem;
}
.home topSlider img {
    width: 100%;
    height: auto;
}
.home main #entryWrapper h1.pageTitle {
	line-height: 1.4;
	padding: 1rem 1.5em;
}
.home main #entryWrapper h1.pageTitle span {
	font-size: 2rem;
	font-weight: bold;
}
@media screen and (max-width: 768px) {
    .home main #topSlider .inner {
        max-width: 100%;
    }
}




/*
----------------------------------------------------------------------------------------------------
プロフィールページ　profile.html
----------------------------------------------------------------------------------------------------
*/
#books h2,
#award h2 {
	position: relative;
	padding: .3em 3em .3em 1em;
	margin-left: 40px;
	background: rgba(102,51,51,0.10);
	border-radius: 30px;
	margin-bottom: 3rem;
	display: inline-block;
	font-weight: bold;
}
#award h2 {
	padding: .3em 3em .3em 1.5em;
	margin-bottom: 2rem;
}
#books h2:before,
#award h2:before {
	content: "●";
	position: absolute;
	font-size: 16px;
	left: -40px;
	bottom: -10px;
	color: rgba(102,51,51,0.10);
}
#books h2:after,
#award h2:after {
	content: "●";
	position: absolute;
	font-size: 22px;
	left: -25px;
	bottom: -5px;
	color: rgba(102,51,51,0.10);
}



.bookList {
	align-items: flex-end;
}
.bookInfo {
	width: 20%;
	padding: 0 2rem;
	margin-bottom: 3rem;
}
.bookInfo img {
	max-height: 210px;
	width: auto;
	border:  1px solid #EFEFEF;
	margin-bottom: 1rem;
}
.bookInfo.a4 img {height: calc(210px * 1);}
.bookInfo.b5 img {height: calc(210px * .85);}
.bookInfo.a5 img {height: calc(210px * .7);}
.bookInfo.a5a6 > div {margin: 0 -20px;}
.bookInfo.a5a6 img {height: calc(210px * .85);border: none;}
.bookInfo.a6ex img {height: calc(210px * .66);}
.bookInfo.a6 img {height: calc(210px * .6);}
.bookInfo p {
	font-size: 1.2rem;
	line-height: 1.5;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	height: 65px;
}
.bookInfo p span {
	font-weight: bold;
}
@media screen and (max-width: 768px) {
	.bookInfo {
		width: 50%;
	}
}

#award h3 {
	margin-left: 3em;
	margin-bottom: 1rem;
	font-weight: bold;
	color: #bc763c;
}
#award dl,
#organizations dl {
	margin-left: 4em;
	line-height: 1.5;
}
#award dl dd,
#organizations dl dd {
	margin-top: -1.5em;
	padding-left: 7.55em;
	margin-bottom: .5em;
}
#organizations dl dd {
	margin-bottom: 1em;
}
#organizations dl:last-child dd:last-child {
	margin-bottom: 0;
}
@media screen and (max-width: 768px) {
}





/* 投稿ページ
----------------------------------------------------------------------------------------------------
カテページ　talk/
カテページ　cheese/
----------------------------------------------------------------------------------------------------
*/
main .entrySection {
	margin-bottom: 15rem;
}
main .entrySection:last-child {
	margin-bottom: 8rem;
}
main .entrySection p {
	margin-bottom: 1.5em;
}
main .entrySection .entryDate {
	font-size: 1.2rem;
	color: #999999;
	text-align: right;
	padding-right: 1em;
}
main .entrySection .imgCaption {
	font-size: 85%;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
main .entrySection .talkEntry202411 .styleForImg12 {z-index:5;margin:180px -50px 0 0;}
main .entrySection .cheeseEntry202509 .styleForImg21 {margin: 200px 0 0 -150px;}
main .entrySection .cheeseEntry202512 .styleForImg10Wrapper {padding-bottom: 50px;}
main .entrySection .cheeseEntry202512 .styleForImg10 {margin: 0 0 -50px -120px;}

@media screen and (max-width: 768px) {
	main .entrySection .talkEntry202411 .styleForImg12 {margin: 0;}
    main .entrySection .cheeseEntry202509 .styleForImg21 {margin: 0;}
    main .entrySection .cheeseEntry202512 .styleForImg10Wrapper {padding-bottom: 0;}
    main .entrySection .cheeseEntry202512 .styleForImg10 {margin: 0;width: 100%;}
	main .entrySection .talkEntry202505 .marginT-30 {margin-top: 0 !important;}
}
/*カテゴリページのページネーション*/
.category #contentsWrapper main div.post-pagination-wrapper {
margin-bottom: 8rem;
}
.category #contentsWrapper main div.post-pagination-wrapper ul {
display: flex;
justify-content: center;
align-items: center;
list-style: none;
}
.category #contentsWrapper main div.post-pagination-wrapper ul li a,
.category #contentsWrapper main div.post-pagination-wrapper ul li span {
list-style: none;
margin: 0 .3em;
background-color:transparent;
padding: .5em 1em;
display: block;
border: 1px dotted #CC0033;
}
.category #contentsWrapper main div.post-pagination-wrapper ul li a.next,
.category #contentsWrapper main div.post-pagination-wrapper ul li a.prev {
border: none;
}
.category #contentsWrapper main div.post-pagination-wrapper ul li span,
.category #contentsWrapper main div.post-pagination-wrapper ul li a:hover {
background-color: #FEF4F4;
}
.category #contentsWrapper main div.post-pagination-wrapper ul li a.next:hover,
.category #contentsWrapper main div.post-pagination-wrapper ul li a.prev:hover {
background-color: #FFFFFF;
}