@charset "utf-8";
/* CSS Document */

html, body, #wrap 
{
height: 100%;
}
a:focus{
outline:none;
}


#main {
margin:0 auto -123px;
width:1000px;
padding-bottom:40px;
}

.indextop{
height:90px;
}

.indextop a img {
margin:12px 0 0 80px;
float:left;
border:0;
}

clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {
display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */



/*----------------------------------------------------------------首頁選單*/
.indexmenu{
width:470px;
float:right;
margin-right:75px;
margin-top:35px;
}

.indexmenu ul li{
float:left;
display:inline;

}


.Iabout a {
background:url(../images/index/menu01_off.gif) no-repeat;
height:46px;
width:110px;
border:0px;
text-indent:-9999px;
display:block;
}

.Iabout a:hover {
background:url(../images/index/menu01_on.gif) no-repeat;
}

.Igallery a {
background:url(../images/index/menu02_off.gif) no-repeat;
height:46px;
width:121px;
border:0px;
text-indent:-9999px;
display:block;
}

.Igallery a:hover {
background:url(../images/index/menu02_on.gif) no-repeat;
}

.Iart a {
background:url(../images/index/menu03_off.gif) no-repeat;
height:46px;
width:118px;
border:0px;
text-indent:-9999px;
display:block;
}

.Iart a:hover {
background:url(../images/index/menu03_on.gif) no-repeat;
}

.Icontact a {
background:url(../images/index/menu04_off.gif) no-repeat;
height:46px;
width:120px;
border:0px;
text-indent:-9999px;
display:block;
}

.Icontact a:hover {
background:url(../images/index/menu04_on.gif) no-repeat;
}
/*----------------------------------------------------------------首頁選單 結束*/

/*----------------------------------------------------------------內頁選單*/
.menu{
width:100px;
float:left;
margin-top:57px;
height:230px;
margin-left:80px;
margin-right:25px;
}

.menu ul li{
float:left;
}



.about  {
background:url(../images/menu/menu_on_01.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}


.about a {
background:url(../images/menu/menu_off_01.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}

.about a:hover {
background:url(../images/menu/menu_on_01.jpg) no-repeat;
}


.gallery  {
background:url(../images/menu/menu_on_02.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}


.gallery a {
background:url(../images/menu/menu_off_02.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}

.gallery a:hover {
background:url(../images/menu/menu_on_02.jpg) no-repeat;
}



.art {
background:url(../images/menu/menu_on_03.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}


.art a {
background:url(../images/menu/menu_off_03.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:57px;
width:100px;
}

.art a:hover {
background:url(../images/menu/menu_on_03.jpg) no-repeat;
}

.contact  {
background:url(../images/menu/menu_on_04.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:58px;
width:100px;
}


.contact a {
background:url(../images/menu/menu_off_04.jpg) no-repeat;
border:0px;
text-indent:-9999px;
display:block;
height:58px;
width:100px;
}

.contact a:hover {
background:url(../images/menu/menu_on_04.jpg) no-repeat;
}


.path {
color:#3f76ca;
font-size:11px;
text-decoration:none;
margin-top:15px;
margin-left:-3px;

}

.path a{
text-decoration:none;
color:#3f76ca;
padding: 0 3px 0 3px;
}

.path a:hover{
text-decoration:underline;
color: #FF3366;
}
/*----------------------------------------------------------------內頁選單 結束*/



.centerPic {
width:850px;
height:300px;
margin-left:75px;
}


.indexBottom{
width:850px;
height:110px;
float:left;
margin:20px 0 0 75px;
}

.bottom01{
width:225px;
height:110px;
float:left;
}


.newsTitle{
background:url(../images/index/icon_01.gif) no-repeat;
width:18px;
height:18px;
margin-bottom:5px;
}

.newsTitle img{
margin-left:23px;
}

.newsLine img{
margin-left:23px;
}

.news{
height:25px;
float:left;
width:200px;
margin-bottom:20px;
}


.newsIten img {
float:left;
padding-top:13px;
width:18px;
height:18px;
}
.newsInfo{
width:180px;
float:left;
}

.newsDate{
color:#999999;
font-size:9px;
margin:10px 0 0 6px;
}

.newsTxt a{
font-size:11px;
color:#888888;
text-decoration:none;
float:left;
margin-left:6px;
}

.newsTxt a:hover{
color:#7a478a;
text-decoration:underline;
}


.bottom02{
width:390px;
height:110px;
background:url(../images/index/galleryBg.jpg) no-repeat;
float:left;
margin-right:15px;
}


.galleryPic a{
margin-left:10px;
float:left;
border:none;
}

.galleryInfo{
width:200px;
float:left;
margin-left:10px;
}

.galleryTitle b a{
color:#4155a3;
font-size:13px;
padding-bottom:6px;
float:left;
width:200px;
text-decoration:none;
}

.galleryTitle b a:hover{
color:#003399;
text-decoration:underline;
}

.galleryDate{
color:#999999;
font-size:11px;
margin-bottom:2px;
}

.galleryLine img{
float:left;
width:200px;
margin:5px 0 5px;
}

.galleryTxt a{
font-size:11px;
text-decoration:none;
color:#666666;
float:left;
}

.galleryTxt a:hover{
color:#003399;
text-decoration:underline;
}



.bottom03{
width:215px;
height:110px;
float:left;

}

.contactTitle {
background:url(../images/index/icon_02.gif) no-repeat;
height:18px;
float:left;
margin-bottom:5px;
width:215px;
}

.contactTitle img{
margin-left:23px;
float:left;
width:109px;
}

.contactMail {
float:right;
}
.contactMail  a img{
width:16px;
height:11px;
margin-top:5px;
border:none;

}

.contactLine{
margin-left:23px;
float:left;
margin-top:3px;
}


.contactTxt img{
margin-top:17px;
}


#footer{
position: relative;
margin-top: -40px; /* footer高度的負值 */
height:40px;
clear:both;
margin-bottom:0px;

}

.bottomMenu{
width:470px;
margin-left:500px;
color:#8c6b97;
float:left;
}



.bottomMenu ul li {
float:left;
color:#8c6b97;
font-size:11px;
}

.bottomMenu ul li a{
text-decoration:none;
color:#8c6b97;
padding-left:10px;
padding-right:10px;
border-right:1px solid #8c6b97;
}

.bottomMenu ul li a:hover{
text-decoration:underline;
color:#990066;
}

.bottomMenu ul li.last a{
float:left;
color:#8c6b97;
font-size:11px;
border:none;
}


.bottomMenu ul li.last a:hover{
text-decoration:underline;
color:#990066;
}

.copyright{
color:#aaaaaa;
font-size:11px;
float:left;
padding-left:350px;
margin-top:5px;
width:600px;
text-indent:1em;
display:block;
text-align:center;
}





/*---------------------------------------------about*/
.aboutTopPic img{
margin-left:63px;
margin-top:10px;
border:1px #CCCCCC solid;
}

.inner{
width:680px;
float:left;
padding-left:20px;
}

.aboutTitle{
margin-top:15px;
margin-bottom:30px;

}


.downLine img{
margin-top:70px;
float:left;
margin-bottom:70px;
}

.downLineB img{
margin-top:10px;
float:left;
margin-bottom:70px;
}

.aboutTxt{
color:#888888;
font-size:13px;
float:left;
line-height:140%;
letter-spacing:0.3em;
width:450px;
}

.aboutPic{
float:right;
}

/*---------------------------------------------gallery*/

.nowinfo{
height:235px;
width:660px;
margin-left:15px;
}

.nowPic{
float:left;
margin-right:15px;
border:#CCCCCC 1px solid;
}

.nowTitle b{
background:url(../images/gallery/galleryIcon.jpg) no-repeat;
color:#cd9a51;
padding-left:30px;
}

.nowDate{
font-size:11px;
background:url(../images/gallery/galleryItem.jpg) no-repeat;
padding-left:30px;
margin-top:10px;
margin-left:3px;
color:#999999;
float:left;
letter-spacing:0.1em;
width:300px; 
}

.nowDate a{
font-size:11px;
text-decoration:none;
margin-left:3px;
color:#999999;
float:left;
letter-spacing:0.1em;
}
.nowDate a:hover{
color:#CC0000;
text-decoration:underline;
}


.nowTxt a{
color:#666666;
font-size:12px;
letter-spacing:0.1em;
line-height:130%;
width:320px;
float:left;
margin-top:25px;
border-right:solid 3px #d4a869;
padding-right:10px;
padding-left:5px;
text-decoration:none;
}
.nowTxt a:hover{
text-decoration:underline;
color:#993399;
}

.pastInfo{
width:250;
margin-left:40px;
float:left;
}


.artInfo{
width:145;
margin-left:25px;
float:left;
}

.pastTxt{
border-left:3px solid  #d4a869;
padding-bottom:5px;
padding-left:3px;
}
.pastDate{
color:#aaaaaa;
font-size:10px;
letter-spacing:0.1em;
padding-left:5px;
}

.pastName a{
color:#cd9a51;
font-size:12px;
letter-spacing:0.1em;
padding:5px;
text-decoration:none;
}
.pastName a:hover{
text-decoration:underline;
color:#FF6600;
}

.pastBanner a img{
margin-bottom:35px;
margin-right:50px;
}


.artPic a img{
margin-bottom:35px;
margin-right:31px;
}

/*---------------------------------------------------------------introduce*/
.nowMoreTxt{
color:#666666;
font-size:12px;
letter-spacing:0.1em;
line-height:130%;
float:left;
margin-top:25px;
padding-right:10px;
padding-left:5px;
margin-bottom:60px;

}


.portfolio{
width:120px;
float:left;
margin-bottom:30px;
margin-right:65px;
}

.portName{
float:left;
background:url(../images/gallery/portfolioIcon.gif) no-repeat;
width:120px;
padding-left:13px;
padding-top:3px \9;
margin:5px 0 5px 5px;
color:#444a98;
font-size:13px;
float:left;
}
.portInfo{
color:#888888;
font-size:11px;
padding-left:18px;
margin-top:5px;
}


.portfolioLast{
width:120px;
float:left;
margin-bottom:30px;

}


/*-------------------------------------------------------藝術家*/
.artTxt{
color:#888888;
font-size:12px;
float:left;
line-height:140%;
letter-spacing:0.3em;
width:454px;
margin-left:30px;
padding-top:15px;
margin-bottom:40px;
}


.artSubTitle b{
background:url(../images/gallery/galleryIcon.jpg) no-repeat;
color:#cd9a51;
padding-left:30px;
float:left;
width:500px;


}

.artPerson img{
float:right;
border:#CCCCCC 1px solid;
margin-top:15px;

}


.arthistroy{
color:#888888;
font-size:12px;
float:left;
line-height:250%;
width:600px;
margin-left:30px;
padding-top:15px;
margin-bottom:40px;
padding-left:3px;

}


.artPart{
width:120px;
float:left;
margin-bottom:30px;
margin-right:55px;
}





.backbtn a{
background:url(../images/arts/artBack_off.jpg) no-repeat;
height:12px;

text-indent:-9999px;
float:left;
width:680px;
margin-top:50px;
margin-left:560px;
}

.backbtn a:hover{
background:url(../images/arts/artBack_on.jpg) no-repeat;
}


.backbtnG a{
background:url(../images/gallery/galleryBack_off.jpg) no-repeat;
height:12px;

text-indent:-9999px;
float:left;
width:680px;
margin-top:50px;
margin-left:560px;
}

.backbtnG a:hover{
background:url(../images/gallery/galleryBack_on.jpg) no-repeat;
}





/*-------------------------------------------------contact01*/

.contact01{
background:url(../images/contact/contact01.jpg)  no-repeat;
width:323px;
height:272px;
float:left;
margin-left:20px;
}


.contact02{
background:url(../images/contact/contact02.jpg)  no-repeat;
width:321px;
height:272px;
float:left;
}


.mailBtn{
padding-top:227px;
}



.mailBtn a{
background:url(../images/contact/mail_on.jpg) no-repeat;
margin-left:25px;
text-indent:-9999px;
width:146px;
height:12px;
float:left;
}


.mailBtn a:hover{
background:url(../images/contact/mail_off.jpg) no-repeat;
}

.map{
padding-top:100px;
}


.map a{
background:url(../images/contact/mapBtn_off.jpg) no-repeat;
margin-left:25px;
text-indent:-9999px;
width:70px;
height:12px;
float:right;
}


.map a:hover{
background:url(../images/contact/mapBtn_on.jpg) no-repeat;
}











