@charset "utf-8";

*{
	margin:0;
	padding:0;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

html{
	height:100%;
	width:100%;
}

body{
	margin:0;
	padding:0;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-size:14px;
	height:100%;
	width:100%;
	color:#333333;
}

h1{
	font-size:115%;
}

h2{
	font-size:110%;
}

h3{
	font-size:105%;
}

p, a, td, li{
	font-size:100%;
	color:#333333;
}

a img {
	border:none;
}

.clear{
	float:none;
	clear:both;
}
.clearfix:after{
	content:".";
	display:block;
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden;
}
.tableBorderCollapse{
	border-collapse:collapse;
}
.textOverflow{
	text-overflow: ellipsis;
}
.box-sizing{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing:border-box;
}
.opacity{
	zoom: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}

body.top{
	background:url(img/topBg.jpg) left top repeat-x;
}
body.lineup{
	background:url(img/lineupBg.jpg) left top repeat-x;
}
body.interview{
	background:url(img/interviewBg.jpg) left top repeat-x;
}
body.pattern{
	background:url(img/patternBg.jpg) left top repeat-x;
}
body.howto{
	background:url(img/howtoBg.jpg) left top repeat-x;
}
#container{
	width:1100px;
	overflow:hidden;
	position:absolute;
	left:50%;
	top:112px;
	margin-left:-550px;
}


/* --------------- MAIN --------------- */
#main{

}
#main .wrapper{
	background:white;
	position:relative;
}




/* --------------- HEADER --------------- */
header{
	background:white;
	padding-top:44px;
	height:65px;
	border-bottom:solid 3px #d2d2d3;
	z-index:2;
	position:fixed;
	top:0;
	left:0;
	width:100%;
}
header .wrapper{
	width:980px;
	margin:0 auto;
	height:68px;
	position:fixed;
	left:50%;
	margin-left:-490px;
}
header h1{
	float:left;
	margin-right:30px;
}


/* --------------- NAVIGATION --------------- */
nav{
	float:left;
}
nav ul{
	list-style:none
}
nav ul li{
	float:left;
	position:relative;
	background:white;
}
nav ul li ul{
	display:none;
	position:absolute;
	left:2px;
	top:44px;
	padding:0 1px 1px 1px;
	background:url(img/navBg.png) left top repeat;
	width:117px;
	z-index:2;
}
nav ul li img{
	display:block;
}
nav ul .current img{
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}
nav ul .current ul li img{
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}
nav ul li ul .current img{
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}
nav ul .nav1{
	background:url(img/nav1Bg.jpg) left top no-repeat;
}
nav ul .nav2{
	background:url(img/nav2Bg.jpg) left top no-repeat;
}
nav ul .nav3{
	background:url(img/nav3Bg.jpg) left top no-repeat;
}
nav ul .nav4{
	background:url(img/nav4Bg.jpg) left top no-repeat;
}
nav ul .nav5{
	background:url(img/nav5Bg.jpg) left top no-repeat;
}
nav ul .nav5a{
	background:url(img/nav5aBg.jpg) left top no-repeat;
}
nav ul .nav5b{
	background:url(img/nav5bBg.jpg) left top no-repeat;
}
nav ul .nav5c{
	background:url(img/nav5cBg.jpg) left top no-repeat;
}


/* --------------- TOP PAGE --------------- */
#top{
	padding-bottom:74px;
}
#top #topBox{
	width:100%;
	height:940px;
	position:relative;
	background:url(img/top.jpg) left top repeat-x;
}
#top #topBox img{
	position:absolute;
	display:none;
}
#top #topBox .top1{
	top:23px;
	left:54px;
}
#top #topBox .top2{
	top:23px;
	left:386px;
}
#top #topBox .top3{
	top:40px;
	left:689px;
}
#top #topBox .topTitle{
	top:369px;
	left:287px;
}
#top img{
	display:block;
}
#top ul{
	list-style:none;
	text-align:center;
	position:absolute;
	left:0;
	top:554px;
	width:100%;
}
#top ul li{
	display:inline-block;
}
#top ul .topPr1{
	width:188px;
}
#top ul .topPr2{
	width:185px;
}
#top ul .topPr3{
	width:186px;
}
#top ul .topPr4{
	width:185px;
}
#top ul .topPr5{
	width:185px;
}

