@charset "UTF-8";
/***********************************
全体設定
***********************************/
*{margin:0px;
padding:0px;}
body {
    font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color: #333333; 
 }
 a {
    text-decoration: none;
}
.text10{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 10px;
    font-weight: normal;
}
.text12{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 12px;
    font-weight: normal;
}
.text13{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 13px;
    font-weight: normal;
}



table {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 16px;
    line-height: 2.5em;
}
table th {
    text-align: left;
    font-weight: normal;
    border-bottom: 1px solid #CCCCCC;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}
table td {
    text-align: left;
    border-bottom: 1px solid #CCCCCC;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
}


@media only screen and (max-width: 500px) {
table {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 13px;
    line-height: 2em;
}
table th {
    text-align: left;
    font-weight: normal;
    border-bottom: 1px solid #CCCCCC;
    padding-top: 10px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 15px;
}
table td {
    text-align: left;
    border-bottom: 1px solid #CCCCCC;
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 10px;
    padding-right: 10px;
}
}

/*角丸*/
.round5{
	-moz-border-radius: 5px;    /* Firefox */
	-webkit-border-radius: 5px; /* Safari,Chrome */
	border-radius: 5px;         /* CSS3 */
	}
    
    
    
/*スマホの時だけ改行させる*/	
/*HTMLはこう書く*/	
/*　　<br class="brSM" />　　*/	


/*スマホだけ改行（PCの時にnone）*/	
@media only screen and (min-width: 650px){
.brSM{
	display:none;
	}
} 

.pele_red{
    color: #B20031;
}
.pele_glay{
    color: #333333;
    font-weight: bold;
}
.pele_blue{
    color: #0071ae;
    font-weight: bold;
}

/***********************************
マージン設定
***********************************/
.margin_t5 {
	margin-top: 5px;
}
.margin_t10 {
	margin-top: 10px;
}
.margin_t15{
	margin-top: 15px;
}
.margin_t20 {
	margin-top: 20px;
}
.margin_t30 {
	margin-top: 30px;
}
.margin_t40{
	margin-top: 40px;
}
.margin_t50{
	margin-top: 50px;
}
.margin_t60{
	margin-top: 60px;
}
.margin_t70{
	margin-top: 70px;
}
.margin_t80{
	margin-top: 80px;
}
.margin_t90{
	margin-top: 90px;
}
.margin_t100{
	margin-top: 100px;
}


.margin_b20{
	margin-bottom: 20px;
}
.margin_b30{
	margin-bottom: 30px;
}
.margin_b40{
	margin-bottom: 40px;
}


/***********************************
共通設定
***********************************/ 
.img100 {
max-width: 100%;
height: auto;
}

/***********************************
共通ヘッダー＆ナビ設定
***********************************/
#top_bar {
    background-color: #B20031;
    padding-top: 7px;
    padding-bottom: 7px;
}
#top_bar #seotext {
    font-size: 9px;
    text-align: right;
    font-weight: normal;
    color: #ffffff;
    }
/*700以下になったらseotextを非表示*/
@media only screen and (max-width: 700px) {
    #top_bar {
    background-color: #B20031;
    padding-top: 10px;
    padding-bottom: 10px;
}
    #seotext {
    display:none; /*非表示*/
    }
}    
   

#naviBox_PC {
    width: 1200px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 30px;
    overflow: hidden; /*floatの解除*/
    position: relative; /*DWで正常にプレビュー*/
    zoom: 1; /*IE6でレイアウト崩れ防止*/
    height: 250px;
    }
    /*#naviBox以下ナビゲーションの詳細設定はnavi.css*/

#naviBox_PC nav {
    float: left;
    width: 1000px;
}
.hed_btn {
    float: right;
    width: 200px;
}
/*1200以下になったらPC用ナビを非表示*/
@media only screen and (max-width: 1200px) {
    #naviBox_PC {
    display:none; /*非表示*/
    }
}

