@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Niconne);
/* 
html5doctor.com Reset Stylesheet v1.6.1
Last Updated: 2010-09-17
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
textarea,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
color: #030303;
}
article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section { 
    display:block;
}

html{font-size:62.5%;}
body{font-size: 13px;font-size: 1.3em;line-height:1.7;background: #efefef;
background-image:url(img/back.jpg);}
a{color: #030303;}
a:hover{color: #c7cf30;text-decoration: none;}
img{border: none; margin:2px 0 2px 0;}

/* サイト */
header, footer{text-align: center;}
body{margin:40px 0}
header .col12{margin: 0 auto -10px;}
.update{border: 5px solid #9896ff;margin: 20px 0;padding: 20px;background: #fff url(tef.jpg) no-repeat 97% 98%;
}
main section{margin: 20px 0 40px; background:#fff;}
main section section, aside p{margin: 20px 0 20px 5px;background:#fff;}
small,small a{font-size: 11px;font-size: 1.1rem;text-decoration: none;}

strong{font-weight:bold;}
.box{background: #fff;border: 2px solid #9896ff;padding: 10px;width: 90%;margin: 10px auto;}
p.novel{font-size: 15px;font-size: 1.5rem;}

#head_image{
display:block;
margin-bottom:30px;
}

#head_image_sp{
display:none;
}

p.aside{
    margin:10px;
    padding:15px 12px 15px 15px;
    background:#fff;
    border:1px solid #c7cf30;
}

p.contents{
    padding:10px;
    background:#fff;
}

#img_left {
float:left;
margin:0 10px 50px 12px;
border:solid 1px #000;
overflow:hidden;
}

.imgleft {
margin:0 0 0 10px;
padding:0 20px 20px 5px;
overflow:auto;
}


.clear {
clear: both;
}


/*----------　Menu　----------*/

#menu-wrap {
width:100%;
height:40px;
background:#fff;
z-index:1;
}

#menu {
list-style-type: none;
margin:0 18%;
padding:0 0 10px 0;
}

#menu li {
font-family: 'Cinzel', serif;
width:140px;
float:left;
margin:0;
padding:0 auto;
text-align: center;
}

#menu li a {
display:block;
width:100%;
padding:13px 0;
color:#2f2b3f;
font-size:14px;
font-weight:bold;
line-height:1;
text-decoration: none;
}

#menu li a:hover {
background:#c7cf30;
color:#fff;
}

.fixed{
position: fixed;
top:0px;
left: 0px
z-index:9999;
}


