@charset "UTF-8";



#warpper800
{
margin:30px auto;
padding:0;
width:800px;
height:500px;
overflow:hidden;
}

#index_left_box
{
width:380px;
overflow:hidden;
margin:80px 0 0 0;
padding:0;
float:left;
}

#index_right_box
{
width:380px;
overflow:hidden;
margin:80px 0 0 0;
padding:0;
float:right;
}

#index_left_box a
{
display:block;
margin:0;
padding:20px;
text-align:center;
background-color:#9b7fb1;
color:#ffffff;
text-decoration:none;
font-size:30px;
}

#index_right_box a
{
display:block;
margin:0;
padding:20px;
text-align:center;
background-color:#9b7fb1;
color:#ffffff;
text-decoration:none;
font-size:30px;
}

#index_left_box a:hover
{
background-color:#e8ccfe;
color:#000000;
}

#index_right_box a:hover
{
background-color:#e8ccfe;
color:#000000;
}









@media screen and (max-width:767px)
{

#warpper800
{
margin:0 auto;
padding:0;
width:90%;
height:auto;
overflow:hidden;
text-align:center;
}

#warpper800 img
{
width:80%;
height:auto;
margin:0;
padding:0;
}


#index_left_box
{
width:100%;
overflow:hidden;
margin:30px 0;
padding:0;
float:none;
}

#index_right_box
{
width:100%;
overflow:hidden;
margin:30px 0;
padding:0;
float:none;
}








}