﻿@media only screen and (min-width: 768px) {
	.wrap-inner .btn {
		position: relative;
		z-index: 2;
		padding-top: 15px
	}
	.wrap-inner .btn a {
		background-image: url(/cmp/otaku/common/img/btn_entry-off.png);
		background-size: 476px auto;
		width: 476px;
		height: 96px;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	.wrap-inner .btn a:hover {
		background-image: url(/cmp/otaku/common/img/btn_entry-on.png)
	}
	.main-ttl {
		height: 780px;
		position: relative;
		width: 100%;
		text-align: center;
		min-width: 1000px;
		overflow: hidden;
		background: url(/cmp/otaku/common/img/bg_main.jpg) no-repeat 50% 100%;
		background-size: cover;
		padding-left: 22%
	}
	.main-ttl.nagoya {
		height: 780px;
		position: relative;
		width: 100%;
		text-align: center;
		min-width: 1000px;
		overflow: hidden;
		background: url(/cmp/otaku/common/img/bg_main_nagoya.jpg) no-repeat 50% 100%;
		background-size: cover;
		padding-left: 22%
	}
	.main-ttl h1 {
		position: absolute;
		text-align: left;
		left: -50px;
		top: -50px
	}
	.main-ttl h1 img {
		width: 576px;
		max-height: 780px
	}
	.main-ttl .profile {
		padding-top: 20px;
		position: relative;
		z-index: 1
	}
	.main-ttl .comment {
		position: relative;
		z-index: 2
	}
	.main-ttl .cara {
		right: 10%;
		bottom: 0;
		position: absolute;
		z-index: 1
	}
	.story-box {
		height: 496px;
		background: url(/cmp/otaku/common/img/bg_green_border.png);
		background-size: 68px auto;
		position: relative
	}
	.story-box h2 {
		text-align: center;
		margin-top: 35px;
		position: absolute;
		right: 50%;
		margin-right: -340px
	}
	.story-box h2 img {
		width: 217px;
		height: auto
	}
	.story-box .txt {
		height: 496px;
		text-align: center;
		background: url(/cmp/otaku/common/img/bg_story.png) no-repeat 50% 50%;
		background-size: 914px auto;
		line-height: 496px;
		padding-left: 50px
	}
	.story-box:after {
		content: "";
		background: url(/cmp/otaku/common/img/fig-main2.png) no-repeat 100% 100%;
		background-size: 230px auto;
		height: 419px;
		width: 230px;
		position: absolute;
		bottom: 0px;
		left: 50%;
		margin-left: -450px
	}
	.line-box {
		background: url(/cmp/otaku/common/img/bg_line_base.png);
		background-size: 200px auto;
		padding: 40px 0
	}
	.line-box .line-frame {
		width: 414px;
		margin: 0 auto;
		background: url(/cmp/otaku/common/img/bg-line-top.png) no-repeat 0 0 #7292C0;
		background-size: 414px auto;
		padding-top: 70px;
		position: relative;
		box-shadow: 0 0 10px 0 #eee
	}
	.line-box .line-frame:after {
		content: "";
		background: url(/cmp/otaku/common/img/bg-line-bottom.png) no-repeat;
		background-size: 414px auto;
		width: 414px;
		height: 675px;
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 1
	}
	.line-box .line-frame dl {
		position: relative;
		z-index: 2;
		padding: 10px 5px;
		overflow: visible;
		clear: both
	}
	.line-box .line-frame dl dt img {
		height: 35px
	}
	.line-box .line-frame dl.kayo {
		float: right
	}
	.line-box .line-frame dl.kayo:after {
		left: 20px
	}
	.line-box .line-frame dl.kayo dt {
		text-align: right
	}
	.line-box .line-frame dl.kayo dd {
		background: #85e249;
		float: right
	}
	.line-box .line-frame dl.kayo dd:after {
		background: url(/cmp/otaku/common/img/bg-fuki-kayo.png) no-repeat;
		background-size: auto 17px;
		right: -5px;
		top: -1px
	}
	.line-box .line-frame dl.pp {
		float: left
	}
	.line-box .line-frame dl.pp:after {
		right: 20px
	}
	.line-box .line-frame dl.pp dt {
		text-align: left
	}
	.line-box .line-frame dl.pp dd {
		background: #fff;
		float: left
	}
	.line-box .line-frame dl.pp dd:after {
		background: url(/cmp/otaku/common/img/bg-fuki-pp.png) no-repeat;
		background-size: auto 17px;
		left: -5px;
		top: -1px
	}
	.line-box .line-frame dl dd {
		font-size: 1.1rem;
		line-height: 1.5;
		border-radius: 18px;
		margin: 0 40px;
		position: relative;
		padding: 15px;
		overflow: visible !important
	}
	.line-box .line-frame dl dd:after {
		content: "";
		position: absolute;
		width: 18px;
		height: 17px
	}
	.line-box .line-frame dl dd.stump {
		background: none;
		padding: 15px 0 0
	}
	.line-box .line-frame dl dd.stump:after {
		display: none
	}
	.line-box .line-frame dl dd.stump img {
		width: 180px;
		height: auto
	}
	.line-box .line-frame dl:after {
		content: "";
		background: url(/cmp/otaku/common/img/txt-kidoku.png) no-repeat;
		background-size: auto 9px;
		position: absolute;
		bottom: 10px;
		width: 18px;
		height: 9px
	}
	.line-box .line-frame .finish {
		clear: both;
		position: relative;
		z-index: 2;
		text-align: center;
		padding: 30px 0 80px
	}
	.line-box .line-frame .finish img {
		width: 151px
	}
	.search-btn {
		position: relative;
		z-index: 2;
		padding-top: 15px
	}
	.search-btn a {
		background-image: url(/cmp/otaku/common/img/btn_check_off.png);
		background-size: 476px auto;
		width: 476px;
		height: 96px;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	.search-btn.nagoya a {
		background-image: url(/cmp/otaku/common/img/btn_nagoya_check_off.png);
		background-size: 476px auto;
		width: 476px;
		height: 96px;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	.search-btn a:hover {
		background-image: url(/cmp/otaku/common/img/btn_check_on.png)
	}
	.search-btn.nagoya a:hover {
		background-image: url(/cmp/otaku/common/img/btn_nagoya_check_on.png)
	}
	#flow {
		background: url(/cmp/otaku/common/img/bg_dot.png);
		background-size: 15px auto;
		padding: 30px 0;
		border-top: 10px solid #ff80b0
	}
	#flow header {
		text-align: center;
		width: 1000px;
		margin: 0 auto;
		padding: 0 15px 50px;
		overflow: hidden;
		zoom: 1
	}
	#flow header h2 {
		float: left
	}
	#flow header p {
		width: 620px;
		text-align: left;
		float: right;
		padding-top: 40px
	}
	#flow .flow-inner {
		width: 800px;
		margin: 0 auto
	}
	#flow .flow-inner dl {
		min-height: 220px;
		background: #fff;
		border: 5px solid #ffdbea;
		border-radius: 10px;
		margin-bottom: 40px;
		padding: 20px 20px 20px 280px;
		position: relative;
		overflow: visible
	}
	#flow .flow-inner dl dt {
		font-size: 1.8rem;
		color: #ff1c8c
	}
	#flow .flow-inner dl dt span {
		position: absolute;
		left: 15px;
		top: -28px
	}
	#flow .flow-inner dl dd {
		font-size: 1.3rem;
		padding-top: 15px
	}
	#flow .flow-inner dl dd figure {
		position: absolute;
		left: 20px;
		top: 20px
	}
	#flow .flow-inner dl dd figure img {
		width: 240px;
		height: auto
	}
	#flow .flow-inner dl dd figure figcaption {
		font-size: 1rem;
		display: block;
		padding-top: 5px;
		text-align: left;
		color: #ff7eb1
	}
	.recommend-box {
		background: url(/cmp/otaku/common/img/bg_recommend.png) no-repeat 50% 50%;
		background-size: 1236px auto;
		padding: 40px 0
	}
	.recommend-box h3 {
		text-align: center;
		padding: 0 0 55px;
		background: url(/cmp/otaku/common/img/bg_line.png) no-repeat 50% 100%;
		background-size: auto 9px;
		margin-bottom: 50px
	}
	.recommend-box .txt {
		width: 1000px;
		font-size: 1.6rem;
		line-height: 1.8;
		margin: 0 auto;
		text-align: center;
		overflow: hidden
	}
	.recommend-box .txt p {
		padding-bottom: 40px
	}
	.recommend-box .txt figure {
		width: 50%;
		float: left;
		text-align: center;
		padding-bottom: 20px
	}
	.recommend-box .txt figure img {
		width: 480px;
		height: auto;
		border: 5px solid #eee
	}
	.recommend-box .txt figure figcaption {
		font-size: 1.4rem;
		display: block;
		padding-top: 5px
	}
}

