/*





    Template Name   : Capture

    Template Author : pixelhint.com

    Author Email    : contact@pixelhint.com

    License         : pixelhint.com/license

    

    

    *****************************************

    

    

    - Header

    - Hero section

    - Featured on seaction

    - About section

    - App features section

    - Testimonials section

    - Subscription section

    - Footer

    - Responsive CSS

    



    */









    /*		Fonts		*/

    @font-face {

    	font-family: 'khmer_mnbold';

    	src: url('../fonts/khmermn-bold-webfont.woff2') format('woff2'),

    	url('../fonts/khmermn-bold-webfont.woff') format('woff');

    	font-weight: normal;

    	font-style: normal;

    }



/*

@font-face {

    font-family: 'open_regular';

    src: url('../fonts/opensans-regular.eot');

    src: url('../fonts/opensans-regular.eot?#iefix') format('embedded-opentype'),

         url('../fonts/opensans-regular.woff') format('woff'),

         url('../fonts/opensans-regular.ttf') format('truetype'),

         url('../fonts/opensans-regular.svg#LatoRegular') format('svg');

    font-weight: normal;

    font-style: normal;

}

*/



/*		General CSS		*/



body,html {

	height: 100%;

}



body{

	background: #fff;

	padding: 0px;

	margin: 0px;

	font-family:"ヒラギノ角ゴシック W1", "Hiragino Kaku Gothic W1", "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

	font-weight: normal;

  min-width: 320px;

}



a:focus{

	color: #fff!important;

	text-decoration: none!important;

}



.container{

	max-width: 1130px;

}



.page p {

	margin: 0 0 50px;

}



body.page {

	font-size: 16px;

	line-height: 2;

}



body.page .content ul {

	margin: 50px 0 50px;

	padding-left: 20px;

}



body.page .content li {

	margin-bottom: 30px;

}



section.content {

	padding: 0 20px;

}



.page .content th {

	width: 40%;

	vertical-align: top;

}



/*		Header 		*/



header {

	position: fixed;

	display: block;

	width: 100%;

	height: 60px;

	z-index: 99;

	background-color: #111;

	top: 0;

}



header .logo{

	display: table-cell;

	margin: 45px 100px 0 0;

}



.overlay {

	display: none;

	position: fixed;

	z-index: 1;

	background-color: rgba(255,255,255,.95);

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

}



.overlay.show {

	display: block;

}





/*

header .burger_icon{

	display: none;

	float: right;

	background: #ffffff;

	padding: 5px 10px;

	text-transform: uppercase;



	color: #43b779;

	font-size: 14px;



	-moz-border-radius: 2px;

	-webkit-border-radius: 2px;

	border-radius: 2px;



	margin: 45px 10px 0 0;

}

*/





header .burger_icon {

	position: fixed;

	display: none;

	width: 80px;

	height: 80px;

	text-indent: -900000px;

	margin: 10px 10px 0 0;

	background: url('../img/menu_button.png') no-repeat center center;

	background-size: contain;

  left: 10px;

}



header .burger_icon:hover{

	cursor: pointer;

}



header .burger_icon.active{

	background: url('../img/menu_close_button.png') no-repeat center center;

	background-size: contain;

}



header nav{

	margin-top: 0;

	line-height: 0.8;

}



header nav li {

	display: inline-block;

	width: 16%;

}



header nav li:first-child{

	margin: 0;

}



header nav li a {

	color: #ddd;

	font-size: 20px;

	transition: all .2s linear;

	-o-transition: all .2s linear;

	-moz-transition: all .2s linear;

	-webkit-transition: all .2s linear;

	text-align: center;

	display: block;

	padding: 16px 0;

	border-right: 2px solid #444;

}



header nav li a:hover,

header nav li a:focus{

	text-decoration: none;

	color: #fff!important;

}



header nav li a span {

	font-family: 'khmer_mnbold';

	display: block;

	font-size: 14px;

	color: #a1a1a1;

}



.page h1 span {

	font-family: 'khmer_mnbold';

	display: block;

	font-size: 24px;

	color: #a1a1a1;

}



.page h1 {

	padding-bottom: 20px;

	border-bottom: 2px solid #ccc;

	margin-bottom: 30px; 

}



header .social{

	display: table-cell;

	margin-top: 45px;

}



header .social li{

	float: left;

	margin-left: 20px;

}



header .social li:first-child{

	margin: 0;

}



.col-centered{

	float: none;

	margin: 0 auto;

}



/*		Hero section 		*/



.hero {

	display: block;

	position: relative;

  height: 100%; 

	margin-top: 60px;

}



#content-slider div#mask {

    position: absolute;

    width: 100%;

    height: 100%;

    overflow: hidden;

}



