@charset "utf-8";

#collectionIndexPage #content li{width:360px;height:601px; float:left;overflow:hidden;margin:0 8px 8px 0}
#collectionIndexPage #content a{display:block;overflow:hidden}
#collectionIndexPage #content li img{width:100%;height:auto}
.page-head h2{display:block;line-height:100%}
.page-head h3{line-height:100%}
.BWFilter{cursor:pointer}
.current .BWFilter{cursor:normal}
#collectionDetailPage .photo{width:50%;float:left}
#collectionDetailPage .photo p{width:auto;height:auto;margin-right:4px}
#collectionDetailPage .photo img{display:block;width:100%;height:auto}
#detail{display:block;width:50%;float:right}
.detail-in{display:block;margin:0 0 8px 4px}
.itemlist{background:#FFF}
.itemlist div{margin-bottom:-1px}
.itemlist dl{width:100%;font-size:80%;border-bottom:#d1d7e2 solid 1px;position:relative;padding:20px 0}
.itemlist dt,.itemlist dd{padding:0 20px}
.itemlist dt{color:#002d62;font-weight:700;margin-bottom:3px}
.itemlist .storelink{position:absolute;top:35px;right:20px;display: block;overflow: hidden;height: 26px;width: 131px;}
.channel p{display:block;width:100%;height:56px;position:relative;cursor:pointer}
.channel .left{float:left;position:relative;z-index:1}
.channel .right{float:right;position:relative;z-index:1}
.channel .top{display:block;width:100%;height:56px;position:absolute;top:0;left:0;z-index:0;text-align:center;line-height:56px;background:#ec3a54}
#thum{overflow:hidden}
#thum li{float:left;display:block;position:relative;margin:0 8px 8px 0}
#thum img{width:84px;height:auto}
.movie img{width:100%}
#modal .inner{position:fixed;top:50%;left:50%;display:block;width:600px;height:338px;margin:-169px 0 0 -300px}
#collectionIndexPage #content ul,#thum ul{margin:0 -8px 0 0}

@media only screen and (min-width: 960px) and (max-width: 1111px) {
#collectionIndexPage #content li{width:32.33%;height:auto; margin:0 1% 1% 0}
.itemlist .storelink{position:relative;top:0;left:0}
#thum li{width:15.6666%;margin:0 1% 1% 0}
#thum img{width:100%;height:auto}
#collectionIndexPage #content ul,#thum ul{margin:0 -1% 0 0}
}

@media only screen and (min-width: 768px) and (max-width: 960px) {
#collectionIndexPage #content li{width:32.33%;height:auto;margin:0 1% 1% 0}
.itemlist .storelink{position:relative;top:0;left:0}
#thum li{width:15.6666%;margin:0 1% 1% 0}
#thum img{width:100%;height:auto}
.page-head h2,.page-head h3{line-height:150%}
#collectionIndexPage #content ul,#thum ul{margin:0 -1% 0 0}
}

@media only screen and (max-width: 767px) {
.page-head h2{line-height:150%}
.page-head h3{font-size:16px;line-height:150%}
#collectionIndexPage #content ul{margin:0 -2% 0 0}
#collectionIndexPage #content li{width:31.33%;height:auto;margin:0 2% 2% 0}
.itemlist .storelink{position:relative;top:0;left:0}
.detail-in{display:block;margin:15px 0 0}
#collectionDetailPage .photo{width:auto;float:none;margin:0 -15px}
#collectionDetailPage .photo p{margin-right:0}
#detail{width:100%;float:none;position:relative;margin:15px 0 0;padding:56px 0 0}
.channel{display:block;width:100%;position:absolute;top:0;left:0;margin:0}
#thum ul{margin:0 -1% 0 0}
#thum li{width:15.6666%;margin:0 1% 1% 0}
#thum img{width:100%;height:auto}
#modal .inner{width:320px;height:180px;margin:-90px 0 0 -160px}
}

@media only screen and (max-width: 320px) {
#modal .inner{width:240px;height:136px;margin:-68px 0 0 -120px}
}