@charset "Shift_JIS";

/**
 * contents.css <www.sony.jp/cyber-shot/qx/css/>
 * create : 2013.09.12
 * update : 2014.03.04
 */

/*--------------------------------------------------------------------------------
	#TOP
--------------------------------------------------------------------------------*/
#TOP h1 {
	position: absolute;
	left: 57px;
	top: 50px;
	z-index: 1;
}

/* .content
--------------------------------------------------------------------------------*/
#TOP .content {
	position: relative;
}
#TOP .content .btn-enter {
	position: absolute;
	left: 1720px;
	top: 800px;
	z-index: 200;
	width: 147px;
	height: 146px;
	text-align: center;
	cursor: pointer;
}
#TOP .content .btn-enter img {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 200;
}
.no-js #TOP .content .btn-enter {
	display: none;
}
#TOP .content .enter {
	position: absolute;
	left: 1777px;
	top: 962px;
	z-index: 150;
}
.no-js #TOP .content .enter {
	display: none;
}

/* .bottom
--------------------------------------------------------------------------------*/
#TOP .bottom {
	position: absolute;
	left: 0;
	bottom: 0;
}
#TOP .bottom h3 {
	position: absolute;
	left: 420px;
	bottom: 184px;
}
#TOP .bottom .smartphone {
	position: absolute;
	left: 58px;
	bottom: 103px;
}
#TOP .bottom .qx10 {
	position: absolute;
	left: 420px;
	bottom: 60px;
}
#TOP .bottom .qx30{
	position: absolute;
	left: 861px;
	bottom: 60px;
}
#TOP .bottom .qx100 {
	position: absolute;
	left: 1188px;
	bottom: 60px;
}

#TOP .bottom .qx1{
	position: absolute;
	left: 1540px;
	bottom: 60px;
}
#TOP .bottom .bnr {
	position: absolute;
	left: 74px;
	bottom: 70px;
	background: #fff;
}
#TOP .bottom li img {
	background: #91c070;
}
#TOP .bottom li a {
	display: block;
}

/*--------------------------------------------------------------------------------
	#MOVIE
--------------------------------------------------------------------------------*/
#MOVIE .content {
	position: relative;
}
#MOVIE .content .movie-box {
	position: relative;
	margin: 410px auto;
	width: 990px;
	height: 556px;
	background: #222;
}

.mobile #MOVIE .content .mov-player {
	display: none;
}
#MOVIE .content .mov-mobile {
	display: none;
}
#MOVIE .content .video-player {
	display: none;
}
.mobile #MOVIE .content .mov-mobile {
	display: block;
}


/*--------------------------------------------------------------------------------
	#SCENE1
--------------------------------------------------------------------------------*/
#SCENE1 .content .thick_1 {
	position: absolute;
	left: 943px;
	top: 719px;
}
#SCENE1 .content .thick_2 {
	position: absolute;
	left: 1201px;
	top: 719px;
}
#SCENE1 .content .thick_3 {
	position: absolute;
	left: 1458px;
	top: 719px;
}

/*--------------------------------------------------------------------------------
	#SCENE2
--------------------------------------------------------------------------------*/
#SCENE2 .content .thick_1 {
	position: absolute;
	left: 262px;
	top: 559px;
}
#SCENE2 .content .thick_2 {
	position: absolute;
	left: 520px;
	top: 559px;
}
#SCENE2 .content .thick_3 {
	position: absolute;
	left: 777px;
	top: 559px;
}

/*--------------------------------------------------------------------------------
	#SCENE3
--------------------------------------------------------------------------------*/
#SCENE3 .content .thick_1 {
	position: absolute;
	left: 888px;
	top: 775px;
}
#SCENE3 .content .thick_2 {
	position: absolute;
	left: 1146px;
	top: 775px;
}
#SCENE3 .content .thick_3 {
	position: absolute;
	left: 1403px;
	top: 775px;
}

/*--------------------------------------------------------------------------------
	#SCENE4
--------------------------------------------------------------------------------*/
#SCENE4 .content .thick_1 {
	position: absolute;
	left: 931px;
	top: 762px;
}
#SCENE4 .content .thick_2 {
	position: absolute;
	left: 1189px;
	top: 762px;
}
#SCENE4 .content .thick_3 {
	position: absolute;
	left: 1446px;
	top: 762px;
}

/*--------------------------------------------------------------------------------
	#SCENE5
--------------------------------------------------------------------------------*/
#SCENE5 .content .thick_1 {
	position: absolute;
	left: 943px;
	top: 740px;
}
#SCENE5 .content .thick_2 {
	position: absolute;
	left: 1201px;
	top: 740px;
}
#SCENE5 .content .thick_3 {
	position: absolute;
	left: 1458px;
	top: 740px;
}

/*--------------------------------------------------------------------------------
	#PRODUCTS
--------------------------------------------------------------------------------*/
#PRODUCTS .content {
	position: relative;
	left: 0;
	top: 0;
}
#PRODUCTS .content .qx10 {
	position: absolute;
	left: 145px;
	top: 880px;
}
#PRODUCTS .content .qx30 {
	position: absolute;
	left: 580px;
	top: 955px;
}
#PRODUCTS .content .qx100 {
	position: absolute;
	left: 955px;
	top: 700px;
}
#PRODUCTS .content .qx1 {
	position: absolute;
	left: 1393px;
	top: 775px;
}
#PRODUCTS .content .bnr {
	position: absolute;
	left: 1040px;
	top: 985px;
}


.mobile #PRODUCTS .content .qx10 {
	position: absolute;
	left: 145px;
	top: 880px;
}
.mobile #PRODUCTS .content .qx30 {
	position: absolute;
	left: 580px;
	top: 955px;
}
.mobile #PRODUCTS .content .qx100 {
	position: absolute;
	left: 955px;
	top: 700px;
}
.mobile #PRODUCTS .content .qx1 {
	position: absolute;
	left: 1393px;
	top: 775px;
}
.mobile #PRODUCTS .content .bnr {
	position: absolute;
	left: 1040px;
	top: 985px;
}


#PRODUCTS .content .sns .twitter {
	position: absolute;
	left: 74px;
	top: 1302px;
}
#PRODUCTS .content .sns .facebook {
	position: absolute;
	left: 137px;
	top: 1302px;
}
#PRODUCTS .content .sns .google {
	position: absolute;
	left: 199px;
	top: 1302px;
}
#PRODUCTS .content .sns .twitter img,
#PRODUCTS .content .sns .facebook img,
#PRODUCTS .content .sns .google img {
	position: absolute;
	left: 0;
	top: 0;
}

#PRODUCTS .got-to-top {
	display: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 200;
	width: 129px;
	height: 100%;
	background: url("../img/products_top.gif") repeat-y right 0;
}
#PRODUCTS .got-to-top .btn {
	position: absolute;
	right: -3px;
	top: 0;
	width: 132px;
	height: 132px;
}
#PRODUCTS .got-to-top img {
	position: absolute;
	left: 0;
	top: 0;
	margin-top: 633px;
	cursor: pointer;
}
.js #PRODUCTS .got-to-top {
	display: block;
}