/*================================================== 
 home
==================================================*/
#tubular-container {
	height: calc(100% - 96px);
	top: 96px;
}
/* kv
---------------------------------*/
#kv {
	position: relative;
	min-height: 950px;
	
}
.movie {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow:hidden;
	z-index:3;
}
#kv .movie iframe{
	z-index:3;
}
#kv .movie:after {
	display:block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: url(../img/index/layer_movie.png) repeat 0 0;
	z-index:4;
}
#kv .movie img {
	width: 100%;
	height: 100%;
}
#kv .inner {
	position: relative;
	padding: 90px 0 0;
	z-index: 100;
}
#kv .logo {
	padding: 130px 0 55px 35px;
}
#kv .txt_read {
	position: relative;
	padding:0 0 0 35px;
	font-size: 36px;
	color: #fff;
	font-weight: bold;
	line-height: 125%;
	/*
	text-shadow: 
	4px 4px 1px rgba(0, 0, 0, 0.5),
	-4px 4px 1px rgba(0, 0, 0, 0.6),
	4px -4px 1px rgba(0, 0, 0, 0.6),
	-4px -4px 1px rgba(0, 0, 0, 0.5);
	*/
	z-index: 100;
}
#kv .txt_read span {
	font-size: 46px;
}	
#kv .txt_release {
	position: absolute;
	top: 120px;
	right: 66px;
	font-size: 20px;
	letter-spacing: 0.15em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	z-index: 100;
	text-align: right;
	line-height: 115%;
}
#kv .mainimgWrap {
	position: absolute;
	top: 90px;
	left: 435px;
	z-index: 90;
}
#kv .txt01 {
	position: absolute;
	top: 125px;
	left: -57px;
}
#kv .txt02 {
	position: absolute;
	top: 778px;
	left: 181px;
}
#main #kv,
#main #kv .inner .logo img{
	opacity:0;
}
#main #kv .inner .mainimgWrap figure{
	position:relative;
	opacity:0;
}
#main #kv .inner .mainimgWrap figure .mainimg{
	position:absolute;
	top:0px;
	left:0px;
	opacity:0;
}
#main #kv .inner .mainimgWrap figure .mainimg:first-child{
	position:relative;
	opacity:1;
}
#kv .txt_release,
#kv .txt_read,
#kv .txt01,
#kv .txt02 {
	opacity: 0;
}
ruby > rt {
	font-size: 30% !important;
	position: absolute;
	top: 5px;
}
/* intro
---------------------------------*/
.h_intro {
	position: relative;
	width: 100%;
	height: 1055px;
	background: url(../img/index/bg_intro.jpg) no-repeat 0 0;
	background-size: cover;
	background-attachment: fixed;
	z-index:5;
}
.h_intro:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: url(../img/index/layer_intro.png) repeat 0 0;
}
.h_intro .inner {
	position: relative;
}
.h_intro p {
	position: relative;
	padding: 420px 0 530px;
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	line-height: 170%;
	z-index: 100;
}
.h_intro .inner .img01 {
	position: absolute;
	top: 248px;
	left: 58px;
}
.h_intro .inner .img02 {
	position: absolute;
	top: 160px;
	left: 650px;
}
.h_intro .inner .img03 {
	position: absolute;
	top: 636px;
	left: 445px;
}
.h_intro .inner p {
	opacity: 0;
	position: relative;
}
.h_intro .inner figure img {
	opacity: 0;
	position: relative;
}
.h_intro .inner figure span {
	transition: all 0.3s ease;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	display: block;
}
/* h_news & h_products
---------------------------------*/
.h_cont02 {
	position: relative;
	width: 100%;
	height: 2300px;
	background: url(../img/index/bg_cont02.jpg) no-repeat 0 0;
	background-size: cover;
	background-attachment: fixed;
	z-index:5;
}
.h_cont02:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: url(../img/index/layer_cont02.png) repeat 0 0;
	z-index: 10;
}
.h_cont02 h2 {
	position: relative;
	padding: 0 0 55px;
	font-size: 26px;
	letter-spacing: 0.07em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-align: center;
	z-index: 100;
}
.h_cont02 h2 span {
	display:block;
	font-size: 18px;
}

