@charset "UTF-8";


/********************************************************************
	追加
********************************************************************/

/*margin*/
.m_mb15{margin-bottom: -15px!important;}
.m_mb30{margin-bottom: -30px!important;}
.m_mb45{margin-bottom: -45px!important;}
.m_mb70{margin-bottom: -70px!important;}
.mb5{margin-bottom: 5px!important;}
.mb10{margin-bottom: 10px!important;}
.mb15{margin-bottom: 15px!important;}
.mb20{margin-bottom: 20px!important;}
.mb25{margin-bottom: 25px!important;}
.mb30{margin-bottom: 30px!important;}
.mb40{margin-bottom: 40px!important;}
.mb45{margin-bottom: 45px!important;}
.mb50{margin-bottom: 50px!important;}
.mb60{margin-bottom: 60px!important;}
.mb70{margin-bottom: 70px!important;}
.mb80{margin-bottom: 80px!important;}
.mb90{margin-bottom: 80px!important;}
.mb100{margin-bottom: 100px!important;}
.mb110{margin-bottom: 110px!important;}
.mb120{margin-bottom: 120px!important;}
.mb150{margin-bottom: 150px!important;}
.mb180{margin-bottom: 180px!important;}
.mb200{margin-bottom: 200px!important;}

.mt20{margin-top: 20px!important;}
.mt25{margin-top: 25px!important;}
.mt50{margin-top: 50px!important;}
.mt80{margin-top: 80px!important;}
.mr10{margin-right: 10px!important;}
.mr15{margin-right: 15px!important;}

/*padding*/
.pt10{padding-top: 10px!important;}
.pt20{padding-top: 20px!important;}
.pt30{padding-top: 30px!important;}

.pb20{padding-bottom: 20px!important;}
.pb30{padding-bottom: 30px!important;}



.width20{width: 20%!important;}
.width21{width: 21%!important;}
.width22{width: 22%!important;}
.width23{width: 23%!important;}
.width24{width: 24%!important;}
.width25{width: 25%!important;}
.width26{width: 26%!important;}
.width27{width: 27%!important;}
.width28{width: 28%!important;}
.width29{width: 29%!important;}
.width30{width: 30%!important;}

.width40{width: 40%!important;}
.width41{width: 41%!important;}
.width42{width: 42%!important;}
.width43{width: 43%!important;}
.width44{width: 44%!important;}
.width45{width: 45%!important;}
.width46{width: 46%!important;}
.width47{width: 47%!important;}
.width48{width: 48%!important;}
.width49{width: 49%!important;}
.width50{width: 50%!important;}
.width51{width: 51%!important;}
.width52{width: 52%!important;}
.width53{width: 53%!important;}
.width54{width: 54%!important;}
.width55{width: 55%!important;}
.width56{width: 56%!important;}
.width57{width: 57%!important;}
.width58{width: 58%!important;}

/*text*/
.text_left{text-align: left;}
.text_right{text-align: right;}
.text_center{text-align: center;}

/*poti_re*/
.posi_re{position: relative;}

/*flex*/
.fl{display: flex;}/*コンテンツ回り込み*/
.ju{justify-content: space-between;}/*左右にわける*/
.ju_sa{justify-content: space-around;}/* 各アイテムを均等に配置し各アイテムの両側に半分の大きさの間隔を置く */
.ju_left{justify-content: left;}
.ju_f_end{justify-content: flex-end;}
.ju_se{justify-content: space-evenly;}/* 各アイテムを均等に配置し各アイテムの周りに同じ大きさの間隔を置く */
.ju_center{justify-content: center;}
.items_center{align-items: center;}
.fl_wr{flex-wrap: wrap;}

/********************************************************************
	共通
********************************************************************/
#debulove{
	margin: 0 auto;
	padding: 0 0 50px 0;
	max-width: 770px;
	background: #fcec3c;
	text-align: center;
}

#debulove .wrap-all{
	margin: 0 auto;
	max-width: 710px;
	box-sizing: border-box;
}

	#debulove .wrap01{padding: 20px 0 100px 0;}
	#debulove .wrap02{padding: 30px 0 0 0;}

