/*
Theme Name: shousei
Theme URI: http://www.syousei.co.jp/
Author: shouhei ogaki
Author URI: http://www.syousei.co.jp/
Description: The 2013 theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
Version: 1.0

*/
@charset "utf-8";

/*
スマホ: 320px - 480px 
タブレット: 480 - 768px
PC: 768px以上
*/

/* 共通の設定 */
CSS


body {
    font-family:"HG丸ｺﾞｼｯｸM-PRO","KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;

}

#header {
   
}


#container {
}

#sub {
    background: white;
}
.posts{
    width:94%;
    margin-left: 3%;
    margin-right: 3%;
}
/*記事タイトルの設定*/
.post-header h2{
    padding-top: 10px;
}
.post-header h2 a{
    display: block;
    color:#FF9900;
    font-family:HG丸ｺﾞｼｯｸM-PRO;
    text-decoration: none;
    font-size:26px;
    margin-top:10px;
}
    #chizu{
    width:320px;
    margin:0px,auto;
    margin-right: auto;
    margin-left : auto;
}
    img.map{
    margin:auto;
}
       #maplink{
    text-align:center;
　　}
/* 以下、各画面の大きさに分けています。まずはスマホのスタイル */
@media all and (max-width: 480px) {
 /*サイドバー、body内のバナー, 画像スライドショー、タブレットメニュー、pcメニュー、pc用フッターを消去しています スマホはスライドショーはなしにしています。なぜならスマホ用の画像がないからです*/
    #sidebar{
        display:none;
    }
    #bunner{
        display:none;
    }
    #normal{
        display:none;
    }
    #tablet{
        display:none;
    }
    #bs{
  display:none;
}
    #footer_nav_a{
        display:none;
    }
    #footer_nav_b{
        display:none;
    }
       #Ga1,#Ga2{
           display:none;}
  
/*スマートフォンメニューの設定です*/    
    #cover {
    background: #000;
    opacity: 0.6;
    width: 100%;
    height: 100%;
    position:fixed;
    top: 0;
    left: 0;
    z-index: 3;
    display: none;
  }
    
    #smartphonemenu {
    z-index: 4;
    position:fixed;
    top: 0;
    right:-240px;
    color: #fff;
    background: #7CFC00;
    padding: 4px;
    box-sizing: border-box;
    width:240px;
    height: 100%;
    transition: .4s;
  }
    #smartphonemenu2{
        overflow:scroll;
        width:240px;
        height:100%;
    }
    #smartphonemenu2 ul{
margin: 1em; padding: 1em;
    }
    #smartphonemenu2 li a{
        font-size: 16px;
        font-family:"HG丸ｺﾞｼｯｸM-PRO","KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;
        color:black;
        display:block;
        margin-top:10px;
        margin-bottom:10px;
        text-decoration: none;
    }
    #hide{
    float:right;
    cursor: pointer;
  }
    /*以下でメニューを開いたときに画面をブロックしています　メニューが大きくなったときは外してください*/
  body.menu-open #cover {
    display: block;
  }
  body.menu-open #smartphonemenu {
    right: 0;
    }
    #show{
        position:fixed;
        z-index:2;
        background-color: white;
	top:0;
	left:0;
    }
    #menubotton{
        cursor:pointer;
    }
    #smartphoneimage{
        padding-top:5px;
    }
    /*トピックス　文字がかすれます 以下同様　インターネットエクスプローラーのみの現象か？*/
   	.ticker{
		width:320px;
	}

/*記事の横幅を100％にしています*/
    #main{
        width:100%;
        word-break:break-all;
    }
    .posts{
        margin-top: 20px;
        margin-bottom: 30px;
    }
    .posts{
    width:98%;
    margin-left: 1%;
    margin-right: 1%;
}
/*以下フッターの設定です*/
    #access{
        text-align: center;  
    }
    
    .credit{
        text-align: center; 
    }
    #footer{
    width:100%;
    clear:both;
    margin:0px auto;
    background-color: greenyellow;
　　list-style-type: none;
}
　　#footer_nav_1 li{
	list-style-type: none;
    }
    /*以下それぞれのページの記述*/
    /*TOP*/
    img.tag_about{
        width:100%;
    }
    #top_about_l{
        width:100%;
    }
    .top1{
        width:100%;
    }
    img.syouseinituite{
        width:25%;
        float: right;
    }
    img.tag_rebyu2{
        display:none;
    }
   
}
/*スマホのスタイル終了*/
/* タブレット縦のスタイル */

@media all and (max-width: 768px) and (min-width: 481px){
    /*pc用メニュー。スマートフォンメニュー、スマホ画像、PC用フッター、PC用サイドバーを消去しています*/
    #normal{
        display:none;
    }
    #cover{
        display:none;
    }
    #smartphonemenu{
        display:none;
    }
    #show{
        display:none;
    }
    #smartphoneimage{
        display:none;
    }
    #footer_nav_a{
        display:none;
    }
    #footer_nav_b{
        display:none;
    }
    #sidebar{
        display:none;
    }
    #sidebarpc{
        display:none;
    }
    /*スライドショーの設定です。タブレット縦ように最大480ｐｘに固定*/
    #bs{
