/*デザインしやすいように上書きリセット*/
*{
font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
word-wrap:break-word;
-webkit-text-size-adjust:100%;
margin:0;
padding:0;
line-height:1.0;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
body{
font-size:16px;
background:#fefff1;
}
/*ヘッダーです。サイト名の部分*/
#header h1{
text-align:center;
width:100%;
font-size:36px;
padding:24px 0 0 0;
color:#db5c33;
background:#fff;
font-family:'Sacramento',cursive;
}
/*サイトタイトル部分のspan要素*/
#sub_title{
color:#860673;
background:#fff;
text-align:center;
font-size:12px;
padding-bottom:24px;
}
/*ナビゲーション*/
nav.navi{
background:#feede3;
border-top:4px dotted #db5c33;
border-bottom:4px dotted #db5c33;
}
nav.navi ul{
display:-webkit-flex;
display:flex;
-webkit-justify-content:center;
justify-content:center;
-webkit-align-items:center;
align-items:center;
-webkit-justify-content:flex-start;
justify-content:flex-start;
padding-top:6px;
padding-bottom:6px;
padding-left:4px;
padding-right:4px;
}
nav.navi ul li{
-webkit-flex-grow:1;
flex-grow:1;
list-style-type:none;
}
/*ナビリンク部分*/
nav.navi ul li a{
display:block;
border:2px solid #db5c33;
margin:0 4px;
color:#e7506f;
background:#fff;
padding:6px;
border-radius:6px;
}
nav.navi ul li:nth-child(2) a{
color:#f9d99a;
border:2px solid #fbdc91;
font-weight:bold;
}
nav.navi ul li:nth-child(3) a{
color:#a1ddda;
border:2px solid #a1ddda;
}
nav.navi ul li a i{
font-size:18px;
}
nav.navi ul li a span{
color:#888;
font-size:12px;
display:block;
text-align:center;
}
.material{
text-align:center; 
}
.material a{
color:#357;
font-size:.8em;
display:inline-block;
}
.imgContents{
width:82%;
height:140px;
margin:6px auto;
}
/*ミシン目のBOX*/
.sewing{
position:relative;
color:#454545;
border:dashed 2px #fff;
margin:18px;
padding:12px;
}
.sewing:after{
position:absolute;
content:'';
right:-8px;
top:-8px;
border-width:0 15px 15px 0;
border-style:solid;
box-shadow:-1px 1px 1px rgba(0, 0, 0, 0.15);
}
.sewing p{
font-size:.9em;
margin:0;
padding:0;
line-height:1.4;
}
/*１つめミシン目BOXの色関連指定*/
.box1{
border:dashed 2px #e5c57a;
background:#fff0cd;
box-shadow:0px 0px 0px 6px #fff0cd;
}
.box1:after{
border-color:#fd8 #fff #fd8;
}
/*２つめミシン目BOXの色関連指定*/
.box2{
color:#998c8c;
background:#ffeaea;
box-shadow:0px 0px 0px 6px #ffeaea;
}
.box2:after{
border-color:#ffc3c3 #fff #ffc3c3;
}
/*３つめミシン目BOXの色関連指定*/
.box3{
background:#d6ebff;
box-shadow:0px 0px 0px 6px #d6ebff;
}
.box3:after{
border-color:#a3d2ff #fff #a3d2ff;
}
/*フッターデザイン『共通ヘッダー/フッター部分』*/
footer{
width:100%;
padding-top:24px;
padding-bottom:24px;
display:block;
text-align:center;
background:#fff;
}
footer #copyright a{
color:#008080;
text-decoration:none;
padding:12px 22px;
background:#fff;
border-radius:100%;
border:solid 1px #f9d1d0;
}
center{display:block;background:#fff;margin:0 auto 6px auto;}
.Wrapper{background:#fff;width:420px;margin-left:auto;margin-right:auto;}