#top #topBox ul li a img{
	position:relative;
}
#top .topLink{
	width:288px;
	display:block;
	margin:0 auto;
}
#topSpecial{
	padding-bottom:78px;
}
#topSpecial h2{
	display:block;
	clear:both;
	margin-left:-147px;
}
#topSpecial img{
	display:block;
}
#topSpecial ul{
	list-style:none;
	text-align:center;
	margin-top:50px;
}
#topSpecial ul li{
	display:inline-block;
	margin:0 1px;
}
#topSpecial .toTop{
	width:180px;
	display:block;
	margin:0 auto;
	margin-top:82px;
}
#topSpecial .toTop img{
	margin-left:0;
}
#topConcept{
	background:#ffdee6;
	padding-bottom:57px;
}
#topConcept h2{
	display:block;
	clear:both;
}
#topConcept img{
	display:block;
	margin-left:-147px;
}
#topConcept .toTop{
	width:190px;
	display:block;
	margin:0 auto;
	margin-top:8px;
}
#topConcept .toTop img{
	margin-left:0;
}
#topAbout{
	padding-bottom:44px;
}
#topAbout h2{
	display:block;
	clear:both;
}
#topAbout img{
	display:block;
	margin-left:-147px;
}
#topAbout ul{
	list-style:none;
	text-align:center;
}
#topAbout ul li{
	display:inline-block;
	margin:0 -2px;
}
#topAbout ul li img{
	margin-left:0;
}
#topAbout .toTop{
	width:194px;
	display:block;
	margin:0 auto;
	margin-top:50px;
}
#topAbout .toTop img{
	margin-left:0;
}


/* --------------- LINUP PAGE --------------- */
#lineupTop{
	height:680px;
	width:100%;
	background:white url(lineup/img/topBg.jpg) left top repeat-x;
	position:relative;
}
#lineupTop h2{
	position:absolute;
	top:42px;
	left:397px;
	display:none;
}
#lineupTop a{
	position:absolute;
	top:175px;
	display:none;
}
#lineupTop #lineupNav1{
	left:145px;
}
#lineupTop #lineupNav2{
	left:308px;
}
#lineupTop #lineupNav3{
	left:471px;
}
#lineupTop #lineupNav4{
	left:636px;
}
#lineupTop #lineupNav5{
	left:802px;
}
.lineup{
	position:relative;
	height:800px;
	width:100%;
}
#lineup4{
	height:799px;
}
.lineup h2{
	position:absolute;
	left:67px;
	top:58px;
}
#lineup1 h2{
	top:66px;
}
.lineup .lineupImg{
	position:absolute;
	left:67px;
	top:155px;
}
#lineup1 .lineupImg{
	top:169px;
}
.lineup .lineupRightImg{
	position:absolute;
	left:420px;
	top:152px;
	width:557px;
	height:320px;
}
.lineup .lineupRightImg .lineupRightImgMain{
	position:relative;
	width:240px;
	height:182px;
	background:white;
	margin-top:61px;
	margin-left:38px;
}
.lineup .lineupRightImg .lineupRightImgMain img{
	position:absolute;
	left:0;
	top:0;
	width:240px;
	height:182px;
}
.lineup .lineupRightImg .lineupRightImgSub1{
	position:absolute;
	left:301px;
	top:61px;
	width:115px;
	height:88px;
	background:black;
}
.lineup .lineupRightImg .lineupRightImgSub1 img{
	width:115px;
	height:88px;
}
.lineup .lineupRightImg .lineupRightImgSub2{
	position:absolute;
	left:425px;
	top:61px;
	width:115px;
	height:88px;
	background:black;
}
.lineup .lineupRightImg .lineupRightImgSub2 img{
	width:115px;
	height:88px;
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
.lineup .lineupRightImg .lineupRightImgSub3{
	position:absolute;
	left:301px;
	top:155px;
	width:115px;
	height:88px;
	background:black;
}
.lineup .lineupRightImg .lineupRightImgSub3 img{
	width:115px;
	height:88px;
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
.lineup .lineupRightImg .lineupRightImgSub4{
	position:absolute;
	left:425px;
	top:155px;
	width:115px;
	height:88px;
	background:black;
}
.lineup .lineupRightImg .lineupRightImgSub4 img{
	width:115px;
	height:88px;
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

#lineup5 .lineupRightImg .lineupRightImgSub1{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub1 img{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub2{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub2 img{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub3{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub3 img{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub4{
	width:116px;
}
#lineup5 .lineupRightImg .lineupRightImgSub4 img{
	width:116px;
}

#lineup1 .lineupRightImg{
	top:169px;
}
#lineup1{
	background:url(lineup/img/lineup1Bg.jpg) left top repeat-x;
}
#lineup1 .lineupRightImg{
	background:url(lineup/img/lineup1RightImg.jpg) left top no-repeat;
}
#lineup2{
	background:url(lineup/img/lineup2Bg.jpg) left top repeat-x;
}
#lineup2 .lineupRightImg{
	background:url(lineup/img/lineup2RightImg.jpg) left top no-repeat;
}
#lineup3{
	background:url(lineup/img/lineup3Bg.jpg) left top repeat-x;
}
#lineup3 .lineupRightImg{
	background:url(lineup/img/lineup3RightImg.jpg) left top no-repeat;
}
#lineup4{
	background:url(lineup/img/lineup4Bg.jpg) left top repeat-x;
}
#lineup4 .lineupRightImg{
	background:url(lineup/img/lineup4RightImg.jpg) left top no-repeat;
}
#lineup5{
	background:#8d8b8c url(lineup/img/lineup5Bg.jpg) left top repeat-x;
	height:900px;
}
#lineup5 .lineupRightImg{
	background:url(lineup/img/lineup5RightImg.jpg) left top no-repeat;
}
.lineup .lineupLink1{
	position:absolute;
	left:470px;
	top:514px; 
}
.lineup .lineupLink2{
	position:absolute;
	left:716px;
	top:514px; 
}
.lineup .lineupLink3{
	position:absolute;
	left:163px;
	top:624px; 
}
#lineup1 .lineupLink1{
	top:527px; 
}
#lineup1 .lineupLink2{
	top:527px; 
}
#lineup1 .lineupLink3{
	top:640px; 
}
.lineup .toTop{
	position:absolute;
	left:447px;
	top:720px; 
}