.gradient{

	position: absolute;

	width: 100%;

	bottom: 0;

	height: 100px;

	background-image: -moz-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);

	background-image: -o-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);

	background-image: -webkit-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);

	background-image: linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);

}





#home_view {

    width: 100%;

    height: 100%;

    text-align: center;

    text-transform: uppercase;

    color: #FFF

}



#home_view #home_content {

    width: 100%;

    max-width: 760px;

    display: inline-block;

    vertical-align: middle;

    z-index: 999

}



#home_view:before {

    content: '';

    display: inline-block;

    height: 100%;

    vertical-align: middle;

    margin-right: -0.25em

}



#home_view h1 {

    color: #fff;

    line-height: 1;

    font-size: 2.7em;

    margin: 0 0 0;

    letter-spacing: 0;

    opacity: 1;

    font-weight: 100;

    -moz-transform: translate3d(0, -30%, 0);

    -ms-transform: translate3d(0, -30%, 0);

    -webkit-transform: translate3d(0, -30%, 0);

    transform: translate3d(0, -30%, 0)

    text-shadow: 0px 0px 2px rgba(0, 0, 0, 1);

}



#home_view h1.logo,

footer h1.logo {

	position: absolute;

	top: 50%;

	left: 50%;

  width: 200px;

  height: 140px;

	margin-left: -100px;

	margin-top: -220px;

	background: url(../img/steins_logo.png) center center no-repeat;

	background-size: contain;

	overflow: hidden;

	text-indent: -90000000px;

}

#home_view h1.logo {

  width: 300px;

  height: 210px;

  margin-left: -150px;

  margin-top: -230px;

  background: url(../img/steins_logo_sdw.png) center center no-repeat;

  background-size: contain;

}



footer h1.logo {

	margin-top: -140px;

}



footer .col-centered {

	text-align: center;

	margin-top: 100px;

}



footer .col-centered a {

	color: #ccc;

}



footer .col-centered a:hover {

	color: #fff;

}



#home_view h1 span {

    font-size: 0.58em;

    font-weight: 100;

    display: block;

    line-height: 1.5em;

}



#home_view #clock_nest {

    opacity: 1;

    position: absolute;

    right: 120px;

    bottom: 120px;

    -moz-transform: translate3d(0, 30%, 0);

    -ms-transform: translate3d(0, 30%, 0);

    -webkit-transform: translate3d(0, 30%, 0);

    transform: translate3d(0, 30%, 0)

}



#home_view #clock_nest #sub_clock {

    border-right: 1px solid #fff;

    padding-right: .6em;

    display: inline-block;

}



#home_view #clock_nest #sub_clock #city {

    font-family: 'Raleway', sans-serif;

    font-size: 1.1em;

    font-weight: 300;

}



#home_view #clock_nest #sub_clock #time {

    font-family: 'Roboto', sans-serif;

    font-size: 3.2em;

    font-weight: 100;

    line-height: .85;

}



#home_view #clock_nest #sub_clock #time div {

    display: inline-block;

    margin: 0;

    padding:0;

    text-align: center;

}



#home_view #clock_nest #sub_clock #time #sep {

    opacity: 0.3;

    margin: 0 -10px;

}



#home_view #clock_nest #sub_clock #time #sep.on {

    opacity: 1;

}



#home_view #clock_nest #weather {

    margin-left: .6em;

    font-family: 'Raleway', sans-serif;

    display: inline-block;

    height: 59px;

}



#home_view #clock_nest #weather #icon {

    width: 50px;

    height: 40px;

    background-size: contain;

    background-repeat: no-repeat;

}

#home_view #clock_nest #weather #icon.w_01d {

    background-image: url("../img/01d.png");

}

#home_view #clock_nest #weather #icon.w_01n {

    background-image: url("../img/01n.png");

}

#home_view #clock_nest #weather #icon.w_02d {

    background-image: url("../img/02d.png");

}

#home_view #clock_nest #weather #icon.w_02n {

    background-image: url("../img/02n.png");

}

#home_view #clock_nest #weather #icon.w_03n {

    background-image: url("../img/03d.png");

}

#home_view #clock_nest #weather #icon.w_03n {

    background-image: url("../img/03d.png");

}

#home_view #clock_nest #weather #icon.w_04d {

    background-image: url("../img/04d.png");

}

#home_view #clock_nest #weather #icon.w_04n {

    background-image: url("../img/04d.png");

}

#home_view #clock_nest #weather #icon.w_09d {

    background-image: url("../img/09d.png");

}

#home_view #clock_nest #weather #icon.w_09n {

    background-image: url("../img/09d.png");

}

#home_view #clock_nest #weather #icon.w_10d {

    background-image: url("../img/10d.png");

}

