/* CSS Document */

#main .main-inner .right-part p.release-date{
    color: #ff0000;
    display: block;
    font-size: 15px;
    font-weight: bold;
    padding-bottom: 5px;
    padding-left: 0;
    padding-right: 0;
    padding-top: 50px;
    text-align: center;
}

#main .main-inner .right-part .logo {
	padding-top: 120px;
	text-align:center;
}

#main .main-inner .right-part .logo img{
	width:auto;
}

#main .mainvision .left-part {
	float: left;
	padding-left: 2.04082%;
	padding-right: 3.06122%;
	 width: 40.8163%;
}
#main .mainvision .right-part {
	float: right;
	padding-left: 0;
	padding-right: 5.10204%;
	 width: 48.8776%;
}


.mainvision .left-part #gall{
	width:			400px;
	transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
}

.mainvision .left-part #gall .stage{
	margin:			0 auto;
	position:		relative;
	width:			400px;
	height:			400px;
}

.mainvision .left-part #gall .stage img{
	position:		absolute;
	left:			0;
	top:			0;
	width:			400px;
	height:			400px;
}

.mainvision .left-part #gall .stage{
}

.mainvision .left-part #gall .color-selector{
	margin:			0 0 5px 0;
}

.mainvision .left-part #gall .color-selector ul{
	margin:			0 auto;
	width:			400px;
	text-align:		center;
}

.mainvision .left-part #gall .color-selector ul li{
	display:		inline-block;
	/display:		inline;
	/zoom:			1;
	padding:		2px;
	margin:			0 10px 0 0;
	width:			18px;
	height:			18px;
}

.mainvision .left-part #gall .color-selector ul li.active{
	background:		url(../img/main_img_ico_bg_o.png) no-repeat;
}

.mainvision .left-part #gall .color-selector ul li span{
	display:		inline-block;
	/display:		inline;
	/zoom:			1;
	padding:		18px 0 0 0;
	width:			18px;
	height:			0;
	overflow:		hidden;
	background-repeat:	no-repeat;
	cursor:			pointer;
}

.mainvision .left-part #gall .color-selector ul li.c1 span{ background-image: url(../img/main_img_ico_01.png); }
.mainvision .left-part #gall .color-selector ul li.c2 span{ background-image: url(../img/main_img_ico_02.png); }
.mainvision .left-part #gall .color-selector ul li.c3 span{ background-image: url(../img/main_img_ico_03.png); }
.mainvision .left-part #gall .color-selector ul li.c4 span{ background-image: url(../img/main_img_ico_04.png); }

.mainvision .left-part #gall .color-selector ul li.other{
	margin:			0;
	width:			auto;
	vertical-align:		bottom;
}

.mainvision .left-part #gall .color-selector ul li.other a{
	display:		inline-block;
	/display:		inline;
	/zoom:			1;
	height:			18px;
	padding:		0 0 0 10px;
	background:		url(/common/img/icon-cursor.png) no-repeat left center;
	font-size:		12px;
	line-height:		18px;
}

.mainvision .left-part #gall .thumbs{
}

.mainvision .left-part #gall .thumbs ul{
	margin:			0 auto;
	width:			400px;
	text-align:		center;
	white-space:		nowrap;
}

.mainvision .left-part #gall .thumbs ul li{
	display:		inline-block;
	/display:		inline;
	/zoom:			1;
	margin:			0 4px 0 0;
	width:			76px;
	height:			76px;
}

.mainvision .left-part #gall .thumbs ul li span{
	display:		inline-block;
	/display:		inline;
	/zoom:			1;
	padding:		75px 0 0 0;
	width:			75px;
	height:			0;
	overflow:		hidden;
	background:		url(../img/main_img_thu.jpg) no-repeat;
	border:			1px solid #cccccc;
	cursor:			pointer;
}


