@charset "UTF-8";


 /* ページ全体 */

 body { 
    margin: 0 auto;    /* 中央揃え */ 
    width: 900px; 
    height:;  
    background-color: #ffffff;
    background-image: url(hp_back02.jpg); 
    font-family: "ＭＳ　Ｐゴシック",Meiryo,sans-serif;  
    color: #333333; 
    -webkit-text-size-adjust: 100%; 
    border-style: solid; 
    border-width: 0px 1px; 
    border-color: #660033; 

}


 /* リンクの設定(共通) */

 a{
    text-decoration: none; 

}


/* リンクの基本的な設定 */

 a:link{ color: #333333; background-color: #ffffff; }
 a:visited{ color: #333333; background-color: #ffffff; }
 a:hover{ color: #000000; background-color: #ffffff; 
          text-decoration: underline; }
 a:active{ color: #333333; background-color: #ffffff; } 


/* リンクの基本的な設定(アサイドのリンク１) */

 .atelier a:link{ color: #660033; background-color: #ffccff; }
 .atelier a:visited{ color: #660033; background-color: #ffccff; }
 .atelier a:hover{ color: #660066; background-color: #ffccff; 
          text-decoration: underline; }
 .atelier a:active{ color: #660033; background-color: #ffccff; } 


/* リンクの基本的な設定(アサイドのリンク２) */

 .mihana a:link{ color: #006633; background-color: #ffccff; }
 .mihana a:visited{ color: #006633; background-color: #ffccff; }
 .mihana a:hover{ color: #333333; background-color: #ffccff; 
          text-decoration: underline; }
 .mihana a:active{ color: #006633; background-color: #ffccff; }


/* リンクの基本的な設定(フッター) */

 footer a:link{ color: #ffffff; background-color: #660033; }
 footer a:visited{ color: #ffffff; background-color: #660033; }
 footer a:hover{ color: #ffff66; background-color: #660033; 
          text-decoration: underline; }
 footer a:active{ color: #ffffff; background-color: #660033; } 


 /* ヘッダーの設定 */

 header {
    margin: 0;
    padding: 0;
    width: 900px; 
    height: 100px;
    text-align: center;  
    background-color: #ffffff;  

}


/* 画像下端の処理(全て) */

 img{
    vertical-align: bottom;

}


 /* トップ画像の設定 */

 h1 {
    margin: 0;
    padding: 0;
    width: 900px; 
    height: 300px;
    text-align: center;  
    background-color: #ffffff;  

}


/* フレックスボックスレイアウト */

 #flex {
    width: 900px;
    margin: 0px auto;
    display: flex;

}


/* メインコンテンツの設定 */

 main{
    flex-basis: 620px;
    padding: 30px;    
    background-color: #ffffff;

}


/* 補足とリンク集 */

 aside{
    flex-basis: 200px;
    padding: 10px;
    background-color: #ffccff;
    color: #660066;

}


/* 文章の見出し */

 h2{
    margin: 0px;
    padding-left: 10px;
    padding-bottom: 5px;
    font-size: 16pt;
    font-weight: bold;
    border-left: 10px solid #cc99ff;    
    border-bottom: 5px solid #cc99ff;

}


/* アサイドの見出し */

 h3{
    margin: 0px;
    padding-top: 20px;
    font-size: 14pt;
    font-weight: bold;
    color: #660066;

}


 h4{
    margin: 0px;
    padding-top: 20px;
    font-size: 14pt;
    font-weight: bold;
    color: #006666;

}


/* リストの設定 */

 ul{
    margin: 0px auto;
    padding: 0px;
    
}


/* リストアイテムの設定 */

 li{
    margin: 0px;
    padding: 10px 5px;
    list-style-type: none;
    font-size: 11pt;
    font-weight: bold;
    display: block;
    width: 100%;
   
}


/* 私の顔写真 */

 .face_01{
    margin: 10px 20px 10px 10px;
    float: left;

}


/* 補足説明の文章 */

 .aside{
    margin: 0px;
    padding-bottom: 30px;
    font-size: 10pt;
    font-weight: bold;
    line-height: 150%;

}


/* 文章の設定 */

 .bunbun{
    margin-bottom: 10px;
    padding: 10px 10px 40px;
    font-size: 12pt;
    font-weight: normal;
    line-height: 180%;

}


/* 文章の設定(上部に画像がある場合) */

 .bunbun2{
    margin-bottom: 10px;
    padding: 0px 10px 5px 10px;
    font-size: 12pt;
    font-weight: normal;
    line-height: 180%;

}


/* 文章の設定(フッターリンク) */

 .bunbun3{
    margin-bottom: 10px;
    padding: 10px 5px 10px 10px;
    font-size: 11pt;
    font-weight: bold;
    line-height: 200%;

}


/* 文章の設定(フッター文) */

 .bunbun4{
    margin: 0px;
    padding: 5px 10px;
    font-size: 12pt;
    font-weight: bold;
    line-height: 180%;

}


/* spanで使う部分的な装飾 */

 .aka{
    color: #660033;

}


 .akabo{
    color: #660033;
    font-weight: bold;
}


 .bo{
    font-weight: bold; 

}


/* 工房の略歴(テーブル方式) */

 table{
    margin: 15px 10px;
    padding: 0px;
    width: 590px; 
    height: auto;
    background-color: #ffffff;
    border: 0px #333333 solid;

}


 .left{
    padding: 5px;
    height: auto;
    width: 120px;
    font-size: 12pt;
    color: #333333;
    font-weight: bold;
    line-height: 150%;
    vertical-align: top;

}


 .right{
    padding: 5px 0px;
    height: auto;
    width: 470px;
    font-size: 12pt;
    color: #333333;
    font-weight: normal;
    line-height: 150%;
    vertical-align: top;

}


 /* フッターの設定 */

 footer {
    margin:0px;
    background-color: #660033; 
    padding: 30px 30px 0px; 
    color: #ffffff; 

}


 /* フッターリンク集 */

 .foot1{
    width: 50%;
    height:;

}


 .foot2{
    width: 50%;
    height:;

}


 .links{
    display: flex;

}