@charset "utf-8";

/* --------------------------------------------------
-------------------------------------------------- ページ全体 */
html {
	width: 100%;
	min-height: 100%;
	-webkit-text-size-adjust: 100%;
}
body {
	width: 100%;
	min-height: 100%;
	background-color: #fff;
	color: #fff;
	font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "游ゴシック", YuGothic, sans-serif;
	font-size: 16px;
	line-height: 1.5;
	overflow: hidden;
}

a:link {
	color: #a08c5a;
	text-decoration: none;
}
a:visited {
	color: #a08c5a;
	text-decoration: none;
}
a:hover {
	color: #a08c5a;
	text-decoration: underline;
}
a:active {
	color: #a08c5a;
	text-decoration: underline;
}

img {
	/*width: 100%;*/
}

a {
	-webkit-transition: 0.2s ease-in-out;
	-moz-transition: 0.2s ease-in-out;
	 -o-transition: 0.2s ease-in-out;
	 transition: 0.2s ease-in-out;
}
a:hover {
	opacity: 0.6;
	-webkit-transition: 0.1s ease-in-out;
	-moz-transition: 0.1s ease-in-out;
	 -o-transition: 0.1s ease-in-out;
	 transition: 0.1s ease-in-out;
}
.pagetop {
	display: none;
	position: fixed;
	bottom: 100px;
	right: 50px;
	width: 65px;
}

.fixed {
	position: fixed;
	top: 0;
	z-index: 9999;
}
.motion {
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-timing-function: ease-out;
}

.lock {
    overflow:hidden;
}
.overlay {
    z-index:1;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:120%;
	background-color: #a57b43;
	opacity: 0.9;
}
.modal-wrap {
    z-index:2;
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:auto;
}
.modal-content {
    position:relative;
    display:none;
    width:100%;
    padding:50px 0;
    box-sizing: border-box;
}
.modal-image {
	text-align: center;
}
.modal-close {
	display: block;
	margin-top: 20px;
	text-align: center;
}

/* --------------------------------------------------
-------------------------------------------------- Clearfix */

.cf:before, .cf:after {
	content: "";
	display: table;
}
.cf:after {
	clear: both;
}
.cf {
	*zoom: 1;
}

/* --------------------------------------------------
-------------------------------------------------- ページ全体 */
.inner {
	position: relative;
	margin: 0 auto;
	width: 1000px;
}


/* --------------------------------------------------
-------------------------------------------------- ヘッダー */
header {
	position: relative;
	background-color: #26283e;
	z-index: 1000;
}
header h1 {
	
	padding: 9px 0 8px 0;
	line-height: 1px;
}
header .sns {
	position: absolute;
	top: 10px;
	right: 0;
}
header .sns ul {
	overflow: hidden;
	letter-spacing: -0.4em;
}
header .sns ul li {
	margin-left: 10px;
	display: inline-block;
}

.disabled {
	-webkit-filter: grayscale(1);
	filter: gray;
	filter: grayscale(1);
	opacity: 0.3;
}


/* --------------------------------------------------
-------------------------------------------------- コンテンツ */


/* -------------------------------------------------- メイン */
#main {
	position: relative;
}
#main-visual {
	position: absolute;
	top: -420px;
	left: -147px;
}
#main-visual span {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
}
#main-visual01 {
	-webkit-animation-delay: 1s;
	animation-delay:1s;
}
#main-visual02 {
	-webkit-animation-delay: 1.1s;
	animation-delay:1.1s;
}
#main-visual03 {
	-webkit-animation-delay: 1.13s;
	animation-delay:1.13s;
}
#main-visual span {
	position: absolute;
}
#main .inner {
	height: 695px;
}
#main h1 {
	position: absolute;
	top: -30px;
	left: 488px;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-delay: 3.2s;
	animation-delay: 3.2s;
}

#main .block {
	position: relative;
	height: 786px;
}
#main-catch01 {
}
#main-catch01 span {
	display: block;
	position: absolute;
}
#main-catch01 span:nth-child(1) {
	top: 9px;
	left: 62px;
	-webkit-animation-delay: 1.4s;
	animation-delay: 1.4s;
}
#main-catch01 span:nth-child(2) {
	top: 92px;
	left: 158px;
	z-index: 100;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-delay: 1.8s;
	animation-delay: 1.8s;
}
#main-catch01 span:nth-child(3) {
	top: 120px;
	left: 85px;
	-webkit-animation-delay: 1.8s;
	animation-delay: 1.8s;
}
#main-catch01 span:nth-child(4) {
	top: 186px;
	left: 177px;
	z-index: 100;
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-delay: 2.2s;
	animation-delay: 2.2s;
}
#main-catch01 span:nth-child(5) {
	top: 209px;
	left: -3px;
	-webkit-animation-delay: 2.2s;
	animation-delay: 2.2s;
}

#main-catch02 {
	position: absolute;
	top: 348px;
	left: 8px;
	-webkit-animation-delay: 3.2s;
	animation-delay: 3.2s;
}
#main-book {
	position: absolute;
	top: 429px;
	left: 16px;
	-webkit-animation-delay: 3.4s;
	animation-delay: 3.4s;
}
#main-release {
	position: absolute;
	top: 420px;
	left: 184px;
	-webkit-animation-delay: 3.8s;
	animation-delay: 3.8s;
}
#main-button {
	position: absolute;
	top: 588px;
	left: 229px;
}
#main-button li {
	margin-bottom: 1px;
}
#main-button li:nth-child(1) {
	-webkit-animation-delay: 4.6s;
	animation-delay: 4.6s;
}
#main-button li:nth-child(2) {
	-webkit-animation-delay: 4.7s;
	animation-delay: 4.7s;
}
#main-button li a {
	display: block;
}