.mainvision .left-part #gall.c1 .thumbs ul li.t1 span{ background-position:    0px    0px; }
.mainvision .left-part #gall.c1 .thumbs ul li.t2 span{ background-position:  -75px    0px; }


.mainvision .left-part #gall.c2 .thumbs ul li.t1 span{ background-position:    0px  -75px; }
.mainvision .left-part #gall.c2 .thumbs ul li.t2 span{ background-position:  -75px  -75px; }

.mainvision .left-part #gall.c3 .thumbs ul li.t1 span{ background-position:    0px -150px; }
.mainvision .left-part #gall.c3 .thumbs ul li.t2 span{ background-position:  -75px -150px; }

.mainvision .left-part #gall.c4 .thumbs ul li.t1 span{ background-position:    0px -225px; }
.mainvision .left-part #gall.c4 .thumbs ul li.t2 span{ background-position:  -75px -225px; }

.mainvision .left-part #gall .thumbs ul li.active span{
	border-color:		#666666;
}




#main .main-inner .article {
	margin:50px 0 !important;
}

#head-area ul.socialbutton {
	position: absolute;
	bottom: -35px;
	right: 0;
}

#main .main-inner .right-part .lead{
	padding-bottom: 20px;
	padding-left:	0px;
	text-align: center;
}

#main .main-inner .right-part .banner{
	padding-top:		30px;
}

#main .main-inner .right-part .banner img {
	width: 62.5%;
}


#main .main-inner .block-top-1{
	padding:0 2.040816326530612244897959183673%;
	width:auto;
}




#main .main-inner .block-top-1 .photo{
	margin:0 auto;
}

#main .main-inner .block-top-1 .photo img{
	width:100%;
}
#main .main-inner .block-top-1 .center{
	text-align:center;
}

#main .main-inner .block-top-1 .center .text-title-lv2{
	font-size:44px;
	line-height:1.2;
}
#main .main-inner .block-top-1 .center p{
	font-size:14px;
	line-height:1.2;
}

#main .main-inner .block-top-1 .left-part{
	width:	54.255319148936170212765957446809%;
	padding:0;
}
#main .main-inner .block-top-1 .right-part{
	width:	42.553191489361702127659574468085%;
	float:right;padding:0;
}
#main .main-inner .block-top-1 .text-title-lv2{
	font-size:24px;
	padding:0;
}

#main .main-inner .block-top-1 .left-part .left-block-2 .left{
	width:76.470588235294117647058823529412%;
	float:left;
}

#main .main-inner .block-top-1 .left-part .left-block-2 .right{
	width:	19.60784313725490196078431372549%;
	float:right;
}

#main .main-inner .block-top-2{
	padding:0 2.040816326530612244897959183673% 50px;
	width:auto;
}

#main .main-inner .block-top-2 .left-part{
	width:	46.914893617021276595744680851064%;
	padding:0;
}
#main .main-inner .block-top-2 .right-part{
	width:	51.063829787234042553191489361702%;
	float:right;
	padding:0;
}
#main .main-inner .block-top-2 .text-title-lv2{
	font-size:32px;
	padding:0;
}
#main .main-inner .block-top-2 .left-part .note{
	text-align:right;
}


#main .main-inner .block-top-3{
	padding:0 0 50px 2.040816326530612244897959183673%;
	width:auto;
}
#main .main-inner .block-top-3 .text-title-lv2{
	font-size:32px;
	padding:0;
}
#main .main-inner .block-top-3 .left-part{
	width:	64.583333333333333333333333333333%;
	padding:0;
}
#main .main-inner .block-top-3 .right-part{
	width:	31.25%;
	float:right;
	padding:0;
}