/* h_news */
.h_news .inner {
	position: relative;
	padding: 57px 0 120px;
}
.h_news .img {
	position: absolute;
	top: 106px;
	left: 0;
}
.h_news dl {
	position: relative;
	font-size: 16px;
	z-index: 100;
}
.h_news dt {
	width: 140px;
	float: left;
	padding: 25px 0 25px 20px;
}
.h_news dd {
	padding: 25px 10px 25px 160px;
	border-bottom: 1px dotted #fff;
}
.h_news .inner dl,
.h_news .inner h2 {
	opacity: 0;
	position: relative;
}
.h_news .inner figure img {
	opacity: 0;
	position: relative;
}
.h_news .inner figure span {
	transition: all 0.3s ease;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	display: block;
}

/* h_product */
.h_product .inner {
	position: relative;
}
.h_product h2 {
	padding: 20px 0 55px;
}
.h_product .tableWrap {
	position: relative;
	width: 1000px;
	margin: 0 auto 45px;
	border: 1px solid #899f87;
	z-index: 100;
}
.h_product .tableWrap:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.h_product .tableWrap table {
	width: 500px;
	float: left;
}
.h_product .tableWrap th {
	width: 110px;
	padding: 15px 20px;
	background-color: rgba(44,43,41,0.60);
}
.h_product .tableWrap td {
	padding: 15px 20px;
	background-color: rgba(0,0,0,0.60);
}
.h_product .tableWrap tr {
	border-bottom: 1px solid #899f87;
}
.h_product .tableWrap tr:nth-child(4) td,
.h_product .tableWrap tr:nth-child(5) td,
.h_product .tableWrap tr:nth-child(6) td {
	height: 42px;
}
.h_product .tableWrap tr:last-child {
	border-bottom: none;
}
.h_product .img {
	position: absolute;
	top: 0;
	right: 0;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
.h_product .inner .tableWrap,
.h_product .inner dl,
.h_product .inner h2{
	opacity: 0;
	position: relative;
}
.h_product .inner figure img {
	opacity: 0;
	position: relative;
}
.h_product .inner figure span {
	transition: all 0.3s ease;
	position: absolute;
	top: 0px;
	right: 0px;
	display: block;
}
.h_product dl {
	position: relative;
	width: 960px;
	margin: auto;
	padding: 20px;
	background: rgba(0,0,0,.3);
	border: 1px solid #899f87;
	z-index: 100;
}
.h_product dl dt {
	font-size: 1.2em;
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px dotted #899f87;
}
.h_product dl dt:nth-of-type(n+2) {
	margin-top: 20px;
}
.h_product dl dd span {
	display: block;
	padding: 15px 0 10px;
}
.h_product dl dd ul {
	border-bottom: 1px solid #899f87;
	border-left: 1px solid #899f87;
	border-right: 1px solid #899f87;
	overflow: hidden;
}
.h_product dl dd ul li {
	padding: 10px 10px 10px 20px;
	width: 479px;
	float: left;
	box-sizing: border-box;
	border-top: 1px solid #899f87;
	background: rgba(0,0,0,0.60);
}
.h_product dl dd ul li:nth-child(2n) {
	border-left: 1px solid #899f87;
}

/*================================================== 
 story
==================================================*/
.story {
	background: url(../img/story/bg_story.jpg) repeat-y 50% 0;
	background-size: 100% auto;
}
.story .cont01,
.story .cont02,
.story .cont03 {
	position: relative;
}
.story .txtWrap01,
.story .txtWrap02 {
	padding: 30px;
	box-sizing: border-box;
}
.story p {
	font-size: 15px;
	padding: 0 0 30px;
}
.story .cont01 {
	padding: 0 0 250px;
}
.story .cont01 .img02 {
	margin: -23px 0 0 122px;
}
.story .cont01 .txtWrap01 {
	position: absolute;
	top: 33px;
	left: 500px;
	width: 605px;
	background-color: rgba(0,0,0,0.9);
}
.story .cont02 {
	padding: 0 0 292px;
}
.story .cont02 .img01 {
	padding: 0 0 0 50px;
}
.story .cont02 .txtWrap01 {
	position: absolute;
	top: -153px;
	left: 0px;
	width: 620px;
	background-color: rgba(41,91,71,0.9);
}
.story .cont02 .txtWrap02 {
	position: absolute;
	top: 420px;
	left: 570px;
	width: 530px;
	color: #000;
	background-color: rgba(255,255,255,0.9);
}
.story .cont03 {
	padding: 0 0 170px;
}
.story .cont03 .img01 {
	padding: 0 0 0 50px;
}
.story .cont03 .txtWrap01 {
	position: absolute;
	top: 478px;
	left: 115px;
	width: 650px;
	background-color: rgba(0,0,0,0.8);
}

.story .cont01 img,
.story .cont02 img,
.story .cont03 img {
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	overflow:hidden
}
#main.story {
	background-attachment: fixed;
}
#main.story .inner .sec,
#main.story .lnav,
#main.story .inner .cont01 .txtWrap01,
#main.story .inner .cont01 figure img,
#main.story .inner .cont02 figure img,
#main.story .inner .cont03 figure img,
#main.story .inner .cont02 .txtWrap01,
#main.story .inner .cont02 .txtWrap02,
#main.story .inner .cont03 .txtWrap01,
#main.story .main .pageTtl {
	opacity:0;
}
#main.story .inner .cont01 figure img,
#main.story .inner .cont02 figure img,
#main.story .inner .cont03 figure img {
	position:relative;
}
.para{
	transition: all 0.3s ease;
	display: inline-block;
}
.wipein{
	overflow: hidden;
}
.fadeslidein {
	opacity: 0;
	position: relative;
}