/* サイト名・見出し */
h1 a{text-decoration: none;}
h1 a:link, h1 a:visited{font-family:'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, arial, sans-serif;font-weight: 400;font-size: 28px;font-size: 2.8rem;}
h1.novel{margin: -20px 0 20px;font-family:YuMincho, '游明朝', serif;text-align: center;font-size: 22px;font-size: 2.2rem;}
h2{background: #9896ff;color: #fff;text-align: center;position: relative;height: 24px;line-height: 24px;width: 97%;margin: 0 auto 20px;font-weight: normal;}
h2:before, h2:after {
    content: "";
    position: absolute;
    top: 0;
    border-width: 12px 10px;
    border-style: solid;
    border-color: #9896ff;
}
h2:before{right: 100%;border-left-color: transparent;}
h2:after{left: 100%;border-right-color: transparent;}
h3{font-weight: normal;color: #9896ff; padding:10px 10px 0 10px;}
h4{font-family:'Roboto Slab', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', 'メイリオ', Meiryo, serif;
margin:5px 15px; padding: 5px; font-size:22px;}

/* 展示リスト */
ul.work_1{list-style: none;}
ul.work_1 li{color: #555;}
ul.work_1 li a{margin-right: 10px;}
dl.work_2 dd{padding-left: 10px;color: #555;}
dl.work_3 dt {float: left;width: 8em;height:auto;}
dl.work_3 dd {margin: 0 0 5px 8em;padding-left: 1em;}
ul.work_4 li{list-style: none;display: inline;border-right: 1px dotted;padding-right: 7px;margin-right: 5px;}
ul.work_4 li.last{border: none;}

/* フォーム関連 */
input, select, textarea{vertical-align:middle;}
::-webkit-input-placeholder{color: #999;}
:-ms-input-placeholder{color: #999;}
::-moz-placeholder{color: #999;}

input, textarea {padding: 5px;border-radius: 2px;}
textarea{width: 80%;max-width: 400px;overflow: auto;}
.comment{background: #fff;height: 1.5em;width: 80%;max-width: 500px;}
.button{color: #fff;background: #8858aa;border: none;line-height: 1em;}
.button:hover{background: #c7cf30;cursor: pointer;}

/* リンクページ */
dl.link{clear: left;margin: 5px 0;}
dl.link.last{margin: 5px 0 20px;}
dl.link dt{float: left;margin: 0 10px 0 0;}
dl.link dd{margin-left: 210px;padding: 0 0 0 10px;border-left: 1px dotted;}
dl.link:after{visibility: hidden; display: block;font-size: 0;content: " ";clear: both;height: 0;}
ul.link li{display: inline;padding-right: 10px;}

/* One% CSS Grid - 12 Columns Fluid CSS Grid System */
/* Main container for all */
.wrapper {
	margin: 0 auto;
	padding: 0 0 0 1%;
	max-width: 1020px;
}
.onerow {
	clear: both;
	padding: 0 10px;
}
/* Common columns definitions */
.col1, .col2, .col3, .col4, #sidebar, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 {
	float: left;
	margin: 0 3% 0 0;
}
.col1.last, .col2.last, .col3.last, .col4.last, #sidebar, .col5.last, .col6.last, .col7.last, .col8.last, .col9.last, .col10.last, .col11.last, .col12 {
	margin: 0;
}
.col1 { width: 5.5%; }
.col2 { width: 14%; }
.col3 { width: 22.5%; }
.col4 { width: 31%;}
#sidebar { width: 31%;float: right;}
.col5 { width: 39.5%;}
.col6 { width: 48%; }
.col7 { width: 56.5%;}
.col8 { width: 65%; }
.col9 { width: 73.5%; }
.col10 { width: 82%; }
.col11 { width: 90.5%; }
.col12 { width: 99%;}

.clearfix:after, body:after, header:after, .update:after, main:after, section:after, dl:after{
visibility: hidden; display: block;font-size: 0;content: " ";clear: both;height: 0;}

/* Small devices */
@media all and (max-width: 768px) {
	.col1, .col2, .col3, #sidebar, .col4, .col45, .col5, .col6, .col7, .col8, .col9, .col10, .col11 {
		float: none;
		width: 99%;
	}
	body{margin: 20px 0;}
	ul#global_nav{margin: 20px auto;}
	ul#global_nav li {display: inline-block;padding: 0 10px;}
	ul#global_nav li a:before, ul#global_nav li a:hover:before{content: none;}
	h1.novel{font-weight: normal;}
}

@media (max-width:480px) {



#menu-wrap {
width:100%;
height:76px;
font-family: 'Niconne', cursive,Arial,sans-self;
background:#fff;
z-index:1;
}

#menu {
list-style-type: none;
margin:0 16%;
padding:0 0 10px 0;
}

#menu li {
width:80px;
float:left;
margin:0;
padding:0 auto;
text-align: center;
}

#menu li a {
display:block;
width:100%;
padding:13px 0;
color:#2f2b3f;
font-size:12px;
font-weight:bold;
line-height:1;
text-decoration: none;
}


.fixed{
position: fixed;
top:0px;
left: 0px
z-index:9999;
}

h4{margin:5px 15px; padding: 5px; font-size:16px;}

#head_image{
display:none;
}

#head_image_sp{
display:block;
margin-bottom:20px;
}


#img_left {
float:none;
margin:0 0 5px 10px;
border:solid 1px #000;
width:100px;
height:100px;
}

.imgleft {
margin:1px 0 55px 10px;
padding:2px 10px 8px 4px;
}

p.contents{
padding:10px;
background:#fff;
font-size:12px
}

dl.link{clear: left;margin: 5px 0;}
dl.link.last{margin: 5px 0 20px;}
dl.link dt{float: none;margin: 0 10px 0 0;}
dl.link dd{margin:0 0 10px 20px;padding: 0 0 0 10px;border-left: 1px dotted;}
dl.link:after{visibility: hidden; display: block;font-size: 0;content: " ";clear: both;height: 0;}
ul.link li{display: inline;padding-right: 10px;}

#banner{
width:200px;
height:40px;
}
}

@media (max-width:320px) {
#menu-wrap {
width:100%;
height:76px;
font-family: 'Niconne', cursive,Arial,sans-self;
background:#fff;
z-index:1;
}

#menu {
list-style-type: none;
margin:0 7%;
padding:0 0 10px 0;
}

#menu li {
width:80px;
float:left;
margin:0;
padding:0 auto;
text-align: center;
}

#menu li a {
display:block;
width:100%;
padding:13px 0;
color:#2f2b3f;
font-size:12px;
font-weight:bold;
line-height:1;
text-decoration: none;
}


.fixed{
position: fixed;
top:0px;
left: 0px
z-index:9999;
}

#head_image{
display:none;
}

#head_image_sp{
display:block;
margin-bottom:20px;
}

}