#debulove p{
	text-align: center;
	color: #1a1a1a;
	font-size: 1.4em;
}

#debulove p,#debulove ul li,#debulove a{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";}

#debulove img{
	max-width: 100%;
	height: auto;
	margin: 0 auto;
    display: block;
}

#debulove .img_width100 img{width: 100%;}
#debulove .img_auto img{width: auto!important;}

#debulove .big-font{font-size: 2.2rem!important;}
#debulove .small-font{font-size: 1.2rem!important;}

/*色*/
#debulove .orange{color: #ff6000;}
#debulove .red{color: #e50014;}
#debulove .blue{color: #0142ae;}
#debulove .green{color: #00a1be;}
#debulove .pink{color: #ff3ab3;}

/*太字*/
#debulove .bold{font-weight: bold;}

/*リスト*/
#debulove ul{
	color: #1a1a1a;
	text-align: left;
	list-style: none;
}
#debulove ul li{
	font-size: 1.6em;
	color: #1a1a1a;
}

#debulove .border-radius{
	background: #fff;
	border: 1px solid #000;
    -moz-border-radius: 10px; /* Firefox */
    -webkit-border-radius: 10px; /* Safari and Chrome */
    border-radius: 10px;
    behavior: url(border-radius.htc); /* IE */
}


/********************************************************************
	見出し
********************************************************************/
#debulove h1 img{border: none!important;}

#debulove h2{
	position: relative;
	bottom: 27px;
}

/********************************************************************
	リンク
********************************************************************/
#debulove a:hover{
	text-decoration: none;
	opacity: 0.7;
}

#debulove .coupon_details_link{
	margin: 0 0 0 auto;
	width: 320px;
	background: #fcf149;
	letter-spacing: 3px;
}

#debulove .coupon_details_link a{
	color: #0142ae;
	text-decoration: underline;
	font-size: 1.6em;
}

#debulove .details_box a{
	color: #0b87d6;
	text-decoration: underline;
}

/********************************************************************
	共通box
********************************************************************/
#debulove .bg-box{
	padding: 20px 0 20px 25px;
	max-width: 710px;
	width: 100%;
	background: url(/auto/images/fix/250718_debulove/pcc/volumes_bg.png) no-repeat #fff;
	background-position: right bottom;
	box-sizing: border-box;
}

	#debulove .bg-box .books img{
		margin: 0 auto 0 0;
		width: 267px;
		height: auto;
		border: 1px solid #000;
	}

	#debulove .logo{padding: 25px 0 0 0;}

	#debulove .volumes10_can{
		position: relative;
		right: -156px;
		bottom: -71px;
	}

	#debulove .volumes10_can + div.bg-box .logo {
		padding: 55px 0 0 0!important;
	}
	
	#debulove .kakioroshi_font{font-size: 1.8em;}

/*巻*/
#debulove p.volumes40,#debulove p.volumes01,#debulove p.volumes01_tokuso{
	font-size: 5.5em;
	font-weight: bold;
}

#debulove p.volumes40 span, #debulove p.volumes01 span, #debulove p.volumes01_tokuso span {font-size: 80%;}

	#debulove .volumes40{
		position: relative;
		right: -96px;
		bottom: -25px;
	}

	#debulove .volumes01{
		position: relative;
		right: -118px;
		bottom: -10px;
	}

	#debulove .volumes01_tokuso{
		position: relative;
		right: -118px;
		bottom: -10px;
	}

/********************************************************************
	通常記述
********************************************************************/
#debulove .bg01{
	background: url(/auto/images/fix/250718_debulove/pcc/bg01.png) repeat-y;
	background-size: cover;
}

#debulove .coma-font p{
	padding: 0 10px 0 10px;
	font-size: 3.2em;
	font-weight: bold;
	letter-spacing: 0.1em;
	background: linear-gradient(transparent 75%, white 0%);
	display: inline-block;
}

	#debulove .coma-font p span.small{font-size: 70%;}

#debulove .teacher-box{
	margin: 0 auto;
	padding: 3px 45px 20px 45px;
	width: 710px;
	background: #fff;
	box-sizing: border-box;
	transform: rotatez(-2.5deg);/*背景斜め*/
}