/*logo部分*/
.sub_logo  {
    width: 310px;
    height: 41px;
 }
 /*1200以下になったときの余白調整 */
@media only screen and (max-width: 1200px) {
    .sub_logo  {
    width: 310px;
    height: 41px;
    padding-top: 30px;
    padding-bottom: 30px;
 }
 }
 /*600以下になったらロゴを小さく*/
@media only screen and (max-width: 600px) {
    .sub_logo  {
    width: 255px;
    height: 33px;
    padding-top: 30px;
    padding-bottom: 30px;
 }
 

}

/*1199以上になったらSM用ナビを非表示*/
@media screen and (min-width: 1199px) {
    #naviBox_SM{
     display:none; /*非表示*/
    }
}
#naviBox_SM{
    overflow: hidden; /*floatの解除*/
    }

    
/***********************************
共通イメージボックス設定
***********************************/    
/*イメージ写真の位置*/
#sub_imageBox {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 100%;
    height: 280px;
    margin-top: -130px;
    position: relative;
    z-index: -100
}
/*イメージ写真の位置（1200以下）*/
@media only screen and (max-width: 1200px) {
#sub_imageBox {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 100%;
    height: 280px;
    margin-top: -10px;
    }
}

/*/*イメージ写真の位置（1000以下）*/*/
@media only screen and (max-width: 1199px) {
    #sub_imageBox {
    margin-top: 0px;
    }
}
/*700以下になったときのマージン調整用*/
@media only screen and (max-width: 700px) {
    #sub_imageBox {
    margin-top: -50px;
    }
}

/***********************************
共通イメージボックス内の見出し設定
***********************************/  

#sub_imageBox .titleBox{
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform : translate(-50%,-50%);
    transform : translate(-50%,-50%);
    padding-top: 20px;
}

#sub_imageBox .page_title{
    font-family: copperplate, serif;
    font-weight: 500;
    font-style: normal;
    text-align: center;
    color: #FFFFFF;
    margin-top: 7px;
    margin-bottom: 7px;
    font-size: 35px;
    letter-spacing: 5px;
}
#sub_imageBox .page_subtitle{
    text-align: center;
    color: #FFFFFF;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: normal;
	 letter-spacing: 2px;
}
/*700以下になったときのフォント大きさの*/
@media only screen and (max-width: 700px) {
    #sub_imageBox .titleBox{
    padding-top: 10px;
}
   #sub_imageBox .page_title{
    margin-top: 3px;
    margin-bottom: 3px;
    font-size: 18px;
}
#sub_imageBox .page_subtitle{
    font-size: 12px;
    }
}


/***********************************
レイアウト設定
***********************************/ 
#mainBox1200 {
    width: 1200px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    overflow: hidden; /*floatの解除*/
    position: relative; /*DWで正常にプレビュー*/
    zoom: 1; /*IE6でレイアウト崩れ防止*/
    z-index: 1
}
#mainBox1200 .Breadcrumb{
    font-size: 13px;
    line-height: 1.5em;
}
#mainBox1200 .Breadcrumb a{
    font-size: 13px;
    font-weight: bold;
    color: #999999;
}
#mainBox1200 a:hover img {
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";
}
#ContentsBox{
    width: 800px;
    float: left;
    margin-right: 130px;
    padding-top: 30px;
}
#sideBox{
    width: 270px;
    height: auto;
    float: right;
    }
    #sideBox .leftBox{
    margin-bottom: 10px;   
    }
    #sideBox .rightBox{
    margin-bottom: 10px;   
    }
    #sideBox .img_size{
    width: 270px;
    height: 130px;
    }
    #sideBox .img_size02{
    width: 270px;
    height: 160px;
    }
    
    
    #sideBox .inBox{
    margin-top: 0px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #CCCCCC;
    }
    #sideBox .side_navi_title{
    color: #000000;
    background-color: #CCCCCC;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 10px;
    padding-right: 10px;
    }
    
    
