eve_2108.css_0713.css

.main{
	width		:100vw;
	min-height	:100vh;
	font-size	:0;
}
.back{
	width		:100vw;
	position	:fixed;
	z-index		:-2;
	top			:0;
	height		:100vh;
	overflow	:hidden;
	background	:#e0f0ff;
}

.img_back2,.img_back1{
	width		:100vw;
	height		:100vh;
	position	:absolute;
	left		:0;
	right		:0;
	margin		:auto;
	display:none;
}

.img_back3{
	width		:100vw;
	position	:fixed;
	left		:0;
	right		:0;
	bottom		:-3vh;
	margin		:auto;
	display:none;
}

.img_back1{
	top:calc(40vh * (-1));
}

.box_1{
	position	:relative;
	background	:#ffffff;
	z-index		:1;
	padding-bottom:2vw;
}

.box_2{
	position	:relative;
	width		:100vw;
	background	:#ffffff;
	height		:12vw;
	z-index		:1;
}

.box_3{
	position	:relative;
	width		:100vw;
	text-align	:left;
	display		:flex;
	flex-wrap	:wrap;
	background	:#ffffff;
	min-height	:100vh;
	z-index		:1;
	padding		:2vw;
	font-size:0;
}

.top_1{
	width		:85vw;
	height		:18vw;
	margin		:10vw auto 0 auto;
	border		:2px solid #ffffff;
	font-size	:4.7vw;
	padding		:2vw;
	color		:#ffffff;
	font-weight:700;
}
.top_1a{
	width		:80vw;
	height		:6vw;
	line-height	:6vw;
	margin		:0 auto 5vw auto;
	font-size	:3.8vw;
	color		:#ffffff;
	font-weight	:700;
	text-align:right;
}

.top_2{
	width		:82vw;
	line-height	:4.5vw;
	margin		:3vh auto;
	border		:2px solid #ffffff;
	background	:rgba(255,255,255,0.6);
	font-size	:3.2vw;
	padding		:2vw;
	color		:#202830;
}

.skew_btm{
	width		:100vw;
	height		:10vw;
	transform	:skewY(4deg);
	background	:#ffffff;
	position	:relative;
	transform-origin:right top;
}

.blank{
	position	:relative;
	width		:98vw;
	text-align	:center;
	display		:flex;
	flex-wrap	:wrap;
	padding:1vw 1vw 5vw 1vw;
//	justify-content:space-around;
}