#debulove .teacher-box .posi_re{transform: rotatez(2.5deg);}/*背景斜めを戻す*/

	#debulove .teacher-box .fl img{border: 1px solid #000;}
	
	#debulove .teacher-box p{
		font-size: 2.5em;
		font-weight: bold;
		color: #ff3ab3;
		line-height: 1;
	}

		#debulove .teacher-box p span{font-size: 64%; color: #000;}

/*オリジナルコミックメディア化作品一覧*/
#debulove .bg02{
	padding: 0 0 55px 0;
	background: url(/auto/images/fix/250718_debulove/pcc/bg02.png) repeat-y;
	background-size: cover;
}

	#debulove .bg02 ul li img{border: 1px solid #000;}

	#debulove .bg02 ul li p {
	    font-size: 1em!important;
	    font-weight: bold;
	}

/********************************************************************
	11/1　追加記述
********************************************************************/
#debulove h3,#debulove h4,#debulove h5,#debulove h6{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro",
		"Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    letter-spacing: 0.15em;
}

/*見出し*/
#debulove .drama_box h3 {
    padding: 0 10px 0 10px;
    font-weight: normal;
    font-size: 1.7em;
    border-bottom: 1px solid #000;
    display: inline-block;
}

#debulove .drama_box h4 { 
	padding: 0 10px 0 10px;
	font-size: 2.5em;
	border-bottom: 2px dashed #ff3ab3;
	display: inline-block;
}

#debulove .drama_box h5 {
    color: #ff3ab3;
    font-size: 4em;
}

#debulove .drama_box h6 {
    color: #ff3ab3;
    font-size: 1.7rem;
}

/*通常記述*/
#debulove .drama_box{
	padding: 20px 20px 20px 25px;
	width: 100%;
	background: #fff;
	box-sizing: border-box;
}

#debulove .drama_box p,
#debulove .drama_box a{
    font-weight: normal;
    font-size: 1.7em;
    letter-spacing: 0.15em;
}

#debulove .drama_box p span.pink{
	font-size: 130%;
	font-weight: bold;
}

#debulove .drama_box h4 + p {
    line-height: 2;
}

#debulove .drama_box h4 + p span {
    border-bottom: 1px solid #000;
}

/*W主演*/
#debulove .drama_box h5 + div > p.starring_all {
	padding: 0 6px 0 10px;
    font-size: 4em;
    font-weight: bold;
    display: inline-block;
}

#debulove .drama_box h5 + div > p.starring01 {
    color: #fff;
    background: #ff3ab3;
	transform: rotatez(-5deg);
}

#debulove .drama_box h5 + div > p.starring02 {
    color: #000;
    background: #81fff1;
	transform: rotatez(5deg);
	position: relative;
	right: -70px;
}

	#debulove .drama_box h5 + div > p.starring02 span{font-size: 3rem;}

#debulove .drama_box p.starring01 + p {
	margin: -15px 0 5px 0;
    font-size: 7em!important;
    font-weight: normal!important;
}

#debulove .drama_box h6 + p {
    text-align: left;
    font-size: 1.4em;
    line-height: 1.7;
    letter-spacing: 0;
}

#debulove .drama_box .author_comment{
	font-size: 1.4em;
    line-height: 1.7;
    letter-spacing: 0;
}

#debulove .bg02 ul.drama_1101 li p{font-size: 0.8em!important;}

/********************************************************************
	11/5　追加記述
********************************************************************/
#debulove h7,#debulove h8{
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro",
		"Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    letter-spacing: 0.15em;
}

/*見出し*/
#debulove h7{
    font-size: 2.3em;
	font-weight: bold;
}

#debulove h8{
	text-align: left;
    font-size: 1.4em;
	color: #fd3cb1;
}

/*通常記述*/
#debulove .photo_img p{ 
	padding: 0 10px 0 10px;
    font-size: 2.3em;
    font-weight: bold;
    letter-spacing: 0.1em;
    background: linear-gradient(transparent 75%, #fd3cb1 0%, #fd3cb1 0%);
    display: inline-block;
}

#debulove .quo_present{
	padding: 20px 20px 20px 25px;
	width: 100%;
	text-align: left;
	background: #fff;
	box-sizing: border-box;
}