/*サイドバナーシリーズタイトル*/     
#sideBox .side_midashi{
    color: #FFFFFF;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 13px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 8px;
    padding-bottom: 5px;
    line-height: 1.2em;
    font-weight: bold;
    margin-bottom: 15px;
    }
    #sideBox .color_A{
    background-color: #dc6d84;
    }
    #sideBox .color_B{
    background-color: #eea33c;
    }
    #sideBox .color_C{
    background-color: #5fb5c8;
    }
    #sideBox .color_D{
    background-color: #cf85ab;
    }
    
/*ブログ・news用サイド*/      
#sideBox02{
    width: 270px;
    height: auto;
    float: right;
    }
    #sideBox02 .leftBox{
    margin-bottom: 10px;   
    }
    #sideBox02 .rightBox{
    margin-bottom: 10px;   
    }
    
    
    #sideBox02 .archives{
    margin-top: 0px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #CCCCCC;
    }
    #sideBox02 .archives ul{
   list-style: none;
      }
       #sideBox02 .archives ul li{
        margin-bottom: 30px;
      }
    #sideBox02 .archives ul li a{
    text-decoration: underline;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 15px;
    color: #8A8989;
    line-height: 1.7em;  
    }
    
    
    .uk-nav-default{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
    font-size: 16px !important;
   }
    
    #sideBox02 .inBox{
    margin-top: 0px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
    border: 1px solid #CCCCCC;
    }
    #sideBox02 .side_navi_title{
    color: #000000;
    background-color: #CCCCCC;
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 10px;
    padding-right: 10px;
    }    
    
 /*topと共通*/   
#footer{
    margin-top: 150px;
    border-top: 30px solid #CCCCCC;
    background-color: #B20031;
    width: 100%;
    color: #FFFFFF;
    font-size: 13px;
    padding-top: 5%;
    padding-bottom: 5%;
}

#footernavi{
    margin-top: 60px;
}
#footernavi a{
    margin-top: 50px;
    color: #FFFFFF;
}
/*500以下になったとき*/
@media only screen and (max-width: 500px) {

#mainBox1200 .Breadcrumb{
    font-size: 10px!important;
    line-height: 1.5em!important;
}
#mainBox1200 .Breadcrumb a{
    font-size: 10px!important;
    line-height: 1.5em!important;
}


#footer p{
  font-size: 11px;
   }
#footernavi{
    margin-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
}   

}
    



/*1200以下のレイアウト*/
@media only screen and (max-width: 1200px) {
    #mainBox1200 {
    width: 90%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}
#mainBox1200 .Breadcrumb{
    font-size: 13px;
}
#ContentsBox{
    width: 100%;
    float: none;
    margin-right: 0px;
    margin-bottom: 50px;
}
#side_base{
    background-color: #EBEBEB;
    padding-top: 7%;
    padding-bottom: 7%;
}
#sideBox{
    width: 550px;
    float: none;
    margin-left: auto;
    margin-right: auto;
    height: auto;
    }
    #sideBox .section{
    width: 550px;
    overflow: hidden; /*floatの解除*/
    position: relative; /*DWで正常にプレビュー*/
    zoom: 1; /*IE6でレイアウト崩れ防止*/
    margin-bottom: 30px;
    }
    
    #sideBox .section .leftBox{
    width: 270px;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    }
    #sideBox .section .rightBox{
    width: 270px;
    float: left;
    margin-bottom: 10px;  
    }
    #sideBox .img_size{
    width: 270px;
    height: 130px;
    }
    #sideBox .img_size02{
    width: 270px;
    height: 160px;
    }
    
    #sideBox .inBox{
    display:none; /*非表示*/
    }
    #sideBox .side_navi_title{
    display:none; /*非表示*/
    }
    
    