position:relative;
margin:0px auto;
width:480px;
height:183px;

}
#Ga1,#Ga2{
position:absolute;
width:480px;
height:183px;
transition:1s ease-in-out;

    }
    /*メニューの設定です*/
.tabletmenu{
  *zoom: 1;
  list-style-type: none;
  width: 100%;
  margin: 5px auto 30px;
  padding: 0;
}
    /*それぞれのメニューの横幅を指定しています*/
    .home2{
        width:20%;
    }
    .syousei2{
        width:25%;
    }
    .jyuken2{
        width:40%;
    }
    .chiiku2{
        width:40%;
    }
    .syougakusei2{
        width:25%;
    }
    .mogi2{
        width:30%;
    }
    .otoiawase2{
        width:20%;
    }
    
.tabletmenu li{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
.tabletmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #32CD32;
  color: #DCDCDC;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  font-family:"HG丸ｺﾞｼｯｸM-PRO","KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;
}
.tabletmenu li:hover > a{
  background: #228B22;
}
.tabletmenu li a:hover{
  background: #228B22;
}
    /*トピックスの設定 文字がなぜかかすれます。以下同様*/
   .ticker{
		width:440px;
	}
    /*タブレット縦ようのサイドバーの設定です*/
#sidebar2{
    width:480px;
    margin:0px,auto;
    margin-right: auto;
    margin-left : auto;
}
    /*バナーの位置を丁度良い感じにしたいですが現在は無効
    #bunner a{
        margin:auto;  
    }
    img.taiken2{
        margin: auto;
    }
    img.onayami2{
        margin: auto;
    }
　　img.gakkou2 {
        margin: auto;
　　}
    img.blog2{
        margin: auto;
    }
    */
    /*記事のスクリプトです*/
#main{
    width:100%;
    }
    #body2{
        width:98%;
        margin-right: auto;
margin-left : auto;
        
    }
    .posts{
    margin-top:20px;
    margin-bottom: 20px;
}
/*フッターの設定です*/
    #footer{
        width:100%;
       clear:both;
    margin:0px auto;
    background-color: greenyellow;
        text-align: center; 
	list-style-type: none;
}
}
/* タブレット横のスタイル */

@media all and (max-width: 1279px) and (min-width: 769px){
    /*PCメニュー　スマホメニュー、スマホ画像、タブレット縦のフッター、タブレット縦のサイドバーを消去しています*/
    #normal{
        display:none;
    }
    #cover{
        display:none;
    }
    #smartphonemenu{
        display:none;
    }
    #show{
        display:none;
    }
    #smartphoneimage{
        display:none;
    }
    #footer_nav_1{
        display:none;
    }
    #sidebar2{
        display:none;
    }
    #sidebarpc{
        display:none;
    }

    
    /*スライドショーの設定 769pxに固定*/
    #bs{
position:relative;
margin:0px auto;
width:769px;
height:293px;

}
/*★必須。フェードスライド用の指定*/
#Ga1,#Ga2{
position:absolute;
width:769px;
height:293px;
transition:1s ease-in-out;

    }
    /*メニューの設定*/
.tabletmenu{
  *zoom: 1;
  list-style-type: none;
  width: 769px;
  margin: 5px auto 30px;
  padding: 0;
}
    .home2{
        width:20%;
    }
    .syousei2{
        width:25%;
    }
    .jyuken2{
        width:40%;
    }
    .chiiku2{
        width:40%;
    }
    .syougakusei2{
        width:25%;
    }
    .mogi2{
        width:30%;
    }
    .otoiawase2{
        width:20%;
    }
    
.tabletmenu li{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
.tabletmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #32CD32;
  color: #DCDCDC;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  font-family:"HG丸ｺﾞｼｯｸM-PRO","KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;
}
.tabletmenuli:hover > a{
  background: #228B22;
}
.tabletmenu li a:hover{
  background: #228B22;
}
    /*サイドバーの設定*/

    #sidebar{
    width:220px;
    float:left;
}
    img.gakkou1 {
margin-top: 10px;
margin-bottom: 10px;
}
    img.taiken1{
        margin-bottom: 10px;
    }
    img.onayami1{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    img.blog1{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    img.gakkou1:hover {
        opacity: 0.8;
}
    img.taiken1:hover{
    opacity: 0.8;
    }
    img.onayami1:hover{
      opacity: 0.8;
    }
    img.blog1:hover{
       opacity: 0.8;
    }
    img.bosyu1{
        margin-top: 10px;
        margin-bottom: 15px;
    }
    img.bosyu1:hover{
    opacity:0.8;
    }
  /*記事の設定*/  
#main{
    width:540px;
    float:right;
    
}
    #body2{
        width:769px;
        margin-right: auto;
margin-left : auto;
      
        
    }
    .posts{
    margin-top:20px;
    margin-bottom: 20px;
}
    /*トピックスの設定*/
    .ticker{
		width:500px;
	}
    /*フッターの設定*/
    #footer{
        width:759px;
       clear:both;
    margin:0px auto;
    background-color: greenyellow;
