@charset "utf-8";

/* layout.css
------------------------------------------ */
html{width:100%;}
#TOP{width:980px;margin:0 auto;padding: 10px;}

@media screen and (max-width:768px){
#TOP{width:95%;margin:0 auto;}
}
@media screen and (max-width:480px){
#TOP{width:94%;margin:0 auto;padding: 3%;}
}



/* HEADER
------------------------------------------ */
#HEADER{padding-top:30px;}
#HEADER a:link{text-decoration:none;}
#HEADER{font-family:Helvetica, Arial, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', Meiryo, メイリオ, sans-serif;}




/* headerArea
------------------------------------------ */
.headerArea{position:relative;}
.headerArea img{width:100%;font-size:0;line-height:0;}
.headerArea h1{float:right;width:150px;text-align:right;font-size:0;line-height:0;}
.headerArea h1 img{width:115px;}

.headerArea .headerSec{float:left;width:70%;}
.headerArea .headerSec ul.link{float:left;width:230px;}
.headerArea .headerSec ul.link li{float:left;margin-right:24px;font-size:0;line-height:0;}
.headerArea .headerSec ul.link li.twitter img{width:32px;}
.headerArea .headerSec ul.link li.facebook img{width:12px;}
.headerArea .headerSec ul.link li.instgram img{width:24px;}
.headerArea .headerSec ul.link li.tumbler img{width:14px;}
.headerArea .headerSec ul.link li.mail img{width:28px;}

.headerArea .headerSec p.language{float:left;width:220px;padding-top:3px;}
.headerArea .headerSec p.language a{display:inline;margin:0 8px;}
.headerArea .headerSec p.language a:link{font-weight:bold;font-size:124%;}
.headerArea .headerSec p.language a.japanese{opacity:1;}
.headerArea .headerSec p.language a.english{opacity:0.3;}
.headerArea .headerSec p.language a.english:hover{opacity:1;}

@media screen and (max-width:480px){
.headerArea h1{width:95px;}
.headerArea h1 img{width:95px;}
.headerArea .headerSec p.language{padding-top:7px;}
.headerArea .headerSec{padding-top:30px;}
}




