/* YOSHINORI HONDA */
@charset "utf-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
:focus{outline:0;}
a:active{outline:none;}
body{line-height:1;}
ol,ul,li{list-style:none;}
table{border-collapse:separate;border-spacing:0;}
caption,th,td{text-align:left;font-weight:normal;}
blockquote:before,blockquote:after,q:before,q:after{content:"";}
blockquote,q{quotes:"" "";}

body{width:100%;background:#FFF;font:12px/1.7 Dotum,'helvetica neue',helvetica,arial,clean,sans-serif;font-style:normal;color:#000;cursor:crosshair;text-shadow:1px 1px 0 rgba(255,255,255,.8);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;-o-text-size-adjust:100%;text-size-adjust:100%;}
h1{font-size:280%;font-weight:700;}
h1 a{color:#000;}
h2{font-size:104%;font-weight:700;}
h3{font-size:130%;font-weight:700;}
p{margin:0;font-size:100%;font-weight:400;}
a{color:#111;text-decoration:none;}
a:hover{opacity:0.6;filter:alpha(opacity=60);-webkit-transition:0.3s;transition:0.3s;}
a:active {-webkit-transition:0.3s;transition:0.3s;}

#container{width:980px;margin:0 auto;overflow:hidden;}

.top img{top:0;bottom:0;left: 0;right: 0;position:absolute;margin:auto;}

header{margin-left:10px;width:960px;}
header h1{font-size:260%;margin:8px 0 5px;letter-spacing:.24em;}　

.menu{margin-top:8px;}
.menu li{margin-right:13px;float:left;font-size:100%;font-weight:400;}
.menu .active{font-style: italic; font-weight:800;}
.contents{margin-top:15px;margin-left:10px; width:960px;overflow:hidden;clear:both;}
.contents a{color:#111;font-style: italic;}

.left-side {margin-top:13px;margin-right:20px;width:140px;float:left;}
.left-menu{margin-top:22%;}
.left-side li{padding-left:2px;margin-bottom:1em;font-weight:700;}
.left-side .active a {color:#878787;}
ul .sereis{margin:10px 0 16px;}
ul .sereis li {margin:10px 0;padding:0;font-style: normal; text-transform:uppercase;}

.main{margin:10px auto 0;padding:0 0 20px;width:640px;float:left;}
.main a{color:#111;font-style: italic; font-weight: 600;}
.main img{max-width:640px; height:auto; max-height:580px;}

.strong{font-weight: 600;}

.single {margin-top:17px;text-align:center;}

.a {margin:0 5px 5px;width:150px;float:left;display:inline-block;text-align: center; }
.thumb {height:150px;display:inline-block; text-align: center; white-space: nowrap;}
.thumb img {padding:5px;max-height:140px;width:auto;max-width:140px;display:inline-block; vertical-align: middle;}
.mid {display: inline-block;height: 100%;vertical-align: middle;}

.atext {margin:.2em auto;height:170px;display:block;}
.atext li{margin-left:16%;}

.image{margin:0 auto; text-align:center;}
.image img{max-width:100%;max-height:440px;}

.addthis_inline_share_toolbox_2v25{padding:10px 0px;}

.text {margin-top:1%;text-align:justify;line-height: 3.4em;}

.right-side {margin-left:20px;width:140px;float:right;}
.desc{margin-top:30%;}
.back{display:block;overflow:hidden;}
.back a{margin-top:10px;color: #878787;display:inline-block;}
.contact{margin-top:5px;}

footer {position:fixed;bottom:10px;}
footer p{margin-left:10px; font-size:80%;opacity:0.7;filter:alpha(opacity=70);}

.pagination {
    margin-bottom:30px;
    display: inline-block;
}

.pagination a {
    float: left;
    padding: 8px 16px;
    text-decoration: none;
    transition: background-color .3s;
}

.pagination a.active {
    background-color: #4CAF50;
    color: white;
}

@media only screen and (max-width:979px){
#container{width:100%;}
.contents{width:96%;margin:0 2%;}
.artwork{display:none;}
header{margin:2% 4%;width:92%;}
header h1{font-size:200%;}
.menu li{margin:10px 30px 10px 3px;font-size:110%;}

.main {margin:0 2%;padding:0;width:96%;}
.main img{max-width:100%;max-height:400px;}

.a {margin-right:2%;width:21%}
.thumb img{max-height:100px;width:auto;}
.desc {margin-left:20px;}
.text {line-height: 2.8em;}
.left-side {margin:0;width:100%;display:block;overflow:hidden;}
.left-side ul{margin-left:10px; padding: 0}
.left-side li{margin:0px;font-size: 24px;}
ul .sereis li {margin-left:-10px;}

.right-side {margin-left:5%;width:95%;}
.desc{margin-left:10%;display:inline; font-size:90%;}
.back a{margin:2% 30px 0 0;}

.top img{max-width:80%;}
.text p{font-size:120%;}
.about, .main{margin:0 5%;width:90%;}
footer{position:relative;}
.artwork-footer p{padding:20px;font-size:80%;opacity:0.7;filter:alpha(opacity=70);}
}

@media only screen and (max-width:480px){
header h1{margin-left:5%;font-size:195%;letter-spacing:.24em;}
.menu li{margin:14px 0 0 30px;font-size:120%;}
.right-side {margin-top:0;}
.main {margin-top:10px;}
.a {margin:0;height:auto;width:50%;}
.text {margin-top:4%;}
.contact{margin:20px;}

footer{padding:10px; position:static;width:100%;display:block;overflow:hidden;clear:both;}
.artwork-footer p{padding:20px 5px;}

}