#debulove .quo_present p{
	text-align: left;
}

#debulove .quo_present ul li{font-size: 1.4em;}

#debulove .quo_end{
	text-align: center!important;
    font-size: 2.5em;
    font-weight: bold;
	background: #000;
    color: #fff;
}

/********************************************************************
	11/19分　わちゃわちゃんねる追加記述
********************************************************************/
#debulove .wacha_box h2 {bottom: 65px;}
#debulove .wacha_box h7 {font-size: 2.1em;}

#debulove .wacha_box{
	padding: 20px 20px 40px 25px;
	width: 100%;
	background: #fff;
	box-sizing: border-box;
}

#debulove .wacha_box p{
    font-weight: normal;
    font-size: 1.7em;
}

/********************************************************************
	20231117　アニメ化追加記述
********************************************************************/
#debulove nav.top-nav ul li{
	width: 280px;
	text-align: center;
	background: #fd3cb1;
	border: 2px solid #000;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 6px 6px #fff;
	box-sizing: border-box;
}

	#debulove nav.top-nav ul li a{
		padding: 4px 10px 4px 10px;
		font-size: 2.5em;
   		color: #fff;
    	font-weight: bold;
		display: block;
	}

#debulove nav.top-nav + p{font-weight: bold;}
#debulove nav.top-nav + p{font-size: 4.5em;}
#debulove nav.top-nav + p span.pink{font-size: 5.5rem}

#debulove .koisowa-link{
	text-align: center;
	background: #fd3cb1;
	border: 2px solid #000;
	border-radius: 60px;
	-webkit-border-radius: 60px;
	-moz-border-radius: 60px;
	box-shadow: 6px 6px #fff;
	box-sizing: border-box;
}

	#debulove .koisowa-link a{
		padding: 0px 10px 10px 10px;
		font-size: 3.5em;
   		color: #fff;
    	font-weight: bold;
		display: block;
		position: relative;
	}

	#debulove .koisowa-link a span{font-size: 2.5rem;}

#debulove .koisowa-link a::after{
	width: 30px;
	height: 30px;
	border-top: 2px solid #000;
	border-right: 2px solid #000;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	bottom: 0;
	right: 18px;
	margin: auto;
	content: "";
	vertical-align: middle;
}

#debulove .nav-anime .bg-box{
	padding: 50px 20px 50px 25px;
    width: 100%;
    background: #fff;
    box-sizing: border-box;
}

#debulove .nav-anime h3 {
    padding: 0 14px 0 14px;
    font-size: 2.5em;
    border-bottom: 2px dashed #fd3cb1;
    display: inline-block;
}

#debulove .nav-anime p{
	font-size: 1.3em;
	line-height: 2em;
}

#debulove .nav-anime small{font-size: 1em;}

/*アニメPV*/
#debulove .title-anime-pv{
	position: relative;
    bottom: -32px;
}

#debulove .title-anime-pv + .bg-box {
    padding: 80px 20px 80px 20px!important;
}

#debulove .title-anime-pv + div a {
    font-size: 1.8em;
}

/*アニメキャストコメント*/
#debulove .anime-cast-coment h4{
	padding: 0;
    font-size: 1.8em;
    border-bottom: 3px solid #fd3cb1;
    letter-spacing: 0;
	display: inline;
    line-height: 1.5em;
}

#debulove .anime-cast-coment h5{
	color: #fd3cb1;
	font-size: 1.6em;
}

#debulove .anime-cast-coment p{text-align: left;}

/*コマサム*/
#debulove .title-chiramise{
	position: relative;
    bottom: -32px;
}

/********************************************************************
	20250718　アニメ化追加記述
********************************************************************/
#debulove .bg01{background-size: 100%;}

#debulove p.can-time{
	padding: 5px 5px 5px 5px;
	font-size: 1.8rem;
	letter-spacing: 0.3rem;
	color: #fff;
	background: #fc3cb1;
}

#debulove .bg02 h3{
	font-size: 1.8rem;
	letter-spacing: 0;
}

#debulove .bg02 p{
	font-size: 1.2rem;
	line-height: 1.8;
}

#debulove{padding: 0 0 0 0;}