#home_view #clock_nest #weather #icon.w_10n {

    background-image: url("../img/10n.png");

}

#home_view #clock_nest #weather #icon.w_11d {

    background-image: url("../img/11d.png");

}

#home_view #clock_nest #weather #icon.w_11n {

    background-image: url("../img/11d.png");

}

#home_view #clock_nest #weather #icon.w_13d {

    background-image: url("../img/13d.png");

}

#home_view #clock_nest #weather #icon.w_13n {

    background-image: url("../img/13d.png");

}

#home_view #clock_nest #weather #icon.w_50d {

    background-image: url("../img/50d.png");

}

#home_view #clock_nest #weather #icon.w_50n {

    background-image: url("../img/50d.png");

}

#home_view #clock_nest #weather #temp {

    font-size: 1.3em;

}

#home_view #content-slider{

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    height: 100%;

}

#home_view .main_image {

    opacity: 1;

    left: 0;

    position: absolute;

    top: 0;

    width: 100%;

    height: 100%;

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}



#home_view #img_1.main_image {

    left: 0;

    background-image: url("../img/img_1.png");

}

#home_view #img_2.main_image {

    left: 100%;

    background-image: url("../img/img_2.jpg");

}

#home_view #img_3.main_image {

    left: 100%;

    background-image: url("../img/img_3.png");

}

#home_view #img_4.main_image {

    left: 100%;

    background-image: url("../img/img_4.png");

}

#home_view #img_5.main_image {

    left: 100%;

    background-image: url("../img/img_5.png");

}



table  {

	margin-top: 40px;

}



table td {

    padding: 1em 1em 1em 0;

    font-size: 1.252em;

    vertical-align: top;

    color: #ccc;

}



table td.title {

    white-space: nowrap;

}





.page_hero {

	margin-top: 0;

	padding-top: 50px;

	height: 540px;

}



.page .page_hero {

	height: 100px;

	padding-top: 0;

	margin-top: 60px;

}



.key_visual {

	height: 500px;

}



.page .key_visual {

	height: 100px;

	position: relative;

}



.key_visual .girls {

	width: 400px;

	height: 500px;

	margin: 0 auto;

	background: url(../img/girls.png) no-repeat center top;

}



.key_visual .logo {

	width: 410px;

	height: 230px;

	background: url(../img/negimate_logo.png) no-repeat center top;

	background-size: contain;

	position: absolute;

	bottom: 0;

	left: 50%;

	margin-left: -205px;

}



.page .key_visual .logo {

    width: 160px;

    height: 93px;

    bottom: -30px;

    margin-left: -130px;

}



.twitter {

	background: url('../img/tw_bg.jpg') no-repeat center top;

	background-size: cover;

	position: relative;

}



.twitter .container {

	padding: 0 30px;

}



.twitter_button {

	margin: 60px auto;

	width: 330px;

}



.twitter .yukihime {

	background: url(../img/yukihime.png) no-repeat;

	background-size: contain;

	position: absolute;

	height: 220px;

	width: 140px;

	left: 50%;

	margin-left: 340px;

	top: 30px;

}



.twitter .yue {

	background: url(../img/yue.png) no-repeat;

	background-size: contain;

	position: absolute;

	height: 200px;

	width: 150px;

	left: 50%;

	margin-left: -480px;

	bottom: 50px;

}



.hero .caption {

	position: absolute;

	max-width: 550px;

	margin-left: 80px;

	top: 50%;

	transform:translate(0,-50%);

	-webkit-transform:translate(0,-50%);

	-moz-transform:translate(0,-50%);

	-o-transform:translate(0,-50%);

}



a.app_store_btn{

	display: inline-block;

	text-decoration: none;

	margin: 0px;

	width: 252px;

	height: 82px;

}



a.app_store_btn span {

	display: none;

}



.play_store{

	background: url('../img/play_store.png') no-repeat;

}



.apple_store{

	background: url('../img/app_store.png') no-repeat;

}



a.app_store_btn:hover,

a.app_store_btn:focus{

	border-color: #41c27d;

	color: #41c27d!important;

}



a.app_store_btn:hover .play_icon{

	background: url('../img/play_hover.png') no-repeat;

}



a.app_store_btn:hover .iphone_icon{

	background: url('../img/iphone_app_hover.png') no-repeat;

}



a.app_store_btn:hover .android_icon{

	background: url('../img/android_app_hover.png') no-repeat;

}



a.app_link{

	text-transform: lowercase;

	letter-spacing: .5px;

	color: #636363;

	font-family: "open_regular", Helvetica, Arial, sans-serif;

	font-size: 16px;

}



a.app_link:hover,