@media only screen and (max-width: 767px) {
	.wrap-inner .btn {
		position: relative;
		z-index: 2;
		padding-top: 1.5rem
	}
	.wrap-inner .btn a {
		background-image: url(/cmp/otaku/common/img/btn_entry-off.png);
		background-size: 30rem auto;
		width: 30rem;
		height: 6rem;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	.main-ttl {
		height: 40rem;
		position: relative;
		text-align: center;
		overflow: hidden;
		background: url(/cmp/otaku/common/img/bg_main.jpg) no-repeat 50% 100%;
		background-size: cover
	}
	.main-ttl.nagoya {
		height: 40rem;
		position: relative;
		text-align: center;
		overflow: hidden;
		background: url(/cmp/otaku/common/img/bg_main_nagoya.jpg) no-repeat 50% 100%;
		background-size: cover
	}
	.main-ttl h1 {
		position: absolute;
		text-align: left;
		left: -2.4rem;
		top: -2.8rem
	}
	.main-ttl h1 img {
		width: 20rem
	}
	.main-ttl .profile {
		padding-top: 0rem;
		padding-left: 8rem;
		position: relative;
		z-index: 1
	}
	.main-ttl .profile img {
		width: 12rem;
		height: auto
	}
	.main-ttl .comment {
		position: relative;
		z-index: 2
	}
	.main-ttl .comment.c2 img {
		width: 95%
	}
	.main-ttl .comment.c1 {
		padding-top: 4rem
	}
	.main-ttl .comment.c1 img {
		width: 50%;
		height: auto
	}
	.main-ttl .cara {
		right: -2rem;
		bottom: 0;
		position: absolute;
		z-index: 1
	}
	.main-ttl .cara img {
		width: 12rem
	}
	.story-box {
		background: url(/cmp/otaku/common/img/bg_green_border.png);
		background-size: 68px auto;
		position: relative;
		overflow: hidden
	}
	.story-box h2 {
		position: absolute;
		right: 0;
		top: 1rem
	}
	.story-box h2 img {
		width: 16rem;
		height: auto
	}
	.story-box .txt {
		text-align: right;
		background-image: url(/cmp/otaku/common/img/bg_story.png);
		background-repeat: no-repeat;
		background-position: 50% 50%;
		background-size: 70rem 50rem;
		padding: 10rem 1rem 8rem 6rem
	}
	.story-box .txt img {
		width: 21rem;
		height: auto
	}
	.story-box:after {
		content: "";
		background: url(/cmp/otaku/common/img/fig-main2.png) no-repeat 100% 100%;
		background-size: 13rem auto;
		width: 13rem;
		height: 26rem;
		position: absolute;
		bottom: 0px;
		left: -4rem
	}
	.line-box {
		background: url(/cmp/otaku/common/img/bg_line_base.png);
		background-size: 20rem auto;
		padding: 1rem 1rem 2rem;
		clear: both
	}
	.line-box .line-frame {
		margin: 0 auto;
		background: url(/cmp/otaku/common/img/bg-line-top.png) no-repeat 0 0 #7292C0;
		background-size: 30rem auto;
		padding-top: 5.5rem;
		position: relative;
		box-shadow: 0 0 1rem 0 #eee
	}
	.line-box .line-frame:after {
		content: "";
		background: url(/cmp/otaku/common/img/bg-line-bottom.png) no-repeat 0 100%;
		background-size: 30rem auto;
		width: 30rem;
		height: 49rem;
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 1
	}
	.line-box .line-frame dl {
		position: relative;
		z-index: 2;
		padding: 1rem .5rem;
		overflow: visible;
		clear: both
	}
	.line-box .line-frame dl dt img {
		height: 2.7rem
	}
	.line-box .line-frame dl.kayo {
		float: right
	}
	.line-box .line-frame dl.kayo:after {
		left: .3rem
	}
	.line-box .line-frame dl.kayo dt {
		text-align: right
	}
	.line-box .line-frame dl.kayo dd {
		background: #85e249;
		float: right
	}
	.line-box .line-frame dl.kayo dd:after {
		background: url(/cmp/otaku/common/img/bg-fuki-kayo.png) no-repeat;
		background-size: auto 1.2rem;
		right: -.5rem;
		top: -.1rem
	}
	.line-box .line-frame dl.pp {
		float: left
	}
	.line-box .line-frame dl.pp:after {
		right: .3rem
	}
	.line-box .line-frame dl.pp dt {
		text-align: left
	}
	.line-box .line-frame dl.pp dd {
		background: #fff;
		float: left
	}
	.line-box .line-frame dl.pp dd:after {
		background: url(/cmp/otaku/common/img/bg-fuki-pp.png) no-repeat;
		background-size: auto 1.2rem;
		left: -.5rem;
		top: -.1rem
	}
	.line-box .line-frame dl dd {
		font-size: 1.1rem;
		line-height: 1.4;
		border-radius: 1rem;
		margin: 0 2.3rem;
		position: relative;
		padding: 1rem;
		overflow: visible !important
	}
	.line-box .line-frame dl dd:after {
		content: "";
		position: absolute;
		width: 1.3rem;
		height: 1.2rem
	}
	.line-box .line-frame dl dd.stump {
		background: none;
		padding: 1rem 0 0
	}
	.line-box .line-frame dl dd.stump:after {
		display: none
	}
	.line-box .line-frame dl dd.stump img {
		width: 12rem;
		height: auto
	}
	.line-box .line-frame dl:after {
		content: "既読";
		position: absolute;
		bottom: 1rem;
		font-size: .9rem;
		color: #fff;
		letter-spacing: 0
	}
	.line-box .line-frame .finish {
		clear: both;
		position: relative;
		z-index: 2;
		text-align: center;
		padding: 2rem 0 5rem
	}
	.line-box .line-frame .finish img {
		width: 12rem
	}
	.search-btn {
		position: relative;
		z-index: 2;
		padding-top: 1.5rem
	}
	.search-btn a {
		background-image: url(/cmp/otaku/common/img/btn_check_off.png);
		background-size: 30rem auto;
		width: 30rem;
		height: 6rem;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	.search-btn.nagoya a {
		background-image: url(/cmp/otaku/common/img/btn_nagoya_check_off.png);
		background-size: 30rem auto;
		width: 30rem;
		height: 6rem;
		display: block;
		margin: 0 auto;
		text-indent: -9999px
	}
	#flow {
		background: url(/cmp/otaku/common/img/bg_dot.png);
		background-size: 15px auto;
		padding: 2rem 0
	}
	#flow header {
		text-align: center;
		padding-bottom: 1.5rem
	}
	#flow header h2 {
		transform: rotate(6deg);
		padding-right: 3rem
	}
	#flow header h2 img {
		width: 20rem;
		height: auto
	}
	#flow header p {
		padding: 1rem 1.5rem
	}
	#flow .btn {
		padding-top: 0
	}
	#flow .flow-inner {
		margin: 0 1.5rem
	}
	#flow .flow-inner .txt {
		font-size: 1.3rem;
		padding-bottom: 2rem
	}
	#flow .flow-inner dl {
		background: #fff;
		border-radius: 1.5rem;
		border: 0.4rem solid #ffdbea;
		margin-bottom: 3.5rem;
		padding: 1.5rem 1rem;
		position: relative;
		overflow: visible
	}
	#flow .flow-inner dl:nth-last-of-type(1) {
		margin-bottom: 1rem
	}
	#flow .flow-inner dl dt {
		font-size: 1.8rem;
		text-align: center;
		color: #ff1c8c
	}
	#flow .flow-inner dl dt span {
		width: 100%;
		position: absolute;
		top: -2rem;
		left: 0;
		text-align: center
	}
	#flow .flow-inner dl dt span img {
		width: auto;
		height: 2rem
	}
	#flow .flow-inner dl dd {
		font-size: 1.2rem
	}
	#flow .flow-inner dl dd figure {
		padding-bottom: 1rem
	}
	#flow .flow-inner dl dd figure img {
		width: 100%;
		height: auto
	}
	#flow .flow-inner dl dd figure figcaption {
		font-size: 1rem;
		display: block;
		padding-top: 5px;
		text-align: left;
		color: #ff7eb1
	}
	.recommend-box {
		background: url(/cmp/otaku/common/img/bg_recommend.png) repeat-y;
		background-size: 40rem auto;
		padding: 3rem 0
	}
	.recommend-box h3 {
		padding: 0 1.5rem 3rem;
		background: url(/cmp/otaku/common/img/bg_line.png) no-repeat 50% 100%;
		background-size: 20rem auto;
		margin-bottom: 2rem
	}
	.recommend-box h3 img {
		width: 100%;
		height: auto
	}
	.recommend-box .txt {
		font-size: 1.4rem;
		margin: 0 1rem;
		text-align: center
	}
	.recommend-box .txt p {
		padding-bottom: 1.5rem
	}
	.recommend-box .txt figure {
		padding-bottom: 1.5rem
	}
	.recommend-box .txt figure img {
		width: 100%;
		height: auto;
		border: .3rem solid #eee
	}
	.recommend-box .txt figure figcaption {
		display: block;
		font-size: 1.2rem;
		padding-top: 5px
	}
}

.pgtop {
	position: fixed;
	bottom: 5%;
	right: 2%;
	z-index: 200
}

.pgtop a {
	background: rgba(0, 0, 0, 0.3);
	border-radius: 50%;
	line-height: 1.2;
	color: #fff !important;
	text-align: center;
	font-size: 1rem;
	padding-top: 1.5rem;
	width: 5rem;
	height: 5rem;
	display: block
}
.show-for-small {
	display: block;
}
@media only screen and (max-width: 767px) {
	.show-for-small {
		display: none;
	}
	.hide-for-small {
		display: none;
	}
}