list-style-type: none;
}
    #footer_sub_nav{
	list-style-type: none;
      text-align: center;  
    }
    #footer_sub_nav li{
        display:inline;
        margin:18px;
list-style-type: none;
    }
    #footer_nav_a{
　　　list-style-type: none;
      text-align: center;  
    }
    #footer_nav_a li{
　　　　list-style-type: none;
        display:inline;
        margin:12px;
    }
    #footer_nav_b{
	list-style-type: none;
      text-align: center;  
    }
    #footer_nav_b li{
　　　　list-style-type: none;
        display:inline;
        margin:18px;
    }
    #access{
        text-align: center;  
    }
    
    .credit{
        text-align: center; 
    }
}
/* PCのスタイル */

@media all and (min-width: 1280px) {
    /*タブレットメニュー、スマホメニュー、タブレット縦のフッターを消去*/
     #tablet{
        display:none;
    }
    #cover{
        display:none;
    }
    #smartphonemenu{
        display:none;
    }
    #show{
        display:none;
    }
    #smartphoneimage{
        display:none;
    }
    #footer_nav_1{
        display:none;
    }
    #sidebar2{
        display:none;
    }
    #sidebar{
        display:none;
    }

    /*スライドショーの設定*/
    #bs{
position:relative;
margin:0px auto;
width:1100px;
height:420px;
}
#Ga1,#Ga2{
position:absolute;
width:1100px;
height:420px;
transition:1s ease-in-out;

    }
/*メニューの設定 1100pxに固定*/
.dropmenu{
  *zoom: 1;
  list-style-type: none;
  width: 1100px;
  margin: 5px auto 30px;
  padding: 0;
}
.dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
.dropmenu:after{
  clear: both;
}
    /*それぞれ大きさを指定*/
.home{
        width:6%;
    }
    .syousei{
        width:13%;
    }
    .jyuken{
        width:22%;
    }
    .chiiku{
        width:22%;
    }
    .syougakusei{
        width:11%;
    }
    .mogi{
        width:15%;
    }
    .otoiawase{
        width:11%;
    }
    
.dropmenu li{
  position: relative;
  float: left;
  margin: 0;
  padding: 0;
  text-align: center;
}
.dropmenu li a{
  display: block;
  margin: 0;
  padding: 15px 0 11px;
  background: #32CD32;
  color: #DCDCDC;
  font-size: 14px;
  line-height: 1;
  text-decoration: none;
  font-family:"HG丸ｺﾞｼｯｸM-PRO","KozGoPro-Light", "小塚ゴシック Pro L", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;
}
.dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
.dropmenu li ul li{
  width: 100%;
}
.dropmenu li ul li a{
  padding: 13px 15px;
  border-top: 1px solid #7c8c0e;
  background: #32CD32;
  text-align: left;
}
.dropmenu li:hover > a{
  background: #228B22;
}
.dropmenu li a:hover{
  background: #556B2F;
}
    #normal li ul{
  display: none;
}
#normal li:hover ul{
  display: block;
}
    /*トピックスの設定*/
    .ticker{
		width:800px;
	}
    /*サイドバーの設定*/
#sidebarpc{
    width:260px;
    float:left;
}
img.gakkou1 {
margin-top: 10px;
margin-bottom: 10px;
}
    img.taiken1{
        margin-bottom: 10px;
    }
    img.onayami1{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    img.blog1{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    img.bosyu1{
        margin-top: 10px;
        margin-bottom: 15px;
    }
    img.bosyu1:hover{
    opacity: 0.8;
    }
    img.gakkou1:hover {
        opacity: 0.8;
}
    img.taiken1:hover{
    opacity: 0.8;
    }
    img.onayami1:hover{
      opacity: 0.8;
    }
    img.blog1:hover{
       opacity: 0.8;
    }
    /*記事の設定*/
#main{
    width:840px;
    float:right;
    
}
    #body2{
        width:1100px;
        margin-right: auto;
margin-left : auto;
        
        
    }
    #posts{
    margin-top:20px;
    margin-bottom: 20px;
}
    /*フッターの設定*/
    #footer{
        width:1100px;
       clear:both;
    margin:0px auto;
    background-color: greenyellow;
	list-style:none;
}
#footer_pc{
width:775px;
float:left;
margin-bottom:50px;
}
#footer_sub_nav{

      text-align: center;  
    }
    #footer_sub_nav li{
        display:inline;
        margin:20px;
    }
    #footer_nav_a{

      text-align: center;  
    }
    #footer_nav_a li{
        display:inline;
        margin:20px;
    }
    #footer_nav_b{

      text-align: center;  
    }
    #footer_nav_b li{
        display:inline;
        margin:20px;
    }

    #chizu{
     float:right;
     width:325px;
     }
    
    #access{
        text-align: center;  
    }
    
    .credit{
        text-align: center; 
    }
}