a.app_link:focus{

	text-decoration: none;

	color: #41c27d!important;

}



a.app_store_btn,

.play_icon,

.iphone_icon,

.android_icon,

a.app_link{

	transition: all .2s linear;

	-o-transition: all .2s linear;

	-moz-transition: all .2s linear;

	-webkit-transition: all .2s linear;

}



.twitter .col-centered {

	max-width: 600px;

	height: 705px;

	background: #fff;

	border: 2px solid #ddd;

	border-radius: 8px;

	box-shadow: 0 0 10px rgba(0,0,0,0.1);

	margin-bottom: 60px;

}



.about_video{

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	z-index: 9999;

	background: rgba(0, 0, 0, .8);

	display: none;

}



.about_video iframe{

	width: 100%;

	height: 100%;

	z-index: 9999;

}



.close_video{

	text-decoration: none;

	position: absolute;

	width: 38px;

	height: 38px;

	top: 50px;

	right: 50px;

	background: url('../img/close_video.png') no-repeat;

	z-index: 9999;

}





/*		Featured on section 		*/



.featured_on{

	width: 100%;

	padding: 25px 0;

	background: #fff;

}



.featured_on ul{

	margin: 0;

}



.featured_on li {

	position: relative;

	height: 100%;

	display: inline-block;

}



.featured_on li:first-child{

	margin-left: 0;

}



.twitter_button {

    margin: 60px auto;

    width: 100%;

    text-align: center;

    position: relative;

}





/*		About section 		*/



.about{

	padding: 100px 0;

}



.about .iphone{

	max-width: 339px;

	position: relative;

	display: inline-block;

	text-align: center;

}



.about .iphone img{

	width: 100%;

	height: auto;

}



.about .features_list{

	margin-left: 50px;

}



.about .features_list h1{

	color: #525151;

	font-family: "open_bold", Helvetica, Arial, sans-serif;

	font-size: 34px;

	font-weight: bold;

	line-height: 46px;

	margin: 0 0 20px 0;

	word-break: break-word;

}



.about .features_list p{

	color: #767272;

	font-family: "open_regular", Helvetica, Arial, sans-serif;

	font-size: 16px;

	margin-bottom: 45px;

	line-height: 32px;

}



.about .features_list ul{

	margin-bottom: 30px;

}



.about .features_list ul li{

	display: block;

	position: relative;

	color: #6c6c6c;

	font-family: "open_semibold", Helvetica, Arial, sans-serif;

	font-size: 16px;

	line-height: 44px;

	text-indent: 25px;



	transition: all .2s linear;

	-o-transition: all .2s linear;

	-moz-transition: all .2s linear;

	-webkit-transition: all .2s linear;

}



.about .features_list ul li.camera_icon{	

	background: url('../img/icon1.png') no-repeat;

	background-position: 0 15px; 

}



.about .features_list ul li.video_icon{	

	background: url('../img/icon2.png') no-repeat;

	background-position: 0 15px; 

}



.about .features_list ul li.eye_icon{	

	background: url('../img/icon3.png') no-repeat;

	background-position: 0 14px; 

}



.about .features_list ul li.pic_icon{	

	background: url('../img/icon4.png') no-repeat;

	background-position: 0 14px; 

}



.about .features_list ul li.loc_icon{	

	background: url('../img/icon5.png') no-repeat;

	background-position: 3px 13px; 

}



.about .features_list ul li span{

	display: inline-block;

}





section h2 {

	font-size: 32px;

	margin: 0 0 0 0;

	font-weight: normal;

	text-align: center;

	line-height: .8;

}



section h2 span {

	color: #ccc;

	font-family: 'khmer_mnbold';

	font-size: 24px;

	font-weight: normal;

	display: block;

}







/*		App features 		*/



.episode {

	width: 100%;

	padding: 80px 0 80px 0;

	background: #111;

}



.episode h2 {

	color: #fff;

}



.episode_btn {

	display: block;

	background: url('../img/episode_btn.png') no-repeat top center;

	background-size: contain;

	width: 100%;

	padding-top: 50%;

	margin: 40px auto;

}



.episode_btn span {

	display: none;

}



input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], textarea {

    -webkit-appearance: none;

    -webkit-border-radius: 0;

    border-radius: 0;

    background-color: #fff;

    font-family: inherit;

    border: 1px solid #ccc;

    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);

    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);

    color: rgba(0, 0, 0, 0.75);

    display: block;

    font-size: .875em;

    margin: 0 0 1em 0;

    padding: .5em;

    height: 2.3125em;

    width: 100%;

    -moz-box-sizing: border-box;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    -webkit-transition: -webkit-box-shadow .45s, border-color .45s ease-in-out;

    -moz-transition: -moz-box-shadow .45s, border-color .45s ease-in-out;

    transition: box-shadow .45s, border-color .45s ease-in-out;

}