.story .sec {
	text-align: center;
	padding: 0 0 35px;
}
.story .sec p {
	padding: 0 0 45px;
}
.story .sec figure {
	padding: 55px 0 65px;
}
.story .sec figure.img01 {
	padding: 90px 0 100px;
}
.story .sec figure.img02 {
	padding: 15px 0 0;
}

/* local nav
------------------------------------------------------------------*/
.story .lnav {
	padding: 0 0 120px;
	text-align: center;
}
.story .lnav li {
	display: inline-block;
	padding: 0 8px;
}
.story .lnav li a {
	display:block;
	width: 200px;
	height: 52px;
	line-height: 52px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	background:#000;
	border-radius: 26px;
	-webkit-border-radius: 26px; 
	-moz-border-radius: 26px;
	transition: all .3s;
	opacity: 1 !important;
}
.story .lnav li.lnav02 a {
	width: 230px;
}
.story .lnav li a:hover,
.story .lnav li a.current {
	background: #7d1e12;
}
.story .lnav.bottom {
	padding: 35px 0 130px;
}

/*================================================== 
gallery
==================================================*/
.gallery {
	background: url(../img/gallery/bg_gallery01.jpg) repeat-y 50% 0;
	background-attachment: fixed;
}
.gallery h2 {
	padding: 0 0 45px;
	font-size: 24px;
	letter-spacing: 0.07em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-align: center;
}
.gallery .listWrap ul:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.gallery .listWrap li {
	overflow: hidden;
	display: block;
	position: relative;
	margin: 10px;
	float: left;
	box-shadow:0px 0px 6px 2px #242424;
	-moz-box-shadow:0px 0px 6px 2px #242424;
	-webkit-box-shadow:0px 0px 6px 2px #242424;
}
.gallery .listWrap li a {
	display:block;
	opacity: 1 !important;
	transition: all .3s;
}
.gallery .listWrap li .img {
	width: 100%;
	height: auto;
	-webkit-transition:all 0.5s ease-in-out;
	transition:all 0.5s ease-in-out;
}
.gallery .listWrap li a:hover .img {
	transform: scale(1.10,1.10);
	-webkit-transform:scale(1.10,1.10);
	-moz-transform:scale(1.10,1.10);
	-ms-transform:scale(1.10,1.10);
	-o-transform:scale(1.10,1.10);
}
.gallery .listWrap li .new,
.gallery .listWrap li .enlarge {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 100;
}
.gallery .listWrap li a:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background-color: rgba(0,0,0,0.4);
	opacity: 0;
	transition: all .3s;
}
.gallery .listWrap li a:hover:after {
	opacity: 1;
}
.gallery .listWrap li a .enlarge {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 61px;
	height: 60px;
	content: "";
	margin-top: -30.5px;
	margin-left: -30px;
	opacity: 0;
	transition: all .6s;
}
.gallery .listWrap li a:hover .enlarge {
	opacity: 1;
}
.gallery .cont_event {
	padding: 0 0 150px;
}
.gallery .cont_game {
	margin-top: -185px;
	padding: 185px 0 200px;
	background: url(../img/gallery/bg_gallery02.jpg) no-repeat 50% 0;
	background-size: cover;
	background-attachment: fixed;
}
#main.gallery h1,
#main.gallery .cont_game h2,
#main.gallery .cont_event h2,
#main.gallery .main .listWrap {
	opacity: 0;
}
#main.gallery .cont_game h2,
#main.gallery .cont_event h2 {
	position:relative;
}
#bggame{
	width:100%;
	height:100%;
	background: url(../img/gallery/bg_gallery02.jpg) no-repeat 50% 0;
	background-size: cover;
	position:fixed;
	top:0px;
	left:0px;
	opacity:0;
	z-index:3;
}
#main.gallery .main {
	position: relative;
	z-index: 4;
}
#main.gallery .main .cont_game {
	background-image: none !important;
}
/*================================================== 
special
==================================================*/
.special {
	padding: 0 0 40px;
	background: url(../img/special/bg_special.jpg) no-repeat 50% 0;
	background-size: cover;
	background-attachment: fixed;
}
.special  h2 {
	padding: 0 0 45px;
	font-size: 24px;
	letter-spacing: 0.07em;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	text-align: center;
}