#linupRightNav{
	width:42px;
	height:354px;
	position:fixed;
	top:330px;
	display:none;
	margin-left:1027px;
}
@media screen and (max-width: 1090px){
	#linupRightNav{
		margin-left:0;
		right:10px;
	}
}

#linupRightNav a{
	display:block;
	width:42px;
	height:42px;
	margin-bottom:16px;
}
#linupRightNav .toLineup img{
	display:none;
}
#linupRightNav .toLineup:hover img{
	display:block;
}
#linupRightNav .toLineup.current img{
	display:block;
}
#linupRightNav #up{
	height:25px;
}
#linupRightNav #btm{
	height:25px;
	margin-bottom:0;
}
#linupRightNav #toLineup1{
	background:url(lineup/img/linupRightNav1.png) left top no-repeat;
}
#linupRightNav #toLineup2{
	background:url(lineup/img/linupRightNav2.png) left top no-repeat;
}
#linupRightNav #toLineup3{
	background:url(lineup/img/linupRightNav3.png) left top no-repeat;
}
#linupRightNav #toLineup4{
	background:url(lineup/img/linupRightNav4.png) left top no-repeat;
}
#linupRightNav #toLineup5{
	background:url(lineup/img/linupRightNav5.png) left top no-repeat;
}

/* --------------- PATTERN PAGE --------------- */
#patternTop{
	height:784px;
	width:100%;
	background:white url(pattern/img/topBg.jpg) left top repeat-x;
	position:relative;
}
#patternTop h2{
	position:absolute;
	top:60px;
	left:310px;
}
#patternTop a{
	position:absolute;
	top:291px;
}
#patternTop #patternNav1{
	left:64px;
}
#patternTop #patternNav2{
	left:259px;
}
#patternTop #patternNav3{
	left:457px;
}
#patternTop #patternNav4{
	left:652px;
}
#patternTop #patternNav5{
	left:846px;
}
.pattern{
	position:relative;
	height:647px;
	width:100%;
}
.pattern .patternImg{
	position:absolute;
	top:0;
	left:52px;
}
.pattern .patternLink{
	position:absolute;
	top:458px;
	left:211px;
}
.pattern .toTop{
	position:absolute;
	top:562px;
	left:456px;
}

/* --------------- INTERVIEW PAGE --------------- */
#interview{
	background:white url(interview/img/interviewBg.jpg) left top repeat-x;
	position:relative;
	padding:60px 253px 30px 266px;
}
#interview img{
	display:block;
	margin-left:-147px;
}
#interview .interviewLink{
	display:block;
	width:295px;
	height:41px;
	margin:0 auto;
}
#interview .interviewLink img{
	margin:0;
}
#interview .toTop{
	display:block;
	width:206px;
	height:46px;
	margin:30px auto 0 auto;
	
}
#interview .toTop img{
	margin:0;
}


