/*-----------------------*/
/*　共通CSSの設定ですん　*/
/*-----------------------*/
body {
    font-size: 15px;
    background-color: #fff;
    padding:0px;
    margin:0px;
}

div.container {
    width: 1000px;
    margin-left:auto; 
    margin-right:auto;
    /* box-shadow: 0 0 100px #000;*/

}


h2 {
	font-size:26px;
}


/* 記事の見出し h3 */
h3 {
    font-size: 20px;
    border-left: 10px solid #ebb236;
    border-bottom: 1px solid #333;
    padding-left: 10px;
}


/* 小見出しh4*/
h4 {
    font-size: 18px;
}

/*--------------------------------*/
/* ヘッダー                       */
/*--------------------------------*/
/*　サイトタイトル */

.header {
    border-top: 5px solid #ebb236;
    border-bottom: 5px solid #ebb236;
    background-color: #F5F5DC;
    color: #333;
}


h1.title {
    font-size: 36px;
    align-items: center;
    letter-spacing: 10px;
    font-family: HGMinchoE;
    margin-left:10px;
    margin-bottom:0px;
    width:250px;

}

h1.title a {
    text-decoration:none;
    color:#333;
    transition: color 0.5s;
}
h1.title a:hover{
    color: #ebb236;
    transition: color 0.5s;
}

.subtitle {
    font-size:16px;
    height:18px;
    letter-spacing:2px;
    position:relative;
    
    left:450px;
    font-weight: bold;
    font-family: 'Times New Roman';
}

/*----------------------*/
/*　ナビゲーションバー　*/
/*----------------------*/

.menubar {
    background-color: #EEE8AA;
}



ul#menu {
    padding: 0px;
    list-style-type: none;
    width:1200px;
    height:50px;
    margin:10px auto;


    
}

    #menu li {
		float:left;
        width: 166px;
        text-align: center;
        background-color: #EEE8AA;
        color: #000;
        height: 50px;
        line-height: 50px;
        margin-right: 2px;
        transition: background-color 0.5s;
    }

        #menu li a {
            text-decoration: none;
            color: #000;
            font-weight: bold;
            padding: 10px 40px;
        }

        /* マウスホバー時の処理 */

        #menu li:hover {
            text-decoration: none;
            color: #000;
            font-weight: bold;
            background-color: #ebb236;
            transition: background-color 0.5s;
        }

/* -------------------------------------------------------------------- */
/* パンくずリスト作るの面倒だから、グラデーション使ってみたんごごごご！ */
/* まさに、未来ずらー！！
 -----------------------------------------------------------------------*/

.pankuzu {
    background:linear-gradient(#EEE8AA ,#ffffff);
    height:15px;
}

.pankuzu-index {
    background: linear-gradient(#EEE8AA,#000000);
    height: 20px;
}


/* メインコンテンツ */

div#main {
    margin: 20px;
    clear:both;
}

/*----------------------*/
/*----------------------*/
/* index.htmlのキャッチコピーゾーン */
/*----------------------*/
/*----------------------*/


.ie8-mainimg{

    width:auto;
    height:100%;
    clear:both;
}

.catch{
    position:relative;
    margin:0px;
    top:0px;
    left:0px;
    width:500px;
    height:100%;
        /* background-colorはIE8でのみ適用 */
	  background-color:#000128\9;
    background-image:url(../img/rcnlogo-blue.jpg);
    background-repeat:no-repeat;
    background-position:center 70%;
    
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#B3000128,endColorstr=#33000128);
    
        /* IE9以降は以下のスタイルを適用 */
    background:rgba(33,33,33,0.4);
    color:#fff;
    font-family:HGKyokashotai;
    float:left;
    }


    .catch h4 {
        position:relative;
        font-size: 36px;
        margin:0px;
        top:100px;
        left:20px;
    }
 .catch p{
     position:relative;
    font-size:24px;
    margin:0px;
    top:160px;
    left:20px;
}


.bg-slider {
	height:92vh;
    height: 600px\9;
    /* CSS3が適用されないIE8においては、92vhではなく600pxにて指定する。 */
    width: 99vw;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0px;
    text-shadow: 0 0 3px #7b7a35;
    font-weight:bolder;
    background-color:#000128;
	background-image:url("../img/002min.jpg");
	background-position:


}






    /*-----------------------------------*/
    /* flexarea                          */
    /* カードが自由に配置できるようにする*/
    /* ----------------------------------*/

    div.flexarea{
        display:flex;
        justify-content:flex-start;

    }


.topics {
	overflow: hidden;position: relative;
	box-shadow: 0px 0px 15px rgba(0,0,0,0.3);	/*ボックスの影。右へ、下へ、ぼかす範囲。0,0,0は黒の事で0.3は透明度30%の事。insetは内側に向かう影。*/
	margin: 0 1% 30px;	/*上、左右、下へのボックスの外に空けるスペース*/
	background: #fff;	/*背景色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
	/* 
  padding:1%;	*//*ボックス内の余白*/
  border: 1px solid #aaa;
    
  width:31%;
  float:left;
  height:auto;
}

.topics img {
  width:100%;
}
.topics h4 {
    padding-left:2%;
}
.topics p {
    padding-left:2%;
    padding-bottom:5%;
}

.topics-link{
        text-decoration:none;

}

.topics-link p{
    border-top:1px solid #aaa;
    text-align:center;
    padding:8%;
    margin:0px;
    color:#000;
    font-size:16px;
}
/*----------*/
/* フッター */
/*----------*/
    .footer {
        background-color: #ebb236;
        text-align: center;
        height: 40px;
    	clear:both;
    }

    .footer .copyright {
		height:40px;
        background-color: #333;
        line-height: 3;
        color:#fff;
    }

/*-------------------------


更新情報
dd dtの設定

--------------------------*/
div#new{
    clear:both;
}