/* local nav
------------------------------------------------------------------*/
.special .lnav {
	padding: 0 0 80px;
	text-align: center;
}
.special .lnav li {
	display: inline-block;
	padding: 0 8px;
}
.special .lnav li a {
	display:block;
	width: 200px;
	height: 52px;
	line-height: 52px;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	background:#000;
	border-radius: 26px;
	-webkit-border-radius: 26px; 
	-moz-border-radius: 26px;
	transition: all .3s;
	opacity: 1 !important;
}
.special .lnav li a:hover,
.special .lnav li a.current {
	background: #7d1e12;
}
.special .lnav li span {
	position: relative;
	padding: 0 0 0 30px;
}
.special .lnav li span:before {
	display:block;
	position: absolute;
	top: 50%;
	left: 0;
	content: "";
}
.special .lnav li.lnav01 span {
	padding: 0 0 0 33px;
}
.special .lnav li.lnav01 span:before {
	width: 26px;
	height: 26px;
	margin-top: -13px;
	background: url(../img/special/icn_download.svg) no-repeat 0 0;
	background-size:contain;
}
.special .lnav li.lnav02 span:before {
	width: 33px;
	height: 25px;
	margin-top: -12.5px;
	background: url(../img/special/icn_play.svg) no-repeat 0 0;
	background-size:contain;
}
.special .lnav li.lnav03 span:before {
	width: 30px;
	height: 25px;
	margin-top: -12.5px;
	background: url(../img/special/icn_twitter.svg) no-repeat 0 0;
	background-size:contain;
}
.special .lnav li.lnav04 span:before {
	width: 25px;
	height: 26px;
	margin-top: -13px;
	background: url(../img/special/icn_bunner.svg) no-repeat 0 0;
	background-size:contain;
}

/* page----index( trial )
------------------------------------------------------------------*/
.special .cont_trial {
	width: 640px;
	margin: 0 auto 120px;
}
.special .cont_trial .bnr {
	width: 596px;
	margin: 0 auto;
}
.special .cont_trial .bnr a {
	display: block;
}

/* page----movie
------------------------------------------------------------------*/
.special .cont_movie .movie_area {
	width: 640px;
	margin: 0 auto 120px;
}
.special .cont_movie .movie_area p {
	font-size: 16px;
	text-align: center;
}


/* page----twitter
------------------------------------------------------------------*/
.special .cont_twitter {
	margin: 0 0 55px;
}
.special .cont_twitter ul:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.special .cont_twitter li {
	width: 200px;
	float: left;
	margin: 0 24px 25px 0;
}
.special .cont_twitter li img {
	width: 100%;
}
.special .cont_twitter li:nth-child(5n) {
	margin-right: 0;
}

/* page----banner
------------------------------------------------------------------*/
.special .cont_banner {
	width: 750px;
	margin: 0 auto 55px;
}
.special .bnrimg li {
	margin: 0 auto 20px;
	text-align: center;
}
.special .banner01 {
	padding: 0 0 100px;
}
.special .banner01 .bnrimg {
	overflow: hidden;
	width: 340px;
	margin: 0 auto 30px;
}
.special .banner02 {
	padding: 0 0 100px;
}
.special .banner02 .bnrimg {
	overflow: hidden;
	width: 700px;
	margin: 0 auto 30px;
}
.special .banner01 .bnrimg li,
.special .banner02 .bnrimg li {
	float: left;
}
.special .banner01 .bnrimg li {
	width: 120px;
	margin: 0 25px;
}
.special .banner02 .bnrimg li {
	width: 300px;
	margin: 0 25px;
}
.special .banner03 {
	padding: 0 0 80px;
}
.special .banner03 .bnrimg {
	padding: 0 0 10px;
}
.special .banner03 .bnrimg li img {
	padding: 0;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
}
.special .cont_banner dl {
	clear:both;
	display: block;
	width: 678px;/* -border2px in*/
	padding: 20px 25px;
	margin: 10px auto 0;
	text-align: left;
	font-size: 14px;
	color: #5d170f;
	border: 1px dashed #5d170f;
	background: #fff;
}
.special .cont_banner dt {
	font-weight: bold;
	padding: 0 0 2px;
}
.special .cont_banner dd li {
	margin: 1px 0 8px;
	line-height: 35px;
}
.special .cont_banner dl input {
	width: 625px;
	float: right;
	padding: 2px 5px;
	color: #000;
}
#main.special h1,
#main.special .lnav,
#main.special .cont_twitter,
#main.special .cont_movie,
#main.special .cont_banner {
	opacity:0;
}
#main.special .lnav,
#main.special .cont_movie,
#main.special .cont_banner {
	position:relative;
}
#main.special .cont_twitter .gwrap:nth-child(5n) {
	margin-right: 0;
}