button, input {

    line-height: normal;

}

button, input, select, textarea {

    font-family: inherit;

    font-size: 100%;

    margin: 0;

}





form {

	display: block;

	margin: 40px auto 0;

	max-width: 800px;

}



form input[type="text"], form textarea {

    color: #fff;

    border-radius: 1px solid #fff;

    border-radius: 6px;

    background: transparent;

    font-size: 1em;

    padding: 1.5em 1.5em;

    margin: .5em 0 2em;

}



form textarea {

    height: 180px;

}



form input[type="submit"] {

    background: transparent;

    border: 1px solid #fff;

    border-radius: 6px;

    color: #fff;

    padding: .8em 2em;

}



label {

    font-size: .875em;

    cursor: pointer;

    display: block;

    font-weight: 500;

    margin-bottom: .1875em;

}



form label {

    color: #fff;

}







/*		Testimonials section 		*/



.characters {

	padding: 80px 0;

}



.characters h2 {

	margin: 30px 0;

}



.characters h3 {

	text-indent: -900000px;

	height: 90px;

	margin: 40px 0 0;

}



.characters h3.uqholder {

	background: url('../img/uq_logo.png') no-repeat center top; 

	background-size: contain;

}



.characters h3.mahora {

	background: url('../img/mahora_logo.png') no-repeat center top;

	background-size: contain;

}



.characters .characters_list{

	margin: 40px auto 0;

}



.characters .characters_list .block {

	padding: 0;

	margin: 0;

	position: absolute;

	bottom: 0;

	width: 300px;

	left: 50%;

	margin-left: -150px;

}



.characters .characters_list .block .name {

	font-weight: bold;

	font-size: 24px;

	line-height: 1;

}

.characters .characters_list .block .name,

.characters .characters_list .block .voice {

	display: block;

	color: #232323;

}



.characters .characters_list .character_100 .block .name {

	font-size: 20px;

}



#products .owl-item {

	height: 500px;

}

#tslider2 .owl-item {

	height: 500px;

}



#tslider1 .owl-item {

  height: 300px;

}



.characters .character_1 {

	background: url('../img/simon.png') no-repeat center top;

	background-size: contain;

} 



.characters .character_2 {

	background: url('../img/andreas.png') no-repeat center top;

	background-size: contain; 

} 



.characters .character_3 {

	background: url('../img/koyama.png') no-repeat center top;

	background-size: contain; 

} 



.characters .character_5 {

	background: url('../img/nishimura.png') no-repeat center top;

	background-size: contain; 

} 



.characters_list li {

    position: relative;

    padding-top: 135%;

}



.#tslider{

	text-align: center!important;

	position: relative!important;

}



#tslider2.owl-item {

	width: 400px;

}



.owl-controls{

	display: block;

	width: 100%;

	text-align: center;

	margin-top: 40px;

	padding: 0;

}



.owl-controls .owl-prev,

.owl-controls .owl-next{

	display: inline-block;

	width: 32px;

	height: 32px;

	background: url('../img/nav_arrow.png') no-repeat;

	text-indent: -200px;

	overflow: hidden;



	transition: all .2s linear;

	-o-transition: all .2s linear;

	-moz-transition: all .2s linear;

	-webkit-transition: all .2s linear;

}



.owl-controls .owl-prev{

	background-position: 0 0;

}

.owl-controls .owl-next{

	background-position: -33px 0;

	margin-left: 40px;

}



.owl-controls .owl-prev:hover,

.owl-controls .owl-next:hover{

	cursor: pointer;

	background: url('../img/nav_arrow_hover.png') no-repeat;

}



.owl-controls .owl-prev:hover{

	background-position: 0 0;

}

.owl-controls .owl-next:hover{

	background-position: -33px 0;

}



/*		Gameplay section 		*/





.gameplay {

	width: 100%;

	padding: 80px 0 80px 0;

}



.job_list {

	max-width: 820px;

	margin: 40px auto; 

}



.gameplay h2 {

	color: #333;

	font-weight: normal;

}



/*   Job List section           */



.gameplay .job_list li {

	padding-top: 45%;

	position: relative;

}



.gameplay .job_list li .block {

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

}



.gameplay .job_list li .block .img,

.gameplay .job_list li .block .description {

	float:left;

	width: 36%;

	height: 100%;

}



.gameplay .job_list li .block .description {

	word-break: break-word;

	display: inline;

	text-align: left;

	color: #333;

	width: 60%;

	padding: 30px 60px;

	background-color: #fff;

  border-radius: 10px;

  border-top-left-radius: 0px;

  border-bottom-left-radius: 0px;

}