/*ブログ・news用サイド*/      
#sideBox02{
    width: 80%;
    height: auto;
    float: none;
    margin-left: auto;
    margin-right: auto;
    }
    
    
    
    #sideBox02 .archives{
    background-color: #FFFFFF;
    }
    
   #sideBox02 .archives ul li{
        margin-bottom: 20px;
      }
    #sideBox02 .archives ul li a{
    text-decoration: underline;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 13px;
    color: #8A8989;
    line-height: 1.7em;  
    }
    
    
    .uk-nav-default{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
    font-size: 14px !important;
   }
    
    #sideBox02 .inBox{
   background-color: #FFFFFF;
    }  
    
} 

/*550以下のバナー*/
@media only screen and (max-width: 550px) {
   #sideBox{
    width: 310px;
    float: none;
    margin-left: auto;
    margin-right: auto;
    }
    
    #sideBox .section{
    width: 310px;
    overflow: hidden; /*floatの解除*/
    position: relative; /*DWで正常にプレビュー*/
    zoom: 1; /*IE6でレイアウト崩れ防止*/
    }
    #sideBox .section .leftBox{
    width: 150px;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    }
    #sideBox .section .rightBox{
    width: 150px;
    float: left;
    margin-bottom: 10px;  
    }
    #sideBox .img_size{
    width: 150px;
    height: 72px;
    }
    #sideBox .img_size02{
    width: 150px;
    height: 89px;
    }


/*サイドバナーシリーズタイトル*/     
#sideBox .side_midashi{
    font-size: 12px;
    }
    
} 
/*700以下になったときコンテンツのマージン調整用*/
@media only screen and (max-width: 700px) {
    #mainBox1200{
    margin-top: -50px;
}
}
    
/***********************************
共通タイポグラフィー設定
***********************************/ 
.contents_title {
    font-family: heisei-mincho-std, serif;
    font-weight: 700;
    font-style: normal;
    color: #736357;
    font-size: 30px;
    border-left-style: solid;
    border-left-width: 7px;
    padding-left: 15px;
    padding-right: 15px;
}
.contents_copy {
    font-family: heisei-mincho-std, serif;
    font-weight: 600;
    font-style: normal;
    color: #736357;
    font-size: 25px;
    line-height: 1.7em;
    letter-spacing: 0.1em;
}

@media only screen and (max-width: 700px) {
.contents_title {
   font-size: 20px;
}
.contents_copy {
   font-size: 18px;
}
}


/*コンテンツ記事本文の文字*/
#ContentsBox .article{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 16px;
    line-height: 2.5em;
}
/*コンテンツ記事本文の文字(行間狭め)*/
#ContentsBox .article02{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 16px;
    line-height: 1.7em;
}

@media only screen and (max-width: 700px) {
#ContentsBox .article{
  font-size: 13px;
    line-height: 2em;
}
/*コンテンツ記事本文の文字(行間狭め)*/
#ContentsBox .article02{
  font-size: 13px;
    line-height: 1.5em;
}
}




/*リボン形作成に必要ここから*/
#ContentsBox .ribbon {
  display: inline-block;
  position: relative;
  height: 40px;/*高さ*/
  line-height: 40px;/*高さ*/
  text-align: center;
  padding: 0 40px 0 18px;/*文字の左右の余白*/
  font-size: 16px;/*文字サイズ*/
  background: #B20031;/*背景色*/
  color: #FFF;/*文字色*/
  box-sizing: border-box;
}
#ContentsBox .ribbon:after {
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 1;
}

#ContentsBox .ribbon:after {
  top: 0;
  right: 0;
  border-width: 20px 15px 20px 0px;
  border-color: transparent #fff transparent transparent;
  border-style: solid;
}
/*リボン形作成に必要ここまで*/


/*グレー太字*/
#ContentsBox .glay_midashi{
    color: #666666;
    font-weight: bold;
    font-size: 19px;
}
/*レッド太字*/
#ContentsBox .red_midashi{
    color: #B20031;
    font-weight: bold;
    font-size: 19px;
}



@media only screen and (max-width: 500px) {
/*グレー太字*/
#ContentsBox .glay_midashi{
    font-size: 15px;
}
/*レッド太字*/
#ContentsBox .red_midashi{
   font-size: 15px;
}
}