﻿/*全体*/
.hidden_box {
    margin: 2em 0;/*前後の余白*/
    padding: 0;
}

/*ボタン装飾*/
.hidden_box label {
    padding: 15px;
    font-weight: bold;
    border: solid 2px black;
    cursor :pointer;
}

/*ボタンホバー時*/
.hidden_box label:hover {
    background: #efefef;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 10px 0;
    height: auto;
    opacity: 1;
}

.hidden_box .hidden_show_synopsis {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

.hidden_box input:checked ~ .hidden_show_synopsis {
	background-image:url('/novel/images/bg/bg008_08.gif');
    padding: 10px 0;
    height: auto;
    opacity: 1;
}


div.box01{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#CC0000;
	background-image:url(/novel/images/head/head01.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}
div.box02{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#3399FF;
	background-image:url(/novel/images/head/head02.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}
div.box03{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#FF6600;
	background-image:url(/novel/images/head/head03.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}
div.box04{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#009900;
	background-image:url(/novel/images/head/head04.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}
div.box05{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#9933CC;
	background-image:url(/novel/images/head/head05.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}
div.box06{
	height:23px;margin:0px 0px 5px 0px;padding:7px 0px 0px 3px;
	font-size:16px;font-weight:bold;color:#333333;
	background-image:url(/novel/images/head/head06.gif);
	border:1px solid #CC0000;border-left:5px solid #CC0000;
}


a.synopsis{
	background-color: #f5d5da; /* 背景色 */
	border-radius: 5px;
	color: #ef858c; /* 文字色 */
	padding: 10px 10px 10px 60px; /* 上・右・下・左の余白 */
	position: relative;
	text-shadow: 0px 0px 10px #fff, 0px 0px 6px #fff, 0px 0px 4px #fff, 0 0 0.5px #fff; /* 文字の影 */
}
a.synopsis:before{
	content: '＊*'; /*花に見せかけるためのアスタリスク*/
	color: #fff; /* アスタリスクの色 */
	display: inline-block;
	font-size: 30px; /* アスタリスクの大きさ */
	font-weight: bold;
	margin-right: 10px;
	position: absolute;
	top: 0px;
	left: 0px;
	transform: rotate(20deg);
		-moz-transform: rotate(20deg);
		-webkit-transform: rotate(20deg);
		-o-transform: rotate(20deg);
	text-shadow: 0px 0px 3px #fff, 0px 0px 2px #fff, 0 0 0.5px #fff; /* アスタリスク周りの影 */
}
a.synopsis:after{
	border-bottom: 2px dotted #fff; /* 下線 */
	content: '';
	position: absolute;
	bottom: 3px;
	left: 3px;
	right: 3px;
}


div.synopsis {
	border:1px solid #CC0000;
	background-image:url('/novel/images/bg/bg008_08.gif');
	margin: 10px 0;
	padding: 5px;
}

div.novelInfo {
	border:1px solid #CC0000;
	background-image:url('/novel/images/bg/bg008_08.gif');
	margin: 10px 0;
	padding: 5px;
}


.sbox {
    position: relative;
    margin: 2em 0;
    padding: 25px 10px 7px;
    border: solid 2px #FFC107;
}
.sbox .box-title {
    position: absolute;
    display: inline-block;
    top: -2px;
    left: -2px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #FFC107;
    color: #ffffff;
    font-weight: bold;
}
.sbox p {
    margin: 0; 
    padding: 0;
}

.link-box {
    position: relative;
    padding: 0.25em 1em;
    margin: 2em 0;
    top: 0;
    background: #efefef;
}
.link-box:before, .link-box:after{ 
    position: absolute;
    top: 0;
    content:'';
    width: 10px;
    height: 100%;
    display: inline-block;
    box-sizing: border-box;
}
.link-box:before{
    border-left: dotted 2px #15adc1;
    border-top: dotted 2px #15adc1;
    border-bottom: dotted 2px #15adc1;
    left: 0;
}
.link-box:after{
    border-top: dotted 2px #15adc1;
    border-right: dotted 2px #15adc1;
    border-bottom: dotted 2px #15adc1;
    right: 0;
}
.link-box p {
    margin: 0; 
    padding: 0;
}

.infoBox {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
}
.infoBox .infoBox-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.infoBox p {
    margin: 0; 
    padding: 0;
}