dl{
    line-height:1.5;
}

dt {
    font-weight:bold;
}
dd {
    border-bottom:1px solid #aaaaaa;
    margin-bottom:10px;
}



/*隊長挨拶ページ CSS */
/* ----------------------------------------------------------------------- */

.co-img{
    float:left;
    width: 1000px;
    position:relative;
    top:50px;
    margin-bottom:50px;
}

.co-img img{
    width:1000px;
}

.co-img-text{
	float:right;
    width:500px;
    padding-right:20px;
    font-family:HG正楷書体-PRO;
    line-height:1.5;
    

}

.co-img-text h5 {
	font-size: 28px;
    font-weight:bold;

}

.co-img-text p {
    font-size:20px;
    font-weight:bold;

}
.kotoba{
    font-size:20px;
    padding-left:100px;

}




/* 
@media screen and (max-width: 1400px){
	body{
	zoom: 50%;
}
	.bg-slider {
    height: 92vh;
    width: 99vw;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0px;
    text-shadow: 0 0 3px #7b7a35;
    font-weight:bolder;


}

}
	 */



/*listブロック
---------------------------------------------------------------------------*/
/*listブロック設定*/
.list {
	overflow: hidden;position: relative;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.8) ;	/*ボックスの影。右へ、下へ、ぼかす範囲。0,0,0は黒の事で0.3は透明度30%の事。insetは内側に向かう影。*/
	margin: 0 1% 10px;	/*上、左右、下へのボックスの外に空けるスペース*/
	background: #fff;	/*背景色*/
	transition: 0.5s;	/*マウスオン時の移り変わるまでの時間設定。0.5秒。*/
	padding: 0%;	/*ボックス内の余白*/
}
.list a {
	overflow: hidden;text-decoration: none;display: block;
}
/*h4タグ設定*/
.list h4 {
	padding: 0;border: none;
	font-size: 130%;	/*文字サイズ*/
	color: #ebb236;		/*文字色*/
	line-height: 1.5;
	height: 50px;overflow: hidden;	/*１行を超えた部分は非表示になる*/
	margin-bottom: 0.5em;
    font-weight:bold;
    
}
/*段落タグ設定*/
.list p {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.8;
	overflow: hidden;
}
/*figure画像の設定*/
.list figure img {
	margin: 0 0 4% 0;	/*上、右、下、左への画像の外側にとるスペース*/
vertical-align: middle;
}
/*figure画像の右側回り込みの設定*/
.list figure img.fr {
	width: 20%;		/*画像幅*/
	float: right;	/*右に回り込み*/
	margin: 0 0 0 4%;	/*上、右、下、左への画像の外側にとるスペース*/
}
/*figure画像の左側回り込みの設定*/
.list figure img.fl {
	width: 20%;		/*画像幅*/
	float: left;	/*左に回り込み*/
	margin: 0 4% 0 0;	/*上、右、下、左への画像の外側にとるスペース*/
}
/*右下の「→」マーク設定*/
.list a::before {
	content: "→";	/*このテキストを表示させる。変更しても構いませんが機種依存文字は化ける場合があるので使わない。*/
	font-size: 20px;	/*文字サイズ*/
	text-align: center;
	border-radius: 50%;	/*円形にする*/
	background: #b2b2b2;	/*背景色（古いブラウザ用）*/
	background: rgba(0,0,0,0.3);	/*背景色。0,0,0は黒の事で0.3は透明度30%の事。*/
	color: #fff;	/*文字色*/
	position: absolute;
	right: 10px;	/*右から10pxの場所に配置*/
	bottom: 10px;	/*下から10pxの場所に配置*/
	width: 30px;	/*幅*/
	line-height: 30px;	/*高さ*/
	transition: 1s;	/*マウスオン時の移り変わるまでの時間設定。1秒。*/
}
/*右下の「→」マークのマウスオン時*/
.list a:hover::before {
	background: #ebb236;	/*背景色*/
	box-shadow: 0px 0px 0px 10px #ebb236;	/*ボックスの影の指定ですが、円がそのまま大きくなるような動作になります。右へ、下へ、ぼかす範囲、距離。最後は色。*/
}
/*2カラム利用時--------------------------------------------*/
.c2 .list {
	float: left;	/*左に回り込み*/
	padding: 3%;	/*ボックス内の余白の上書き*/
	width: 40%;		/*幅*/
}
/*h4タグ*/
.c2 .list h4 {
	font-size: 130%;
}
/*p段落タグ*/
.c2 .list p {
	height: 5.4em;	/*上の「.list p」の「1.8」×「表示させたい行数」を設定。5.4だと3行分になる。*/
}
/*3カラム利用時--------------------------------------------*/
.c3 .list {
	float: left;	/*左に回り込み*/
	width: 30%;	/*幅*/
}
/*h4タグ*/
.c3 .list h4 {
	font-size: 110%;
}
/*p段落タグ*/
.c3 .list p {
	font-size: 80%;
	height: 7.2em;	/*上の「.list p」の「1.8」×「表示させたい行数」を設定。7.2だと4行分になる。*/
}
/*右下の「→」マークを少し小さく設定しなおす*/
.c3 .list a::before {
	width: 20px;
	line-height: 20px;
	font-size: 12px;
}