/*================================================== 
 chara
==================================================*/
.chara {
	background: url(../img/chara/bg_chara.jpg) repeat-y 50% 0;
	background-size: cover;
	background-attachment: fixed;
}
.chara .inner {
	position: relative;
}
/* sidenav */
.chara .sidenav {
	position: fixed;
	top: 50%;
	right: 15px;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	z-index:2000;
}
.chara .sidenav li {
	padding: 12px 0;
	text-align: right;
}
.chara .sidenav li a {
	position: relative;
	transition: all .3s;
	opacity: 1 !important;
}
.chara .sidenav li a.current,
.chara .sidenav li a:hover {
	color: #b89f5b;
}
.chara .sidenav li a span {
	position: absolute;
	top: -1.5em;
	right: 2em;
	color: #ff0;
	font-size: 10px;
	font-weight: 700;
}

/* navmap */
.chara .navmap {
	margin: 0 0 100px;
	background: url(../img/chara/bg_navmap.jpg) no-repeat 50% 0;
	background-size: 100% auto;
}
.chara .navmap .pinList li {
	position: absolute;
	top: 0;
	left: 0;
}
.chara .navmap .pinList li.pin01 {
	top: 380px;
	left: 708px;
}
.chara .navmap .pinList li.pin02 {
	top: 275px;
	left: 872px;
}
.chara .navmap .pinList li.pin03 {
	top: 132px;
	left: 453px;
}
.chara .navmap .pinList li.pin04 {
	top: 447px;
	left: 448px;
}
.chara .navmap .pinList li.pin05 {
	top: 439px;
	left: 817px;
}
.chara .navmap .pinList li.pin06 {
	top: 450px;
	left: 967px;
}
.chara .navmap .pinList li.pin07 {
	top: 495px;
	left: 658px;
}
.chara .navmap .pinList li.pin08 {
	top: 294px;
	left: 466px;
}
.chara .navmap .pinList li.pin09 {
	top: 295px;
	left: 206px;
}

.chara .cont {
	padding: 100px 0 100px;
}
.chara .cont h2 {
	position: relative;
	width: 303px;
	height: 150px;
	padding: 45px 0 0;
	margin: 0 auto;
	font-size: 26px;
	font-weight: bold;
	color: #573811; 
	text-align: center;
	background: url(../img/chara/bg_contttl.png) no-repeat 0 0;
	box-sizing: border-box;
	z-index: 100;
}
.chara .cont .img {
	overflow: hidden;
	width: 1100px;
	height:598px;
	margin: -70px auto 0;
	position:relative;
	z-index:1;
}
.chara .cont .img img {
	width: 100%;
	height: auto;
	z-index:1;
}
.chara .cont .charaList {
/*
	margin-top: -205px;
	margin-bottom: 45px;
*/
	position:relative;
	z-index:100;
}
.chara .cont .charaList:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.chara .cont .charaList li.slick-slide {
	float: left;
	padding: 0 8px;
}
.chara .cont .charaList li {
	border: none;
	outline: none;
	padding: 0 10px;
}
.chara .cont .charaList a {
	position: relative;
	display: block;
	opacity: 1 !important;
	outline: none;
	border: none;
}
.chara .cont .charaList a img {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	filter: grayscale(0%);
	transition:0.3s;
	transition:0.3s;
}
.chara .cont .charaList a:hover img {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	filter: grayscale(100%);
}