.notice_a{
	width		:84vw;
	height		:2px;
	margin		:1vw auto 0 auto;
	background	:#ff00ff;
	background:linear-gradient(90deg,#fafafa 0%,#9090ff 50%,#fafafa 100%);
}

.notice_b{
	width		:84vw;
	margin		:0 auto 1vw auto;
	background	:#0000ff;
	height		:2px;
	background:linear-gradient(90deg,#fafafa 0%,#9090ff 50%,#fafafa 100%);
}


.notice{
	width		:80vw;
	line-height	:4.5vw;
	font-size	:3.5vw;
	color		:#303030;
	padding		:0vw;
	margin		:1vw auto;
}

.p{
	display:block;
	padding:0.5vw 1vw;
}


.box_title{
	position		:relative;
	width			:90vw;
	text-align		:left;
	height			:10vw;
	padding			:1vw 0 0 0;
	border-bottom	:0.5vw solid #ffffff;
	font-size		:6vw;
	color			:#ffffff;
	margin			:2vw auto 0 auto;	
	font-weight		:600;
}

.box_title2{
	position		:absolute;
	left			:0;
	right			:0;
	bottom			:0;
	margin			:auto;
	width			:90vw;
	text-align		:left;
	height			:7.5vw;
	border-bottom	:0.5vw solid #4060ff;
	font-size		:5vw;
	color			:#4060ff;
	font-weight		:600;
}


.blank_2{
	position	:relative;
	width		:100vw;
	height		:30vw;
}

.pick{
	position	:relative;
	display		:inline-block;
	width		:44vw;
	flex-basis	:44vw;
	height		:58vw;
	background	:#ffffff;
	margin		:2vw;
	box-shadow:2vw 2vw 0 rgba(60,90,200,0.8); 
	text-decoration:none;
}

.pick_in{
	position	:absolute;
	top			:45vw;
	left		:2vw;
	width		:41vw;
	height		:11vw;
	background	:linear-gradient(135deg,#F7C8CE,#d7a8aE);
	z-index:2;
}


.img_pick{
	position	:absolute;
	top			:2vw;
	left		:2vw;
	width		:41vw;
	height		:41vw;
}

.face{
	position	:relative;
	display		:inline-block;
	width		:22vw;
	flex-basis	:22vw;
	height		:27vw;
	background	:#9080d0;
	margin		:1vw;
	text-decoration:none;
}

.img_face{
	position	:absolute;
	top			:0.5vw;
	left		:0.5vw;
	width		:21vw;
	height		:21vw;
}


.bn_btm{
	position	:absolute;
	bottom		:5vw;
	left		:0;
	right		:0;
	margin		:auto;
	width		:80vw;
	border:1px solid #ffffff;
	box-shadow:2px 2px 2px rgba(30,30,30,0.5);
}

.p_box{
	display		:block;
	width		:60vw;
	height		:60vw;
	position	:relative;
	box-shadow	:1vw 1vw 1vw rgba(10,10,10,0.8);
	background	:#d0e0ff;
}

.p_box_out{
	position		:relative;
	display			:block;
	width			:100vw;
	height			:55vw;
}

.p_comm{
	position		:absolute;	
	top				:1vw;
	left			:2vw;
	width			:50vw;
	height			:35vw;
	font-size		:3.2vw;
	line-height		:5vw;
	padding			:0;
	text-align		:left;
	color			:#303030;
}

.p_img{
	position		:absolute;	
	top				:10vw;
	right			:5vw;
	width			:55vw;
	height			:55vw;
}

.p_img_out{
	position		:absolute;	
	top				:10vw;
	right			:5vw;
	width			:55vw;
	height			:55vw;
	box-shadow:2vw 2vw 2vw 2vw rgba(255,255,255,1) inset,-2vw -2vw 2vw 2vw rgba(255,255,255,1) inset; 
}


.up_link_out{
	position		:fixed;
	bottom			:5vw;
	right			:2vw;
	width			:14vw;
	height			:14vw;
	display			:none;
	z-index			:5;
}

.out_e{
	animation	:anime 2s ease infinite;
}

.up_link{
	position	:absolute;
	bottom		:0;
	right		:0;
	width		:14vw;
	height		:14vw;
}

.flex_m_w{
	display		:inline-block;
	position	:absolute;
	top			:-3vw;
	left		:1vw;
	width		:16vw;
	height		:6vw;
	line-height	:6vw;
	margin		:auto;
	color		:#fafafa;
	font-size	:4vw;
	text-align	:center;
	overflow	:hidden;
	border-radius:1vw;
	border:1px solid #000000;
}

.pts_pick{
	position		:absolute;
	height			:5vw;
	line-height		:5vw;
	top				:0vw;
	right			:1vw;
	font-size		:3.5vw;
	color			:#900060;
	font-weight		:600;
	border-bottom	:2px solid #900060;
	padding			:0.5vw;
}

.name_pick{
	position	:absolute;
	height		:5vw;
	line-height	:5vw;
	bottom		:0vw;
	right		:1vw;
	font-size	:4.5vw;
	color		:#fafafa;
	font-weight	:600;
}


.flex_s_w{
	position		:absolute;
	top				:16.5vw;
	left			:1vw;
	display			:inline-block;
	width			:11vw;
	height			:4.5vw;
	color			:#fafafa;
	font-size		:3vw;
	line-height		:5vw;
	text-align		:center;
	box-shadow		:1px 1px 0 rgba(0,0,0,1); 
	font-weight		:600;
	border-radius	:0.5vw;
}

.name_face{
	position	:absolute;
	top			:22vw;
	left		:1vw;
	display		:inline-block;
	width		:20vw;
	height		:6vw;
	line-height	:6vw;
	font-size	:3vw;
	overflow	:hidden;
	color		:#fafafa;
	font-weight	:600;
	text-align	:center;
}

.flex_s1{background:linear-gradient(#00c000,#008000);}
.flex_s2{background:linear-gradient(#c0c0c0,#aaaaaa);}
.flex_s3{background:linear-gradient(#c0a000,#a09000);}
.flex_s4{background:linear-gradient(#c0c0c0,#a0a0a0);}
.flex_s5{background:linear-gradient(#ffb6c1,#ff90a0);}

@keyframes anime {
0% { transform:translateY(0) }
50% { transform:translateY(-10px) }
100% { transform:translateY(0) }
}

.up_link_ar,.up_link_ar2{
	position	:absolute;
	top			:5.2vw;
	left		:0;
	right		:0;
	width		:2.8vw;
	height		:2.8vw;
	margin		:auto;
	font-weight	:700;
	border-top	:1vw solid #404550;
	border-left	:1vw solid #404550;
	transform:rotate(45deg);
}

.up_link_ar2{
	top			:7vw;
	width		:2.8vw;
	height		:2.8vw;
}

.up_link_in{
	position	:absolute;
	display		:inline-block;
	width		:7vw;
	height		:7vw;
}

.in1{
	top:0;
	left:0;
	background:linear-gradient(135deg,#ff3030,#900000);
	border-radius:7vw 0 0 0;
	border-top	:1px solid #000000;
	border-left	:1px solid #000000;
}

.in2{
	top:0;
	right:0;
	background		:linear-gradient(225deg,#fafafa,#bbbbbb);
	border-radius	:0 7vw 0 0;
	border-top		:1px solid #000000;
	border-right	:1px solid #000000;
}

.in3{
	bottom:0;
	left:0;
	background		:linear-gradient(45deg,#fafafa,#bbbbbb);
	border-radius	:0 0 0 7vw;
	border-bottom	:1px solid #000000;
	border-left		:1px solid #000000;
}

.in4{
	bottom:0;
	right:0;
	background		:linear-gradient(315deg,#ff3030,#900000);
	border-radius	:0 0 7vw 0;
	border-bottom	:1px solid #000000;
	border-right	:1px solid #000000;
}

.in5{
	top				:0;
	left			:0;
	bottom			:0;
	right			:0;
	width			:6vw;
	height			:6vw;
	margin			:auto;
	background		:#ffffff;
	border-radius	:50%;
	border			:1px solid #909090;
	box-shadow		:0 0 0.5vw 0.5vw rgba(0,0,0,0.4);
}

.skew_btm_title{
	background		:#00f00f;
	display			:block;
	height			:20vw;
	width			:80vw;
	margin			:0 auto;
}
.wave{
	width:100vw;
	z-index:10;
}

#mainmenu{
	background:#ffffff;

}