#main-author {
	position: absolute;
	top: 107px;
	left: 779px;
}
#main-author li {
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	-webkit-animation-delay: 3.2s;
	animation-delay: 3.2s;
}


/* -------------------------------------------------- 口絵 */
#front {
	margin-top: -28px;
	padding-top: 38px;
	height: 766px;
	background: url(../images/front-bg01.jpg) center top no-repeat;
}
#front-reader {
	position: relative;
	margin: 0 -33px;
	padding-top: 52px;
	width: 1066px;
	height: 751px;
	background: url(../images/front-reader-bg01.png) center top no-repeat;
}
#front-reader ul {
	margin: 0 auto;
	width: 920px;
	height: 645px;
}
#front-reader .slick-arrow {
	position: absolute;
	top: 0;
	border: none;
	width: 30px;
	height: 645px;
	background: none;
	font-size: 0;
	outline: none;
	cursor: pointer;
}
#front-reader .slick-prev {
	right: -30px;
	background: url(../images/front-reader-prev-bt01.png) center right no-repeat;
}
#front-reader .slick-next {
	left: -30px;
	background: url(../images/front-reader-next-bt01.png) center left no-repeat;
}
#front-reader .slick-disabled {
	opacity: 0.2;
}

/* -------------------------------------------------- ストーリー */
#story {
	background: url(../images/story-bg01.jpg) center top no-repeat;
	height: 839px;
}

#story h1 {
	margin-bottom: 16px;
	text-align: center;
}
#story span {
	position: absolute;
	top: 85px;
	left: -53px;
}
#story p {
	text-align: center;
	position: absolute;
}
#story-trial {
	position: absolute;
	top: 818px;
	left: 869px;
}

/* -------------------------------------------------- キャラクター */
#character {
	padding-top: 10px;
	background: url(../images/character-bg01.jpg) center top no-repeat;
	height: 670px;
}
#character h1 {
	width; 100%l
	position: absolute;
	text-align: center;
}
#character .character-block {
	position: absolute;
}

#character .character-click {
	z-index: 1;
	cursor: inherit;
}
#character .character-profile {
	position: absolute;
}

.tos-desktop .tos-wrapper.tos-fixed {
	background-color:rgba(255,249,90,.9)
}

/* 薙野真之介 */
#character-nagino {
	top: 115px;
	left: -3px;
}
#character-nagino .character-profile {
	top: 412px;
	left: 3px;
}

/* エオリア */
#character-eolia {
	top: 127px;
	left: 90px;
}
#character-eolia .character-profile {
	top: 400px;
	left: 42px;
}

/* アイカ */
#character-aika {
	top: 169px;
	left: 228px;
}
#character-aika .character-profile {
	top: 358px;
	left: 37px;
}

/* フレア */
#character-flair {
	top: 239px;
	left: 375px;
}
#character-flair .character-profile {
	top: 288px;
	left: 21px;
}

/* シルビア */
#character-silvia {
	top: 121px;
	left: 503px;
	z-index: 100;
}
#character-silvia .character-profile {
	top: 406px;
	left: 20px;
}

/* ヴォルグ */
#character-volg {
	top: 58px;
	left: 590px;
}
#character-volg .character-profile {
	top: 469px;
	left: 63px;
}

/* カトレア */
#character-cattleya {
	top: 165px;
	left: 763px;
}
#character-cattleya .character-profile {
	top: 362px;
	left: 24px;
}

/* 妖精 */
#character-fairy {
	top: 167px;
	left: 879px;
}
#character-fairy .character-profile {
	top: 360px;
	left: 38px;
}


/* -------------------------------------------------- イラストギャラリー */
#favor {
	padding-top: 10px;
	background: url(../images/favor-bg01.jpg) center top no-repeat;
	height: 1387px;
}
#favor h1 {
	margin-bottom: 23px;
	text-align: center;
}
#favor ul {
	overflow: hidden;
	margin: 0 -6px;
}
#favor ul li {
	width: 492px;
	float: left;
	margin: 0 28px 2px 0;
}
#favor ul li:nth-child(even) {
	margin-right: 0;
}


/* -------------------------------------------------- 書籍情報 */
#information {
	background: url(../antiskill/images/info-bg01.jpg) center top no-repeat;
}

#information h1 {
	margin-bottom: 30px;
	text-align: center;
}
#information .book-block {
	padding-bottom: 40px;
	overflow: hidden;
}
#information .book-cover {
	margin-right: 35px;
	width: 245px;
	float: left;
}
#information .book-cover img {
	border: 1px solid #ccc;
}
#information .book-info {
	width: 720px;
	float: left;
}
#information .book-catch {
	display: block;
	margin-bottom: 24px;
}
#information .book-info h2 {
	margin-bottom: 20px;
}
#information .book-author {
	margin-bottom: 24px;
	overflow: hidden;
}
#information .book-author li {
	float: left;
	margin-right: 29px;
}
#information .book-price {
	display: block;
}
#information .book-isbn {
	display: block;
	margin-bottom: 40px;
}
#information .book-button {
	overflow: hidden;
}
#information .book-button li {
	float: left;
}


/* --------------------------------------------------
-------------------------------------------------- フッター */

footer {
	margin: 0 auto;
	padding: 25px 0;
	background-color: #26283e;
	text-align: center;
	line-height: 1;
}
footer small {
	font-size: 12px;
	color: #fff;
}

#pagetop {
	display: none;
	position: fixed;
	bottom: 90px;
	right: 20px;
}