.chara .cont .charaList a:after {
	display: block;
	position: absolute;
	top: 60%;
	left: 50%;
	width: 61px;
	height: 60px;
	content: "";
	margin-left: -30px;
	background: url(../img/chara/icn_enlarge.svg) no-repeat 0 0;
	background-size: contain;
	opacity: 0;
	transition: all .6s;
}
.chara .cont .charaList a:hover:after {
	opacity: 1;
}

.chara .cont .detail {
	font-size: 15px;
	text-align: center;
}
.chara .cont .detail h3 {
	margin: 0 0 20px;
	color: #b89f5b;
	font-size: 18px;
	font-weight: bold;
}
.chara .cont .detail h4 {
	padding: 0 0 20px;
}
.chara .cont .detail p {
	padding: 0 0 10px;
}
.chara .cont .detail dl+h3,
.chara .cont .detail h4+h3,
.chara .cont .detail p+h3 {
	margin-top: 40px;
}
.chara .cont .detail dl {
	width: 360px;
	margin: 0 auto;
	text-align: left !important;
}
.chara .cont .detail dt {
	position: relative;
	width: 140px;
	float: left;
}
.chara .cont .detail dt:after {
	position: absolute;
	top: 0;
	right: 0;
	content: "：";
}
.chara .cont .detail dd {
	padding: 0 0 0 160px;
}
#main.chara h1,
#main.chara .navmap .inner figure img,
#main.chara .navmap .pinList,
#main.chara .cont .charaList,
#main.chara .cont .detail,
#main.chara .cont h2,
#main.chara .cont .img img {
	opacity: 0;
}
#main.chara .navmap .inner figure img,
#main.chara .cont .charaList,
#main.chara .cont .detail,
#main.chara .cont h2 {
	position: relative;
}

#main.chara .cont .swiper-container{
	margin-top: -205px;
	margin-bottom: 45px;
	padding-bottom:40px;
	width:100%;
}
#main.chara .cont .swiper-container .swiper-button-prev{
	left:50%;
	margin-left:-580px;
	margin-top: 10px;
	width:50px;
	height:50px;
	background-image:url(../img/chara/btn_pev.png);
	background-size:50px 50px;
	opacity:0;
}
#main.chara .cont .swiper-container .swiper-button-next{
	right:50%;
	margin-right:-580px;
	margin-top: 10px;
	width:50px;
	height:50px;
	background-image:url(../img/chara/btn_next.png);
	background-size:50px 50px;
	opacity:0;
}
#main.chara .cont .swiper-container .swiper-pagination{
	opacity:0;
}
#main.chara .cont .swiper-container .swiper-pagination-bullet{
	background-color:#ffffff;
	opacity:0.8;
}
#main.chara .cont .swiper-container .swiper-pagination-bullet.swiper-pagination-bullet-active{
	background-color:#c6ad66;
}
#cont04 .detail dl {
	width: 470px;
}
#cont06 .detail dl,
#cont07 .detail dl {
	width: 440px;
}
#cont09 .detail dt {
	width: 90px;
}
#cont09 .detail dd {
    padding: 0 0 0 100px;
}

/* slider --dots */
.chara .slick-list {
	padding-bottom: 30px !important;
	margin-bottom: 50px;
}
.chara .slick-dotted.slick-slider {
	margin-bottom: 0;
}
.chara .slick-dots {
	bottom: 50px;
}
.chara .slick-dots li {
	width: 8px;
	height: 8px;
	margin: 0 5px;
}
.chara .slick-dots li button {
	width: 10px;
	height: 10px;
	padding: 0;
	border: none;
	outline: none;
}
.chara .slick-dots li button:before {
	width: 7px;
	height: 7px;
	content: "";
	border: 1px solid #fff;
	background: #fff;
	border-radius: 50%; 
	-webkit-border-radius: 50%; 
	-moz-border-radius: 50%;
	opacity: 1;
}
.chara .slick-dots li.slick-active button:before {
	border: 1px solid #c6ad66;
	background: #c6ad66;
	opacity: 1;
}

/* slider --arrow */
.slick-arrow {
	overflow: hidden;
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	white-space: nowrap;
	text-indent: 200%;
	width: 50px;
	height: 50px;
	margin-top: -8px;
	content: "";
	z-index: 100;
	border: none;
	outline: none;
}
.slick-prev {
	margin-left: -580px;
	background: url(../img/chara/btn_pev.png) no-repeat;
	background-size: contain;
}
.slick-next {
	margin-left: 525px;
	background: url(../img/chara/btn_next.png) no-repeat;
	background-size: contain;
}