.gameplay .job_list li .description h3,

.gameplay .job_list li .description p {

}



.gameplay .job_list li .description p {

	font-size: 15px;

	margin: 20px 0;

	line-height: 2;

}



.gameplay .job_list .img {

	background-repeat: no-repeat;

	background-position: right center;

	background-size: contain; 

}



.gameplay .job_list .battle_8 .img {

	background-image: url('../img/planner.png');

}



.gameplay .job_list .battle_9 .img {

	background-image: url('../img/programmer.png');

}



.gameplay .job_list .battle_10 .img {

	background-image: url('../img/designer.png');

}



.gameplay .job_list .battle_11 .img {

	background-image: url('../img/illustrator.png');

}



/*		Gameplay section 		*/



.battles_list {

	margin: 40px auto; 

}



.title_section {

  padding: 40px 0;

}



.gameplay h2 {

	color: #333;

	font-weight: normal;

}



.gameplay .battles_list li {

	height: 500px;

	position: relative;

}



.gameplay .battles_list li .block {

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

}



.gameplay .battles_list li .block .img,

.gameplay .battles_list li .block .description {

	height: 100%;

}



.gameplay .battles_list li .block .description {

	word-break: break-word;

	display: inline;

	text-align: left;

	color: #333;

	width: 60%;

	margin-left: 3%;

	padding: 30px;

	background-color: #fff;

	border-radius: 10px;

}





.gameplay .job_list li .description h2 {

  margin: 1em 0 2em;

}



.gameplay .job_list li .description h3 {

  margin-bottom: 0;

  font-size: 20px;

}



.gameplay .job_list li .description p {

      margin-top: 0;

}



.gameplay .battles_list li .description p {

	font-size: 15px;

	margin: 20px 0;

	line-height: 2;

}



.gameplay .battles_list .img {

	background-repeat: no-repeat;

	background-position: center center;

	background-size: contain; 

}



.gameplay .battles_list .battle_1 .img {

	background-image: url('../img/iphonepocha.png');

}



.gameplay .battles_list .battle_2 .img {

	background-image: url('../img/iphoneotakon.png');

}



.gameplay .battles_list .battle_3 .img {

	background-image: url('../img/iphonerkon.png');

}



.gameplay .battles_list .battle_4 .img {

	background-image: url('../img/iphonepetkon.png');

}



.gameplay .battles_list .battle_5 .img {

	background-image: url('../img/iphonecelebkon.png');

}

.gameplay .battles_list .battle_6 .img {

	background-image: url('../img/iphoneosake.png');

}

.gameplay .battles_list .battle_7 .img {

	background-image: url('../img/iphonemask.png');

}







/*		End Gameplay section 		*/



/*		Gallery section 		*/





section h2.sub_title {

  font-size: 1.8em;

}

section h2.sub_title span{

  font-size: .9em;

}

.joblist {

  background: whitesmoke;

}





.gallery {

	width: 100%;

	padding: 40px 0 10px 0;

	background-size: cover;

  background: whitesmoke;

}



.gallery_list {

	margin: 40px auto;

  max-width: 1280px; 

}



.gallery_list .img {

	position: absolute;

	top: 0;

	left: 0;

	right: 1.1%;

	bottom: 10.2%;

}

.gallery_list .img {

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

}



.gallery h2 {

	font-weight: normal;

}



.gallery .gallery_list li .block {

	position: absolute;

	top: 0;

	left: 0;

	right: 0;

	bottom: 0;

}



.gallery .gallery_list #tslider1 .img {

  height: 300px;

}



.gallery .gallery_list .gallery_1 .img {

	background: url('../img/gallery_phone.png') no-repeat center center;

	background-size: contain; 

}

	

.gallery .gallery_list .gallery_2 .img {

	background: url('../img/gallery_phone_1.png') no-repeat center center;

	background-size: contain;

}



.gallery .gallery_list .gallery_3 .img {

  background: url('../img/gallery_phone_2.png') no-repeat center center;

  background-size: contain;

}



.gallery .gallery_list .gallery_4 .img {

  background: url('../img/gallery_phone_3.png') no-repeat center center;

  background-size: contain;

}





.gallery .gallery_list .gallery_5 .img {

  background: url('../img/gallery_phone_rezero.png') no-repeat center center;

  background-size: contain; 

}

  

.gallery .gallery_list .gallery_6 .img {

  background: url('../img/gallery_phone_rezero_1.png') no-repeat center center;

  background-size: contain;

}



.gallery .gallery_list .gallery_7 .img {

  background: url('../img/gallery_phone_rezero_2.png') no-repeat center center;

  background-size: contain;

}