/* --------------- HOWTO PAGE --------------- */
#howToTop img{
	display:block;
	margin-left:-147px;
}
#howTo{
	padding-left:228px;
	background:#ffe1e3;
}
#howTo img{
	display:block;
	margin-left:-147px;
}
#howToToTop{
	padding:21px 0 30px 0;
}
#howToToTop a{
	display:block;
	width:180px;
	height:31px;
	margin:0 auto;
}


/* --------------- MODAL --------------- */
#modal{
	position:fixed;
	width:100%;
	height:100%;
	background:url(img/modalBg.png) left top repeat;
	left:0;
	top:0;
	z-index:3;
	display:none;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}
#modal #modalClose{
	position:fixed;
	width:100%;
	height:100%;
	left:0;
	top:0;
}
#modal #modalInside{
	position:absolute;
	width:900px;
	height:519px;
	top:50%;
	left:50%;
	margin-left:-450px;
	margin-top:-259.5px;
	background:white;
}
#modal .wrapper{
	position:relative;
	padding:8px 9px;
	height:503px;
	width:auto;
}
#modal #modalLeft{
	width:327px;
	float:left;
	height:100%;
	position:relative;
}
#modal #modalLeft .modalLeftBg{
	position:absolute;
	left:0;
	top:0;
}
#modal #modalLeft #modalLeftImg{
	position:absolute;
	left:18px;
	top:21px;
	width:291px;
	height:218px;
}
#modal #modalLeft #modalLeftImg img{
	position:absolute;
	left:0;
	top:0;
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}
#modal #modalLeft #modalLeftImg #modalLeftImg11{
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}
#modal #modalRight{
	width:555px;
	height:100%;
	float:left;
	position:relative;
	background:url(img/modalRight.jpg) left top no-repeat;
}
#modal #modalRight .modalRightLine{
	padding-right:85px;
	position:relative;
	height:100px;
}
#modal #modalRight .modalRightLine ul{
	list-style:none;
	height:78px;
	padding-right:11px;
	padding-left:3px;
	padding-top:11px;
	padding-bottom:10px;
	position:absolute;
	left:0;
}
#modal #modalRight #line2 ul{
	padding-bottom:12px;
}
#modal #modalRight #line1 ul, #modal #modalRight #line3 ul, #modal #modalRight #line4 ul{
	padding-bottom:11px;
}
#modal #modalRight #line2, #modal #modalRight #line3, #modal #modalRight #line4, #modal #modalRight #line5{
	height:101px;
}
#modal #modalRight #line3 ul, #modal #modalRight #line4 ul, #modal #modalRight #line5 ul{
	height:79px;
}
#modal #modalRight .modalRightLine ul li{
	width:105px;
	height:79px;
	float:right;
	margin-left:9px;
	background:black;
}
#modal #modalRight .modalRightLine ul li img{
	width:105px;
	height:79px;
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}
#modal #modalRight #line1 ul li #modalRightImg11{
	filter: alpha(opacity=100);
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
}

#modal #modalRight .modalRightLine .modalRightLineBg{
	background:black;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	filter: alpha(opacity=20);
	-moz-opacity: 0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;
}
#modal #modalRight #line1 .modalRightLineBg{
	filter: alpha(opacity=0);
	-moz-opacity: 0;
	-khtml-opacity: 0;
	opacity: 0;
}
#modal .closeModal{
	position:absolute;
	right:3px;
	top:3px;
	display:block;
	width:20px;
	height:20px;
}



/* --------------- FOOTER --------------- */
footer{
	background:white;
	padding-top:13px;
	height:100px;
	border-top:solid 3px #d2d2d3;
	position:relative;
	width:100%;
}
footer .wrapper{
	text-align:right;
	margin:0 auto;
	width:1400px;
	position:absolute;
	left:50%;
	width:980px;
	margin:0 auto;
	margin-left:-490px;
}
body.top footer{
	position:absolute;
	top:3960px;
}
body.lineup footer{
	position:absolute;
	top:4892px;
}
body.interview footer{
	position:absolute;
	top:2740px;
}
body.pattern footer{
	position:absolute;
	top:4129px;
}
body.howto footer{
	position:absolute;
	top:2109px;
}

