#main .main-inner .block-top-4{
	padding:0 2.040816326530612244897959183673% 50px;
	width:auto;
}
#main .main-inner .block-top-4 .text-title-lv2{
	font-size:32px;
	padding:0;
}
#main .main-inner .block-top-4 .left-part{
	width:29.89361702127659574468085106383%;
	padding:0;
}
#main .main-inner .block-top-4 .right-part{
	width:	69.148936170212765957446808510638%;
	float:right;
	padding:0;
}
#main .main-inner .block-top-5{
	padding:0 2.040816326530612244897959183673% 50px;
	width:auto;
}
#main .main-inner .block-top-5 .text-title-lv2{
	font-size:32px;
	padding:0;
}
#main .main-inner .block-top-5 .text-title-lv2 span{
	font-size:24px;
}
#main .main-inner .block-top-5 .left-part{
	width:54.255319148936170212765957446809%;
	padding:0;
}
#main .main-inner .block-top-5 .right-part{
	width:	42.553191489361702127659574468085%;
	float:right;
	padding:0;
}


@media screen and (max-width: 640px) {
	#main .main-inner .right-part .banner{
		text-align: center;
		margin: 10px 0px 30px;
	}
	
	#main .main-inner .right-part .banner img {
/*		width: auto;
*/	}
	#head-area ul.socialbutton {
		position: static;
	}
	
	#main .main-inner .block-top-1 .photo img{
		width: 100%;
	}
	
	#main .mainvision .left-part {
		float: none;
		padding-left:0;
		padding-right: 0;
		 width:100%;
	}
	#main .mainvision .right-part {
		float: none;
		padding-left: 0;
		padding-right: 0;
		 width: 100%;
	}
	#main .main-inner .right-part .logo {
		padding-top: 10px;
		text-align:left;
	}
	#main .main-inner .block-top-1 .left-part{
		width:	100%;
	}
	#main .main-inner .block-top-1 .right-part{
		width:	100%;
		float:none;
		max-width:400px;
		margin-top:10px;
	}
	#main .main-inner .block-top-1 .left-part .left-block-2 .left{
		width:100%;
		float:none;
	}
	
	#main .main-inner .block-top-1 .left-part .left-block-2 .right{
		width:100%;
		float:none;
		max-width:100px;
		margin-top:10px;
	}

	#main .main-inner .block-top-2 .left-part{
		width:	100%;
		max-width:441px;
	}
	#main .main-inner .block-top-2 .right-part{
		width:	100%;
		float:none;
		margin-top:10px;
	}
	#main .main-inner .block-top-2 .left-part .note{
		text-align:left;
	}	
	#main .main-inner .block-top-3 .left-part{
		width:	100%;
	}
	#main .main-inner .block-top-3 .right-part{
		width:	100%;
		float:none;
		max-width:300px;
		margin-top:10px;
	}
	
	#main .main-inner .block-top-4 .left-part{
		width:100%;
		max-width:281px;
	}
	#main .main-inner .block-top-4 .right-part{
		width:	100%;
		float:none;
		margin-top:10px;
	}
	#main .main-inner .block-top-5 .left-part{
		width:100%;
	}
	#main .main-inner .block-top-5 .right-part{
		width:100%;
		float:none;
		max-width:400px;
		margin-top:10px;
	}
	
}


#main .main-inner .banner-block{
	background:		none;
}

#main .main-inner .banner-block span.notice{
	display:		block;
	text-align:		right;
	padding-top:		2px;
}


/* .article
-----------------------*/

#main .main-inner .article .text-box{
	width: 63.1808278867%;/* 290/459 */
	float: left;
}
#main .main-inner .article .img-wrap{
	width: 32.6797385621%;/* 150/459 */
	float: right;
}

#main .main-inner .article .right-part-1{
	position: relative;
}

#main .main-inner .article .right-part-1 .text-box{
	width: 50.1089324619%;/* 230/459 */
	position: absolute;
	top: 0px;
	right: 0px;
}
#main .main-inner .article .right-part-1 .img-wrap{
	width: 51.1982570806%;/* 235/459 */
	float: none;
}

@media screen and (max-width: 640px) {

	#main .main-inner .article img {
		min-width:0 ;
	}
	
	
	
	
	
	
}