/* naviArea
------------------------------------------ */
.naviArea{margin-top:30px;}
.naviArea ul{text-align:center;}
.naviArea ul li{float:left;margin-right:12px;font-size:180%;border:3px solid #000000;}
.naviArea ul li:last-child{margin-right:0px;}
.naviArea ul li a{font-weight:bold;padding:5px 29px;text-align:center;display:block;}
.naviArea ul li.news a{width:70px;}
.naviArea ul li.about a{width:83px;}
.naviArea ul li.exhibition a{width:136px;}
.naviArea ul li.publication a{width:159px;}
.naviArea ul li.onlineshop a{width:164px;}
.naviArea ul li:hover{background:#000000;color:#ffffff!important;opacity:0.5;}
.naviArea ul li:hover a{color:#ffffff;}
.naviArea p.navi{display:none;}

@media screen and (max-width:768px){
.naviArea ul li{margin-right:1%;margin-top:1%;}
.naviArea ul li a{display:inline;padding:5px 5px;}
.naviArea ul li.news a{width:10%;}
.naviArea ul li.about a{width:10%;}
.naviArea ul li.exhibition a{width:20%;}
.naviArea ul li.publication a{width:20%;}
.naviArea ul li.onlineshop a{width:20%;}
}
@media screen and (max-width:650px){
.naviArea ul{display:none;position:absolute;right:80px;width:72%;top:96px;}
.naviArea ul li{margin-top:1%;background:#ffffff;text-align:right;}
.naviArea ul li a{display:table-cell;width:97%;}
.naviArea ul li{float:none;}
.naviArea p.navi{display:block;position:absolute;right:0px;margin-right:3%;top:100px;}
.naviArea p.navi img{width:50px;}
}




/* BODY
------------------------------------------ */
#BODY{margin:60px auto 0;}




/* MAIN
------------------------------------------ */
#MAIN{width:800px;float:right;border-left:2px solid #000000;padding-left:30px;min-height:300px;}

@media screen and (max-width:768px){
#MAIN{float:none;width:95%;border:none;padding-left:0px;}
}
@media screen and (max-width:480px){
#MAIN{float:none;width:95%;border:none;padding-left:0px;padding-left:0px;}
}



/* detailArea
------------------------------------------ */
.detailArea{border-top:2px solid #000000;padding-top:30px;margin-top:30px;}
.detailArea p.visual{float:left;width:270px;}
.detailArea p.visual img{width:240px;}
.detailArea dl.detail{float:left;width:530px;}
.detailArea dl.detail.txt{float:none;width:auto!important;}
.detailArea dl.detail dt{border:1px solid #000000;padding:5px 8px;display:inline-block;font-size:110%;}
.detailArea dl.detail dd{}

.detailArea dl.detail dd h3{margin-top:16px;font-size:130%;}
.detailArea dl.detail dd h4{margin-top:16px;font-size:120%;}
.detailArea dl.detail dd h5{margin-top:16px;font-size:110%;}
.detailArea dl.detail dd h6{margin-top:16px;font-size:100%;}
.detailArea dl.detail dd p{margin-top:16px;}
.detailArea dl.detail dd p.first{margin-top:0px;}
.detailArea dl.detail dd ul{margin-top:16px;}
.detailArea dl.detail dd ul li{margin-top:4px;}

@media screen and (max-width:768px){
.detailArea p.visual{float:none;width:auto;}
.detailArea dl.detail{float:none;width:auto;margin-top:10px;}
.detailArea:first-child dl.detail{width:auto!important;}
}
@media screen and (max-width:480px){
.detailArea p.visual{float:none;width:auto;text-align:center;width:100%;}
.detailArea dl.detail{float:none;width:auto;margin-top:10px;width:90%;}
.detailArea:first-child p.visual{width:100%;}
.detailArea:first-child p.visual img{width:90%!important;}
}




/* SIDE
------------------------------------------ */
#SIDE{width:148px;float:left;}
#SIDE ul li{margin-top:10px;}
#SIDE ul li:first-child{margin-top:0px;}
#SIDE ul li a{font-size:140%;font-weight:normal;}
#SIDE{font-family:Helvetica, Arial, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;}
#SIDE ul.fixed{position:fixed;top:30px;width:100%;z-index:10000;margin-top:0;}

@media screen and (max-width:768px){
#SIDE{float:none;width:17%;}
#SIDE{float:none;width:100%;border-top:2px solid #000000;padding-top:20px;margin-top:20px;}
#SIDE ul.fixed{position:relative;}
}
@media screen and (max-width:480px){
#SIDE{float:none;width:100%;border-top:2px solid #000000;padding-top:20px;margin-top:20px;}
#SIDE ul.fixed{position:relative;}
}




/* FOOTER
------------------------------------------ */
#FOOTER{margin-top:160px;}
#FOOTER p.copy{text-align:center;padding:0px 0 40px;}

@media screen and (max-width:768px){
#FOOTER{width:98%;}
}






@media screen and (max-width:480px){
.publicationArea{width:170px!important;}
.publicationArea.box2{width:350px!important;}
}
@media screen and (max-width:480px){
.aboutArea{width:300px!important;margin:50px auto!important;}
}
@media screen and (max-width:320px){
.aboutArea{width:280px!important;margin:50px auto!important;}
}
@media screen and (max-width:480px){
.onlineshopArea{width:400px!important;margin:80px auto!important;}
.onlineshopArea p{width:50%;text-align:center;}
.onlineshopArea p img{width:70%;}
}
@media screen and (max-width:320px){
.onlineshopArea{width:280px!important;margin:80px auto!important;}
.onlineshopArea p{float:none!important;margin-top:20px;width:auto;}
.onlineshopArea p img{width:auto;}
}
@media screen and (max-width:480px){
.publicationArea{float:none!important;width:auto!important;}
.publicationArea.box2{width:auto!important;}
}