/*================================================== 
system
==================================================*/
.system {
	font-size: 15px;
	background: url(../img/system/bg_system.jpg) repeat-y 50% 0;
	background-size: 100% auto;
	background-attachment: fixed;
}
.system .inner {
	width: 1000px;
}
.system section {
	padding: 0 0 90px;
}
.system h2 {
	position: relative;
	padding: 0 0 20px;
	margin: 0 0 50px;
	font-size: 30px;
	text-align: center;
	font-weight: 700;
}
.system h2:before {
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 100px;
	height: 2px;
	content:"";
	margin-left: -50px;
	background: #fff;
}
.system p {
	padding: 0 0 30px;
}
.system .note {
	text-align: center;
	font-size: 20px;
	padding: 0;
	font-weight: 700;
	margin: 80px 0 0;
	text-decoration: underline;
}
.system .txt_center {
	text-align: center;
}
.system .cont_mainimg {
	position: relative;
	margin: 100px 0 30px;
}
.system .cont_mainimg figcaption {
	position: absolute;
	top: 0;
	left: 50%;
	width: 665px;
	padding: 23px;
	color: #fff;
	font-size: 16px;
	text-align: center;
	line-height: 140%;
	background-color: rgba(36,72,52,0.9);
	-webkit-transform: translate(-50%, -85%);
	transform: translate(-50%, -85%);
}
.system h3 {
	color :#ffdc73;
	padding: 0 0 10px;
	font-weight: 700;
}
#main.system h1,
#main.system .inner .cont01 h2,
#main.system .inner .cont01 p,
#main.system .inner .cont02 h2,
#main.system .inner .cont02 p,
#main.system .inner .cont02 table,
#main.system .inner .cont02 ul,
#main.system .inner .cont03 h2,
#main.system .inner .cont03 .cont_mainimg,
#main.system .inner .cont03 ul li img,
#main.system .inner .cont03 ul li p,
#main.system .inner .cont04 h2,
#main.system .inner .cont04 .cont_mainimg,
#main.system .inner .cont04 p,
#main.system .inner .cont04 ul li,
#main.system .inner .cont05 h2,
#main.system .inner .cont05 .cont_mainimg,
#main.system .inner .cont05 p,
#main.system .inner .cont06 h2,
#main.system .inner .cont06 h3,
#main.system .inner .cont06 .cont_mainimg,
#main.system .inner .cont06 p,
#main.system .inner .cont06 ul li,
#main.system .inner .cont07 h2,
#main.system .inner .cont07 figure img,
#main.system .inner .cont07 .txt_center,
#main.system .inner .cont07 .photoLeft,
#main.system .inner .cont07 .photoRight,
#main.system .inner .cont08 h2,
#main.system .inner .cont08 .txt_center p,
#main.system .inner .cont08 figure img,
#main.system .inner .cont08 p {
	opacity: 0;
	position: relative;
}
#main.system .inner .cont01 h2,
#main.system .inner .cont01 p,
#main.system .inner .cont02 ul {
	position: relative;
}

/* #cont01
---------------------------------*/
.system .cont01 {
	font-size: 16px;
}

/* #cont02
---------------------------------*/
.system .cont02 {
	font-size: 16px;
}
.system .cont02 table {
	width: 100%;
	margin: 0 0 30px;
	border-collapse: separate;
	 border-spacing: 2px 2px; 
}
.system .cont02 table th {
	width: 120px;
	padding: 20px;
	background: #285c47;
}
.system .cont02 table td {
	padding: 20px;
	background: #222;
	line-height: 160%;
}
.system .cont02 ul {
	text-align: center;
	padding: 0 30px;
}
.system .cont02 li {
	padding: 20px 0;
}
.system .cont02 li+li {
	border-top: 1px dotted #fff;
}

/* #cont03
---------------------------------*/
.system .cont03 ul:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.system .cont03 li {
	width: 480px;
	float: left;
}
.system .cont03 li+li {
	padding: 0 0 0 40px;
}
.system .cont03 li img {
	padding: 0 0 5px;
}

