/*
当サイトのテキスト及び画像、それに伴う全ての無断転載は禁止いたします。
発見した場合は法的処置も視野にいれております。絶対に無断転載はお止めください。
*/
/*-----------------------*/
*{
	margin:0px;
	padding:0px;
}
body {
	-webkit-text-size-adjust: 100%;
	word-break: break-all;
	font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
	font-size: 14px;
	line-height: 1.2em;
	background: #fff;
}
#content{
	max-width: 600px;
	margin: 0 auto;
}

#header{
	text-align: center;
	font-weight: bold;
	color: #fff;
	text-shadow: 1px 1px 3px rgba(0,0,0,.3);
	background: linear-gradient(to bottom,  rgba(255,200,61,1) 0%,rgba(239,1,124,1) 100%);
}
#top_txt{
	position: relative;
}
#top_txt img{
	position: relative;
	z-index: 2;
	padding:10px 0;
}
#top_txt img:last-child{
	position: absolute;
	z-index: 1;
	top:0;
	left: 0;
	animation: toptxt_ud 1s ease-in-out infinite alternate;
}
@keyframes toptxt_ud {
	0% {top:10px;}
	100% {top:0px;}
}
#chara_box{
	display: flex;
	flex-wrap: wrap;
}
.chara_thumb{
	width: calc(50% - 6px);
	margin:0 2px 8px 4px;
	position: relative;
	display: block;
	overflow: hidden;
	background: #000;
}
.chara_thumb:nth-child(even){
	margin:0 4px 8px 2px;
}
.heart_icon{
	position: absolute;
	right: 3px;
	top: 3px;
	width: 20px;
	padding: 2px;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 50%;
}
.chara_data{
	position: absolute;
	color: #fff;
	font-weight: bold;
	padding:5px 5px 40px 5px;
	width: calc(100% - 10px);
	bottom:0;
	left: 0;
	font-size: 12px;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.6);
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 1%,rgba(0,0,0,0.34) 30%,rgba(0,0,0,0.35) 31%,rgba(0,0,0,0.5) 100%);

}
.chara_id span{
	font-size: 18px;
}
.login{
	position: absolute;
	border: 1px solid #fff;
	padding:0 5px;
	font-size: 8px;
	right: 5px;
	top:0;
	
}
.main_tag{
	position: relative;
	overflow: hidden;
	height: 16px;
	font-weight: bold;
}
.main_tag p{
	color: inherit;
	-webkit-text-fill-color: transparent;
	position: absolute;
	left: 0;
	top: 0;
	white-space: nowrap;
	font-size: 11px;
	line-height: 16px;
	transform: translate(0%);
	animation: tag_marquee 10s linear infinite normal forwards;
}
.main_tag p:last-child {
	animation: tag_marquee2 10s linear infinite normal forwards;
}
.main_tag p span.tag_grd {
	text-shadow: none;
	position: absolute;
	left: 0;
	top: 0;
	background: #44ffae;
	background: -moz-linear-gradient(left,  #44ffae 0%, #44d6ff 20%, #d059ff 40%, #ff5697 60%, #ffc042 80%, #fff242 99%);
	background: -webkit-linear-gradient(left,  #44ffae 0%,#44d6ff 20%,#d059ff 40%,#ff5697 60%,#ffc042 80%,#fff242 99%);
	background: linear-gradient(to right,  #44ffae 0%,#44d6ff 20%,#d059ff 40%,#ff5697 60%,#ffc042 80%,#fff242 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#44ffae', endColorstr='#fff242',GradientType=1 );
	-webkit-background-clip: text;
}
.main_tag p span {
	margin-right: 0.5em;
}
@keyframes tag_marquee {
	0% {transform:translate(0%);}
	100% {transform:translate(-100%);}
}
@keyframes tag_marquee2 {
	0% {transform:translate(100%);}
	100% {transform:translate(0%);}
}
.btn{
	width:90%;
	font-size: 13px;
	text-align: center;
	background: #44B92D;
	border-radius: 3px;
	line-height: 2em;
	border-bottom: solid 2px #1B6F0B;
	position: absolute;
	bottom:8px;
	left:5%;
	animation: btn_push 2s linear infinite normal;
}

@keyframes btn_push {
	0%,80% {bottom:8px;border-bottom: solid 2px #1B6F0B;}
	85% {bottom:7px;border-bottom: solid 0 #1B6F0B;}
	90% {bottom:8px;border-bottom: solid 2px #1B6F0B;}
	95% {bottom:7px;border-bottom: solid 0 #1B6F0B;}
	100% {bottom:8px;border-bottom: solid 2px #1B6F0B;}
}


#footer{
	font-size:12px;
	padding:30px 0 30px;
	margin:0;
	background: #000;
	color: #fff;
	text-align: center;
}
#footer p{
	margin:25px 0 0;
}
#footer a{
	color: #fff;
}




#title img{
	width:100%;
	margin:0;
}
.date{
	font-size: 12px;
	/*background: #89b1b0;
	color: #fff;*/
	color: #999;
	line-height: 1.4em;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0;
}
.date span{
	display: block;
	width:27%;
	padding-left:3%;
}
.date span:last-child{
	text-align: right;
	width:67%;
	padding:0 3% 0 0;
}
.readtime{
	font-size:12px;
	text-align: right;
	margin-bottom:0px;
}


/*content--------------------------------*/
p{
	margin: 0 10px 30px;
}
p span{
	font-weight: bold;
}
.img{
	margin: 0 0 30px;
}

.box div{
	margin: 0 0 75px;
}
.box section:last-child div:last-child,
.box section:last-child div:last-child .img{
	margin:0;
}

.box div.sns_data{
	width:86%;
	margin:0 auto;
}
.box div.sns_data div{
	position:relative;
}
.box div.sns_data div > p:first-child{
	z-index:1;
	position: relative;
}
.box div.sns_data div > p:last-child{
	z-index: 0;
	position: absolute;
	width:100%;
	top:0;
}
p.limit_ani{
	overflow-x: clip;
}
p.limit_ani img{
	position: relative;
	animation-name: limit_ani;
	animation-duration: .8s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: limit_ani;
	-webkit-animation-duration: .8s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: limit_ani;
	-moz-animation-duration: .8s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@keyframes limit_ani {
0% {transform:scale(1) rotate(0deg);}
50% {transform:scale(1.5) rotate(10deg);}
55% {transform:scale(1.5) rotate(-10deg);}
60% {transform:scale(1.5) rotate(8deg);}
65% {transform:scale(1.5) rotate(-8deg);}
70% {transform:scale(1.5) rotate(5deg);}
75% {transform:scale(1.5) rotate(-5deg);}
80% {transform:scale(1.5) rotate(3deg);}
85% {transform:scale(1.5) rotate(-2deg);}
90% {transform:scale(1.5) rotate(0deg);}
98% {transform:scale(.9) rotate(0deg);}
100% {transform:scale(1) rotate(0deg);}
}
@-webkit-keyframes limit_ani {
0% {-webkit-transform:scale(1) rotate(0deg);}
50% {-webkit-transform:scale(1.5) rotate(10deg);}
55% {-webkit-transform:scale(1.5) rotate(-10deg);}
60% {-webkit-transform:scale(1.5) rotate(8deg);}
65% {-webkit-transform:scale(1.5) rotate(-8deg);}
70% {-webkit-transform:scale(1.5) rotate(5deg);}
75% {-webkit-transform:scale(1.5) rotate(-5deg);}
80% {-webkit-transform:scale(1.5) rotate(3deg);}
85% {-webkit-transform:scale(1.5) rotate(-2deg);}
90% {-webkit-transform:scale(1.5) rotate(0deg);}
98% {-webkit-transform:scale(.9) rotate(0deg);}
100% {-webkit-transform:scale(1) rotate(0deg);}
}
@-moz-keyframes limit_ani {
0% {-moz-transform:scale(1) rotate(0deg);}
50% {-moz-transform:scale(1.5) rotate(10deg);}
55% {-moz-transform:scale(1.5) rotate(-10deg);}
60% {-moz-transform:scale(1.5) rotate(8deg);}
65% {-moz-transform:scale(1.5) rotate(-8deg);}
70% {-moz-transform:scale(1.5) rotate(5deg);}
75% {-moz-transform:scale(1.5) rotate(-5deg);}
80% {-moz-transform:scale(1.5) rotate(3deg);}
85% {-moz-transform:scale(1.5) rotate(-2deg);}
90% {-moz-transform:scale(1.5) rotate(0deg);}
98% {-moz-transform:scale(.9) rotate(0deg);}
100% {-moz-transform:scale(1) rotate(0deg);}
}

p.u_arr img{
	position: relative;
	top:0;
	left:0;
	animation-name: uarrow;
	animation-duration: .5s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	
	-webkit-animation-name: uarrow;
	-webkit-animation-duration: .5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	
	-moz-animation-name: uarrow;
	-moz-animation-duration: .5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
}
@keyframes uarrow {
0% {top:-5px;}
100% {top:10px;}
}
@-webkit-keyframes uarrow {
0% {top:-5px;}
100% {top:10px;}
}
@-moz-keyframes uarrow {
0% {top:-5px;}
100% {top:10px;}
}
p.txt_arr img{
	position: relative;
	top:0;
	left:0;
	animation-name: txtarrow;
	animation-duration: 1s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	
	-webkit-animation-name: txtarrow;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	
	-moz-animation-name: txtarrow;
	-moz-animation-duration: 1s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
}
@keyframes txtarrow {
0% {top:-5px;}
100% {top:10px;}
}
@-webkit-keyframes txtarrow {
0% {top:-5px;}
100% {top:10px;}
}
@-moz-keyframes txtarrow {
0% {top:-5px;}
100% {top:10px;}
}
/*sub_box--------------------------------*/
.box .sub_box{
	margin:0 10px 30px;
	padding:20px 10px;
	background: #fffef5;
	border: 1px solid #ffc84d;
}
/*sub_title--------------------------------*/
.sub_title{
	padding:2px 0;
	margin:0 0 30px;
	position: relative;	
}
/*ARR--------*/
.sub_title:before,
.sub_title:after {
	position: absolute;
	bottom: -12px;
	left: calc(50% - 26px);
	width: 0;
	height: 0;
	content: '';
	border-width: 28px 17px 0 17px;
	border-style: solid;
	border-color: #d0fdfc transparent transparent transparent;
}
.sub_title:before{
	bottom: -13px;
	border-color: #bbbbbb transparent transparent transparent;
	filter: blur(2px);
}
.sub_title p{
	font-weight: bold;
	font-size: 20px;
	margin:0;
	background:#d0fdfc;
	padding:20px 0;
	text-shadow: 1px 1px 1px rgba(255,255,255,1);
	position: relative;
	text-align: center;
	box-shadow: 0 2px 2px rgba(0,0,0,.1);
	
}
/*BORDER--------*/
.sub_title p:before,
.sub_title p:after{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 5px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #89b1b0, #89b1b0 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #89b1b0, #89b1b0 1px, transparent 2px, transparent 5px);
  background-size: 5px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.sub_title p:after{
  bottom: 0;
  top:auto;
}
.sub_box p:last-child,
.sub_title p{
	margin-bottom:0;
}


.box div.ank_contents{
	width:96%;
	margin:0 auto 100px;
	border:2px solid #bfbfbf;
	box-shadow: 0px 2px 5px rgba(0,0,0,.3);
}
.box div.ank_title{
	width: 100%;
	margin: 0 auto;
	background: #00bbb7;;
	position: relative;
}

.box div.ank_title p{
	font-weight: bold;
	font-size: 18px;
	margin: 0;
	padding-left: 5px;
	padding-top: 15px;
	padding-bottom: 20px;
	color: #fff;
	text-align: center;
	text-shadow: 1px 1px 2px rgba(0,0,0,.2);
	line-height: 1.3em;
}
.box div.ank_title  p:first-child::before{
	content: '';
	position: absolute;
	bottom: -14px;
	left: calc(50% - 8px);
	border-top: 14px solid #00bbb7;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	z-index: 1;
}
.box div.ank_title p:last-child{
	font-size:12px;
	position: absolute;
	right:5px;
	bottom:2px;
	padding:0;
}

.box ul.ans_list {
	margin: 15px auto 50px;
}
.box ul.ans_list li {
	list-style-type: none;
	text-align: center;
	width:calc(90% - 2px);
	border:1px solid #999;
	border-radius: 10px;
	margin:0 auto 8px;
	line-height: 3em;
	font-weight: bold;
	font-size: 16px;
	position: relative;
}
.box ul.ans_list li::before{
	content: '';
	position: absolute;
	width:14px;
	height: 14px;
	left:12px;
	top: 16px;
	border: 1px solid #c1c1c1;
	background: #dddddd;
	border-radius: 3px;
}
.box ul.ans_list li.ans_select{
	background: #f19e00;
	color:#fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,.5);
	transition: all .4s;
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
}
.box ul.ans_list li.ans_select::before{
	background: #533600;
	border:1px solid #fff;
}
.box ul.ans_list li.ans_select::after{
	content: '';
	position: absolute;
	border-bottom: 3px solid #f3ff36;
	border-left: 3px solid #f3ff36;
	height: 5px;
	width: 14px;
	transform: rotate(-45deg);
	top: 16px;
	left: 15px;
}
/*comic1anc用-----------------------------------------*/
.anc_offer,
.anc_ank{
	position: relative;
	z-index: 1;
}
.ol_anc{
	position: fixed;
	width:100%;
	bottom:0;
	z-index: 1;
	overflow: hidden;
	display: none;
}
.ol_anc .ol001_txt{
	z-index: 2;
	position: absolute;
	top:0;
	width:100%;
}
.ol_anc .ol001_btn{
	z-index: 2;
	position: absolute;
	top:0;
	width:100%;
	animation-name: ol_anc_btn;
	animation-duration: 2s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	
	-webkit-animation-name: ol_anc_btn;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	
	-moz-animation-name: ol_anc_btn;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
}
@keyframes ol_anc_btn {
0% {left:-5px;}
5% {left:5px;}
10% {left:-5px;}
15% {left:5px;}
20% {left:-3px;}
25% {left:3px;}
30% {left:-1px;}
35% {left:1px;}
40% {left:0px;}
100% {left:0px;}
}
@-webkit-keyframes ol_anc_btn {
0% {left:-5px;}
5% {left:5px;}
10% {left:-5px;}
15% {left:5px;}
20% {left:-3px;}
25% {left:3px;}
30% {left:-1px;}
35% {left:1px;}
40% {left:0px;}
100% {left:0px;}
}
@-moz-keyframes ol_anc_btn {
0% {left:-5px;}
5% {left:5px;}
10% {left:-5px;}
15% {left:5px;}
20% {left:-3px;}
25% {left:3px;}
30% {left:-1px;}
35% {left:1px;}
40% {left:0px;}
100% {left:0px;}
}
/*comic1movint用--------------------------------*/
:root{
	--baseWidth: 100vw;
}
@media screen and (min-width:600px) {
	:root{
		--baseWidth: 600px;
	}
}
.box div.mg0 {
	margin: 0;
}
.af_answer{
	height: 0;
	overflow: hidden;
	transition: height 0.5s;
}
.box .ank_contents_movint {
	width: 100%;
	margin: 0 auto;
}
.box .ank_contents_movint div {
	margin: 0;
}
.intractv_box {
	position: relative;
}
.intractv_box .intractv_mov {
	width: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
.intractv_box .intractv_mov.int_splash {
	width: 100%;
	position: relative;
	z-index: 1;
}
.intractv_box .ques1 {
	z-index: 2;
	display: none;
}
.intractv_box .int_ts001-002 {
	z-index: 3;
	display: none;
}
.intractv_box .ques2 {
	z-index: 4;
	display: none;
}
.intractv_box .int_ts002-003 {
	z-index: 5;
	display: none;
}
.intractv_box .ques3 {
	z-index: 6;
	display: none;
}
.intractv_box .int_ts003-004 {
	z-index: 7;
	display: none;
}
.intractv_box .ques4 {
	z-index: 8;
	display: none;
}
.intractv_box .int_ts004-005 {
	z-index: 9;
	display: none;
}
.intractv_box .ques5 {
	z-index: 10;
	display: none;
}
.intractv_box .int_ts005-result {
	z-index: 11;
	display: none;
}
.intractv_box .int_result {
	z-index: 12;
	display: none;
}
.intractv_box .intractv_mov > div {
	width: 100%;
	position: relative;
}
.intractv_box .intractv_mov video,
.intractv_box .intractv_mov img {
	position: relative;
	z-index: 1;
}
.intractv_box .intractv_mov p {
	margin: 0;
	position: relative;
	z-index: 1;
}
.intractv_box .intractv_mov .tap_area {
	width: 100%;
	height: calc(500 / 750 * var(--baseWidth));
	position: absolute;
	left: 0;
	bottom: calc(36 / 750 * var(--baseWidth) * 0.96);
	z-index: 2;
}
.intractv_box .intractv_mov .tap_area > div {
	width: 100%;
	height: 100%;
	position: relative;
}
.intractv_box .intractv_mov .tap_area .tap_select {
	width: 72%;
	height: 18%;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
}
.intractv_box .q_type1 .tap_area .tp1 {
	top: 20%;
}
.intractv_box .q_type1 .tap_area .tp2 {
	top: 43.6%;
}
.intractv_box .q_type1 .tap_area .tp3 {
	top: 67.2%;
}
.intractv_box .q_type2 .tap_area .tp1 {
	top: 8%;
}
.intractv_box .q_type2 .tap_area .tp2 {
	top: 31.6%;
}
.intractv_box .q_type2 .tap_area .tp3 {
	top: 55.2%;
}
.intractv_box .q_type2 .tap_area .tp4 {
	top: 78.8%;
}
/*comi1spl--------------------------------**/
#spl_content{
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
	position: fixed;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	z-index: 1;
	
	animation-name: spl_blur;
	animation-duration: .8s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: spl_blur;
	-webkit-animation-duration: .8s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: spl_blur;
	-moz-animation-duration: .8s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@keyframes spl_blur {
0% {backdrop-filter: blur(0);}100% {backdrop-filter: blur(5px);}
}
@-webkit-keyframes spl_blur {
0% {-webkit-backdrop-filter: blur(0);}100% {-webkit-backdrop-filter: blur(5px);}
}
@-moz-keyframes spl_blur {
0% {-moz-backdrop-filter: blur(0);}100% {-moz-backdrop-filter: blur(5px);}
}
#spl_content video{
	display: none;
	position: absolute;
	top:28%;
	z-index: 1;
}
.splmain_txt,
.spl_alert{
	display: none;
	position: absolute;
	z-index: 2;
}
.splmain_txt.animate1{
	top:30%;
	display:block;
	transform: rotate(0deg) scale(1);
	
	animation-name: spl_txt;
	animation-duration: 1.8s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: spl_txt;
	-webkit-animation-duration: 1.8s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: spl_txt;
	-moz-animation-duration: 1.8s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}

@keyframes spl_txt {
0% {transform: rotate(-30deg) scale(0.2);}
30% {transform: rotate(20deg) scale(1.2);}
32% {transform: rotate(0deg) scale(1.3);}
34% {transform: rotate(15deg) scale(1.4);}
38% {transform: rotate(2deg) scale(1.5);}
42% {transform: rotate(12deg) scale(1.6);}
46% {transform: rotate(5deg) scale(1.7);}
50% {transform: rotate(10deg) scale(1.8);}
54% {transform: rotate(5deg) scale(1.9);}
58% {transform: rotate(10deg) scale(2);}
70% {transform: rotate(5deg) scale(.9);}
72% {transform: rotate(4deg) scale(1.1);}
74% {transform: rotate(3deg) scale(.95);}
76% {transform: rotate(2deg) scale(1.05);}
78% {transform: rotate(1deg) scale(.98);}
80% {transform: rotate(0deg) scale(1);}
100% {transform: rotate(0deg) scale(1);}
}
@-webkit-keyframes spl_txt {
0% {-webkit-transform: rotate(-30deg) scale(0.2);}
30% {-webkit-transform: rotate(20deg) scale(1.2);}
32% {-webkit-transform: rotate(0deg) scale(1.3);}
34% {-webkit-transform: rotate(15deg) scale(1.4);}
38% {-webkit-transform: rotate(2deg) scale(1.5);}
42% {-webkit-transform: rotate(12deg) scale(1.6);}
46% {-webkit-transform: rotate(5deg) scale(1.7);}
50% {-webkit-transform: rotate(10deg) scale(1.8);}
54% {-webkit-transform: rotate(5deg) scale(1.9);}
58% {-webkit-transform: rotate(10deg) scale(2);}
70% {-webkit-transform: rotate(5deg) scale(.9);}
72% {-webkit-transform: rotate(4deg) scale(1.1);}
74% {-webkit-transform: rotate(3deg) scale(.95);}
76% {-webkit-transform: rotate(2deg) scale(1.05);}
78% {-webkit-transform: rotate(1deg) scale(.98);}
80% {-webkit-transform: rotate(0deg) scale(1);}
100% {-webkit-transform: rotate(0deg) scale(1);}
}
@-moz-keyframes spl_txt {
0% {-moz-transform: rotate(-30deg) scale(0.2);}
30% {-moz-transform: rotate(20deg) scale(1.2);}
32% {-moz-transform: rotate(0deg) scale(1.3);}
34% {-moz-transform: rotate(15deg) scale(1.4);}
38% {-moz-transform: rotate(2deg) scale(1.5);}
42% {-moz-transform: rotate(12deg) scale(1.6);}
46% {-moz-transform: rotate(5deg) scale(1.7);}
50% {-moz-transform: rotate(10deg) scale(1.8);}
54% {-moz-transform: rotate(5deg) scale(1.9);}
58% {-moz-transform: rotate(10deg) scale(2);}
70% {-moz-transform: rotate(5deg) scale(.9);}
72% {-moz-transform: rotate(4deg) scale(1.1);}
74% {-moz-transform: rotate(3deg) scale(.95);}
76% {-moz-transform: rotate(2deg) scale(1.05);}
78% {-moz-transform: rotate(1deg) scale(.98);}
80% {-moz-transform: rotate(0deg) scale(1);}
100% {-moz-transform: rotate(0deg) scale(1);}
}

.splmain_txt.animate2{
	top:2%;
	display:block;
	
	animation-name: spl_txt_up;
	animation-duration: .5s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: spl_txt_up;
	-webkit-animation-duration: .5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: spl_txt_up;
	-moz-animation-duration: .5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@keyframes spl_txt_up {
0% {top:30%;}100% {top:0%;}
}
@-webkit-keyframes spl_txt_up {
0% {top:30%;}100% {top:0%;}
}
@-moz-keyframes spl_txt_up {
0% {top:30%;}100% {top:0%;}
}


.spl_alert.animate1{
	display:block;
	top:73%;
	opacity: 1;
	
	animation-name: spl_alert;
	animation-duration: .5s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: spl_alert;
	-webkit-animation-duration: .5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: spl_alert;
	-moz-animation-duration: .5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@keyframes spl_alert {
0% {top:50%;opacity: 0;}100% {top:75%;opacity: 1;}
}
@-webkit-keyframes spl_alert {
0% {top:50%;opacity: 0;}100% {top:75%;opacity: 1;}
}
@-moz-keyframes spl_alert {
0% {top:50%;opacity: 0;}100% {top:75%;opacity: 1;}
}
.spl_alert.animate2{
	display:block;
	top:75%;
	
	animation-name: spl_alert_updpwm;
	animation-duration: 1.5s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	
	-webkit-animation-name: spl_alert_updpwm;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	
	-moz-animation-name: spl_alert_updpwm;
	-moz-animation-duration: 1.5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
}
@keyframes spl_alert_updpwm {
0% {top:75%;}100% {top:78%;}
}
@-webkit-keyframes spl_alert_updpwm {
0% {top:75%;}100% {top:78%;}
}
@-moz-keyframes spl_alert_updpwm {
0% {top:75%;}100% {top:78%;}
}

#spl_content video.animate1{
	transform: scale(1);
	display: block;
	
	animation-name: spl_video;
	animation-duration: .8s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: 1;
	animation-direction: normal;
	
	-webkit-animation-name: spl_video;
	-webkit-animation-duration: .8s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-direction: normal;
	
	-moz-animation-name: spl_video;
	-moz-animation-duration: .8s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-iteration-count: 1;
	-moz-animation-direction: normal;
}
@keyframes spl_video {
0% {transform: scale(0.05); filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
50% {transform: scale(0.02,0.3);filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
65% {transform: scale(1, 0.05);filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
100% {transform: scale(1); filter: blur(0px) brightness(100%) contrast(100%) opacity(1);}
}
@-webkit-keyframes spl_video {
0% {-webkit-transform: scale(0.05); -webkit-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
50% {-webkit-transform: scale(0.02,0.3);-webkit-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
65% {-webkit-transform: scale(1, 0.05);-webkit-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
100% {-webkit-transform: scale(1); -webkit-filter: blur(0px) brightness(100%) contrast(100%) opacity(1);}
}
@-moz-keyframes spl_video {
0% {-moz-transform: scale(0.05); -moz-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
50% {-moz-transform: scale(0.02,0.3);-moz-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
65% {-moz-transform: scale(1, 0.05);-moz-filter: blur(5px) brightness(150%) contrast(150%) opacity(.5);}
100% {-moz-transform: scale(1); -moz-filter: blur(0px) brightness(100%) contrast(100%) opacity(1);}
}

.spl_close{
	position: absolute;
	top:8px;
	right: 8px;
	width:32px;
	line-height: 32px;
	background: #D10003;
	border:2px solid #fff;
	box-shadow: 1px 1px 2px rgba(0,0,0,.3);
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,.3);
	text-align: center;
	font-size:24px;
	border-radius: 8px;
	font-weight: bold;
	z-index: 3;
}



/*mlink--------------------------------*/
#mlink_footer{
	background: rgba(255,255,255,.5);
	position: fixed;
	bottom:-100%;
	width:100%;
	height: 100%;
	z-index: 100;
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
	display: none;
}
#mlink_footer.mlink_show{
	bottom:0;
	transition: all 5s;
	-webkit-transition: all 5s;
	-moz-transition: all 5s;
}
.mlink_close{
	position: absolute;
	margin-top:16%;
	right: 4%;
	font-weight: bold;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,.2);
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	height: 32px;
	padding: 0 10px;
	font-size:12px;
	line-height: 32px;
	border-radius: 5px 5px 0 0;
	border:2px solid #fff;
	border-bottom:none;
	text-align: center;
	background: #ff0509;
	background: -moz-linear-gradient(top,  #ff0509 0%, #6d0019 100%);
	background: -webkit-linear-gradient(top,  #ff0509 0%,#6d0019 100%);
	background: linear-gradient(to bottom,  #ff0509 0%,#6d0019 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0509', endColorstr='#6d0019',GradientType=0 );
	z-index: 101;
}
#mlink_footer img,
#mlink_footer video{
	width:92%;
	margin:25% auto 0;
	display: block;
	box-shadow: 0 0 8px rgba(0,0,0,.5);
}
#mlink_footer > img{
    width: 30%;
    position: absolute;
    bottom: 3%;
    left: 5%;
}
#mlink_footer > p:last-child{
	position: absolute;
	bottom:15px;
	right:10px;
	margin:0;
}
#mlink_footer > p:last-child a{
	font-size: 10px;
	color: #333;
}
/*info_box--------------------------------*/
#info_box {
	border-collapse: separate;
	border-spacing: 0;
	text-align: left;
	line-height: 1.5;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	margin: 0px auto 100px auto;
	width: 94%;
	font-size: 13px;
}
#info_box th {
	width: 100px;
	padding: 10px;
	font-weight: bold;
	vertical-align: middle;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	background: #eee;
}
#info_box td {
	width: auto;
	padding: 10px;
	vertical-align: top;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}

/*common--------------------------------*/
a,
a.btn_link{
	display: block;
	position: relative;
	z-index: 1;
}
img,
video{
	width:100%;
	display: block;
}
.center{
	text-align: center;
}
.box .no_margin{
	margin-bottom: 5px;
}
.box .sns_data .no_margin{
	margin-bottom: 0;
}
p.sub_txt{
	font-weight: normal;
	text-align: right;
	font-size: 10px;
	display: block;
	color: #777777;
	line-height: 14px;
}
.sns_data p.sub_txt{
	margin:0 0 15px;
}
.red{
	color: #CC0003;
}
.blue{
	color: #0054AC;
}
.pink{
	color: #FF105A;
}
.yellow{
	color:#f9ff00;
}
.grey{
	color: #777777;
}
.bk_box{
	background:#000;
	color:#fff;
	padding:6px 12px;
}
.uline{
	text-decoration: underline;
}
.txt16{
	font-size:16px;
	line-height: 1.2em;
}
.txt20{
	font-size:20px;
	line-height: 1.4em;
}
.txt24{
	font-size:24px;
	line-height: 1.6em;
}
.txt28{
	font-size:28px;
	line-height: 1.3em;
}
.notes{
	font-size: 10px;
	vertical-align: super;
	color: #777777;	
}
.marker {
	background: -webkit-linear-gradient(left, #F8FF03 50%, transparent 50%) 100% 0% / 200% 35% no-repeat;
	background: linear-gradient(to right, #F8FF03 50%, transparent 50%) 100% 0% / 200% 35% no-repeat;
	transition: background-position 1s ease-out;
	-webkit-transition: background-position 1s ease-out;
	background-position: 0% bottom;
}
/*PC--------------------------------*/
@media screen and (min-width: 600px) {
/*sub_title*/
.sub_title p{
	font-size:24px;
}
.sub_title p .txt24{
	font-size:28px;
}
/*sns_data*/
.box div.sns_data{
	width:78%;
}

/*mlink*/
#mlink_footer > a{
	width: 500px;
	display: block;
	margin: 100px auto 0;
}
#mlink_footer img, #mlink_footer video {
	width: 500px;
}
#mlink_footer img.muted_btn{
    width: 120px;
	cursor: pointer;
}
.mlink_close{
	margin-top:92px;
	margin-right:-252px;
	right:50%;
	cursor: pointer;
}
.btn_link:hover,
#mlink_footer img.muted_btn:hover,
.mlink_close:hover{
	opacity: .8;
}
/*comic1anc*/
.anc_offer:hover,
.anc_ank:hover{
	opacity: .8;
	cursor: pointer;
}
.ol_anc{
	max-width: 500px;
	bottom:5px;
	right: 5px;
}
.ol_anc:hover{
	opacity: .8;
	cursor: pointer;
}
/*comic1movint*/
.intractv_box .intractv_mov .tap_area .tap_select {
	cursor: pointer;
}
/*comi1spl--------------------------------**/
#spl_content{
	max-width:600px;
	left:calc(50% - 300px);
}
}