.gallery .gallery_list .gallery_8 .img {

  background: url('../img/gallery_phone_rezero_3.png') no-repeat center center;

  background-size: contain;

}



/*		End Gallery section 		*/







/*		Footer 		*/



footer {

	padding: 40px 0;

	text-align: left;

	background: #111;

	color: #eee;

}



footer .app_platform li{

	margin: 0 0 0 60px;

}



footer .app_platform li:first-child{

	margin: 0;

}



footer div {

	margin-bottom: 40px;

}



footer h2 {

	color: #eee;

	margin: 0;

	font-size: 16px;

}



footer table td {

	padding: 5px; 

}



footer li {

	text-align: right;

	line-height: 2.3;

}



footer li a {

	color: #fff;

	text-decoration: underline; 

}



footer .copyright{

	margin-top: 60px;

	color: #ccc;

	font-size: 12px;

	letter-spacing: .5px;

	clear: both;

	text-align: center;

}



/*		Responsive CSS 		*/



@media (max-width: 1024px) {

  footer h1.logo {

      margin-top: -190px;

  }

}



@media (max-width: 1020px) {

  footer h1.logo {

      margin-top: -190px;

  }

}

@media (max-width: 768px) {



  .gallery_list .owl-carousel .owl-wrapper-outer {

    padding-left: initial;

  }



  .gallery .gallery_list .gallery_2 .img {

    width: initial;

    margin-left: initial;

  }



	/*		Header 		*/

	header .logo{

		margin-right: 0;

	}



	header .burger_icon{

		display: block;

	}



	header nav {

		width: 100%;

		float: none;

		background: #000;

		position: absolute;

		margin-top: 0;

		left: 0;

		display: none;

		padding: 100px 0; 

	}



  #home_view h1.slogan {

      font-size: 2em;

      position: absolute;

      text-align: center;

      width: 100%;

      bottom: 150px;

      padding: 0 10%;

  }



  #home_view h1.logo {

    margin-top: -120px;

  }



	header nav.show{

		display: block;

	}



	header nav li{

		display: block;

		width: 100%;

		margin: 0;

		text-align: center;

	}



	header nav li a{

		display: block;

		width: 100%;	

		padding: 20px 0;

		border-bottom: 1px solid #ccc;

	}



	header nav li:first-child a{

		border-top: 1px solid #ccc;

	}



	header .social{

		display: none;

	}



	header .social li{

		margin-left: 10px;

	}



	/*		Hero section 		*/





	.app_store_btn{

		display: block;

		width: 90%;

		padding-left: 0;

		padding-right: 0;

		text-align: center;

	}



	/*		Featured on section		*/

	.featured_on{

		padding: 25px 0!important;

	}



	.featured_on ul li{

		margin-bottom: 0 !important;

	}



	.key_visual .logo {

		width: 88%;

		background: url(../img/negimate_logo.png) no-repeat center bottom;

		position: absolute;

		bottom: 0;

		left: 0;

		height: 100%;

		margin: 0 6%;

		background-size: contain;

	}



	.key_visual .girls {

	    width: 100%;

	}



	/*		About Section 		*/

	.about .features_list {

		text-align: center;

		margin: 0;

	}



	.about .features_list ul li{

		text-indent: 0;

		background: transparent!important;

		margin-bottom: 20px;

	}



	.about .features_list ul li:last-child{

		margin: 0;

	}



	a.app_link{

		display: block;

		margin-top: 20px;

	}



	footer li {

		text-align: left;

		line-height: 2.3;

	}



	footer h1.logo {

		margin-top: -200px;

	}



	header {

		position: fixed;

		display: block;

		width: 100%;

		height: 60px;

		z-index: 99;

		background-color: transparent;

		top: 0;

	}



	.hero {

		margin-top: 0;

		padding-top: 50px;

		height: 540px;

		width: 100%;

		background-size: cover%;

	}



	.page_hero {

		margin-top: 0;

		padding-top: 50px;

		height: 540px;

	}



	.page .page_hero {

		height: 100px;

		padding-top: 0;

		background-size: 160%;

		margin-top: 0; 

	}

	

	.page .key_visual {

		height: 100px;

	}

	

	.page .key_visual .logo {

		width: 160px;

		height: 93px;

		right: 0;

		left: initial;

		bottom: initial;

		top: 0;

	}



	.twitter .yukihime,

	.twitter .yue {

		display: none;

	}



	.gameplay h3 {

    font-size: 20px;

    margin: 0;

	}



	.gameplay .battles_list li .description p {

	    font-size: 12px;

	    margin: 5px 0;

	    line-height: 1.4;

	}



	.gameplay .battles_list li {

    padding-top: 135%;

    position: relative;

	}



	.gameplay .battles_list li .block .img {

    float: none;

    width: 100%;

    height: 100%;

	}



	.gameplay .battles_list li .block .description {

    float: none;

    width: 80%;

    height: 30%;

    display: block;

    margin-top: 5%;

    margin-left: auto;

    margin-right: auto;

	}



  .gameplay .job_list li {

      padding-top: 50%;

      position: relative;

  }

	

  .gameplay .battles_list .img {

		background-position: center center;

	}



	.gameplay .job_list li .description p {

	    font-size: 12px;

	    margin: 5px 0;

	    line-height: 1.4;

	}



  .gameplay .job_list li .block .img {

      float: left;

      width: 40%;

      height: 100%;

      margin: 0;

  }



  .gameplay .job_list li .block .description {

    float: right;

    width: 60%;

    height: 100%;

    display: block;

    margin-top: 0;

    margin-left: auto;

    margin-right: auto;

    padding: 25px; 

  }

	.gameplay .job_list .img {

		background-position: center center;

	}

  #home_view #clock_nest {

    position: absolute;

    right: 40px;

    bottom: 40px

  }



  section h2.sub_title {

    font-size: 1.7em;

  }

  section h2.sub_title span{

    font-size: .9em;

  }

}