/* #cont04
---------------------------------*/
.system .cont04 > ul > li {
	padding: 15px 0;
	border-bottom: 1px dotted #fff;
}
.system .cont04 > ul:after,
.system .cont04 > ul > li:after,
.system .cont04 > ul > li ul:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.system .cont04 > ul > li ul {
	float: left;
}
.system .cont04 > ul > li li {
	float: left;
	padding: 0 5px 5px 0;
}
.system .cont04 > ul > li div {
	float: left;
}
.system .cont04 > ul > li div p {
	font-size: 14px;
}
.system .cont04 > ul > li.colmun01 ul {
	width: 335px;
	padding: 0 40px 0 0;
}
.system .cont04 > ul > li.colmun01 div {
	width: 613px;
}
.system .cont04 > ul > li.colmun02 {
	width: 500px;
	float: left;
}
.system .cont04 > ul > li.colmun02 .tmb {
	display: block;
	width: 160px;
	float: left;
	padding: 0 25px 0 0;
}
.system .cont04 > ul > li.colmun02 div {
	width: 285px;
}
.system .cont04 .list01 .colmun02 {
	border: none;
}
.system .cont04 .list01+p {
	font-size: 14px;
}
.system .cont04 .list02 li:last-child{
	border: none;
}

/* #cont06
---------------------------------*/
.system .cont06 figure ul:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.system .cont06 figure li {
	width: 480px;
	float: left;
	padding: 0 0 20px;
}
.system .cont06 figure li+li {
	padding: 0 0  0 40px;
}
.system .cont06 .list {
	padding: 0 0 60px;
}
.system .cont06 figure {
	text-align: center;
}
.system .cont06 .list li {
	padding: 15px 0;
}
.system .cont06 .list li:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.system .cont06 .list li figure {
	width: 480px;
	float: left;
	padding: 0 40px 0 0;
}
.system .cont06 .list li figure div {
	width: 470px;
}

/* #cont07
---------------------------------*/
.system .cont07 h2+figure {
	padding: 0 0 40px;
}
.system .cont07 .photoLeft {
	width: 100%;
	display: table;
	padding: 20px 0 40px;
}
.system .cont07 .photoLeft figure {
	display: table-cell;
	width: 480px; 
	padding: 0 30px 0 0;
}
.system .cont07 .photoLeft .txtWrap {
	display: table-cell;
	vertical-align: middle;
}
.system .cont07 .photoRight {
	width: 100%;
	display: table;
}
.system .cont07 .photoLeft .txtWrap {
	display: table-cell;
	width: 460px; 
}
.system .cont07 .photoRight figure {
	display: table-cell;
	vertical-align: top;
	padding: 0 0 0 30px;
}

/* #cont08
---------------------------------*/
.system .cont08 figure {
	padding: 0 0 30px;
}



/*================================================== 
JS style
==================================================*/
/**
 * Swiper 4.0.2
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2017 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: October 18, 2017
 */
.swiper-container {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  /* Fix of Webkit flickering */
  z-index: 100;
}
.swiper-container-no-flexbox .swiper-slide {
  float: left;
}
.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 100;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0px, 0, 0);
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
.swiper-invisible-blank-slide {
  visibility: hidden;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;
  -o-transition-property: transform, height;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}
/* 3D Effects */
.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 110;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
/* IE10 Windows Phone 8 Fixes */
.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal > .swiper-wrapper {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical > .swiper-wrapper {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: 27px;
  height: 44px;
  margin-top: -22px;
  z-index: 110;
  cursor: pointer;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  -webkit-transition: 300ms opacity;
  -o-transition: 300ms opacity;
  transition: 300ms opacity;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 110;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  background: #007aff;
}
.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0px, -50%, 0);
  transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 8px;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  -webkit-transition: 200ms top, 200ms -webkit-transform;
  transition: 200ms top, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top, 200ms -webkit-transform;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 200ms left, 200ms -webkit-transform;
  transition: 200ms left, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left, 200ms -webkit-transform;
}
/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #007aff;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progressbar {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-container-vertical > .swiper-pagination-progressbar {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #ffffff;
}
.swiper-pagination-progressbar.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.25);
}
.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
  background: #ffffff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000000;
}
.swiper-pagination-progressbar.swiper-pagination-black {
  background: rgba(0, 0, 0, 0.25);
}
.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
  background: #000000;
}
/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 150;
  height: 5px;
  width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 150;
  width: 5px;
  height: 98%;
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.swiper-slide-zoomed {
  cursor: move;
}
/* Preloader */
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  -webkit-transform-origin: 50%;
  -ms-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}
.swiper-lazy-preloader:after {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  background-size: 100%;
  background-repeat: no-repeat;
}
.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  -webkit-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube {
  overflow: visible;
}
.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}
.swiper-container-flip {
  overflow: visible;
}
.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-container-coverflow .swiper-wrapper {
  /* Windows 8 IE 10 fix */
  -ms-perspective: 1200px;
}