@media (max-width: 425px) {

  .gameplay .job_list li .description h3 {

    font-size: 16px;

  }

  .gameplay .job_list li .description p {

    font-size: 14px;

    margin: 5px 0 30px;

  }

  .gameplay .job_list li {

    padding-top: 140%;

    position: relative;

  }

  .gameplay .job_list li .description h2 {

    margin: 0.5em 0 1em;

  }

  .gameplay .job_list li .block .img {

    float: none;

    width: 100%;

    height: 50%;

  }

  .gameplay .job_list li .block .description {

    float: none;

    width: 100%;

    height: 50%;

    border-radius: 10px;

    border-top-left-radius: 0px;

    border-top-right-radius: 0px;

    border-bottom-left-radius: 10px;

    padding: 25px;

  }

  .gameplay .job_list .img {

    background-image: url(../img/planner.png);

    background-size: cover;

    border-top-right-radius: 10px;

    border-top-left-radius: 10px;

  }

  table td.title {

      white-space: nowrap;

      clear: both;

      position: absolute;

      margin-top: -24px;

      font-weight: bold;

      color: #fff;

  }

  table td {

    padding: 1em 1em 2em 0;

  }

  .gallery {

      margin-top: 0;

      margin-bottom: 0;

  }

  .gameplay {

    padding: 40px 0 0px 0;

  }

  .episode {

    padding: 40px 0 40px 0;

  }

  .characters {

    padding: 20px 0;

  }

  .characters_list li {

    padding-top: 135%;

  }

  .container {

    padding-right: 25px;

    padding-left: 25px;

  }

  .gallery .container {

    padding-right: 0;

    padding-left: 0;

  }

  #home_view h1.logo {

    margin-top: -130px;

    width: 220px;

    height: 190px;

    margin-left: -110px;

  }

  #home_view h1.slogan {

    bottom: 201px;

    font-size: 1.7em;

    padding: 0;

  }

  #home_view #clock_nest {

    position: absolute !important;

    bottom: 40px;

  }

  #tslider1 .owl-item {

    height: 170px;

  }

  .gallery .gallery_list #tslider1 .img {

    height: 170px;

  }



}



@media (max-width: 500px) {



}



@media (max-width: 375px) {

  #home_view h1.logo {

    width: 200px;

    height: 180px;

    margin-left: -100px;

    margin-top: -100px;

  }



  #home_view h1.slogan {

    font-size: 1.4em;

    bottom: 190px;

  }

  .gameplay .job_list li {

    padding-top: 160%;

    position: relative;

  }

  .gameplay .job_list li .description h2 {

    font-size: 2em;

  }

  #home_view #clock_nest {

    right: 20px;

  }

  footer h1.logo {

    width: 140px;

    height: 110px;

    margin-left: -70px;

    margin-top: -165px;

  }

}



@media (max-width: 320px) {



  #home_view h1.logo {

    width: 180px;

    height: 160px;

    margin-left: -90px;

    margin-top: -80px;

  }



  #home_view h1.slogan {

    font-size: 1.2em;

    bottom: 190px;

  }



  footer h1.logo {

    width: 140px;

    height: 110px;

    margin-left: -70px;

    margin-top: -165px;

  }

  .gameplay .job_list li .block .img {

    height: 40%;

  }

  .gameplay .job_list li .block .description {

    height: 60%;

  }

  .gameplay .job_list li .description h2 {

    font-size: 1.6em;

  }

}