@charset "utf-8";

body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
header, footer, hgroup, section, article,
table, th, td, img, form, map, fieldset {
	margin: 0;
	padding: 0;
	border: none;
	color: #343434;
	font-size: 16px;
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	list-style: none;
	/* font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Verdana,"メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",serif; */
	font-family: Helvetica, Arial, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", 游ゴシック, YuGothic, メイリオ, Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}
*, *:before, *:after {
    /*-webkit-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;*/
}
table {border-collapse: collapse;}

.clear:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.bold {font-weight: bold;}
.aka{
	color: #f12c2c;
	font-weight:600;
}

body {
	/*background: #e9e9e9;*/
}
.container {
	width: 100%;
	margin: 0;
}
/*-------------------------------------
ヘッダー
-------------------------------------*/
header {
	width: 100%;
	max-width: 100%;
	background: #dddddd;
}

#header_box {
	width:85%;
	max-width: 85%;
	margin: auto;
}
#header a {
	display:block;
	margin:0 auto 20px;
	text-align: left;
	padding:0 ;

}
.fixed {
	position: fixed;
	top: 0;
	width: 100%;
	margin-bottom:30px;
}
.size600 .ranking-img img{
	width:300px;
}

.mb1{
	margin-bottom: 1em;
}
.mb2{
	margin-bottom: 2em;
}
.mb5{
	margin-bottom: 5em;
}
div#container {
    overflow: hidden;
}
.wrapper {
	max-width: 1080px;
	margin: 25px auto 0;
	display: flex;
	justify-content: space-between;
}
.main {
	width: 70%;
	padding: 0 45px 40px 40px;
	background: #ffffff;
	margin-right: 20px;
	border: 1px solid #ccc;
    border-radius: 0.5em;
    box-shadow: 0 0 3px #ccc;
}

.main h1 {font-size: 2.4em !important;
    line-height: 50px;
    color: #343434;
    margin: 10px 0 50px;
    font-weight: bold;
}
.main h2:nth-of-type(1){
	margin-top: 10px !important;
}
.main h2{
    position: relative;
    color: #003B91;
    font-size: 2em;
    line-height: 1.4em;
    margin: 55px 0 15px;
    font-weight: bold;
    border-bottom: 2px solid;
}

.main h3{
　　position: relative;
    border-bottom: 2px dotted #cbcaca;
    font-weight: bold;
    font-size: 1.7em;
    line-height: 38px;
    margin: 40px 0 15px;
    color: #343434;
    border-left: 6px solid #11B2EC;
    padding-left: 10px;
}
.main p {
	font-size: 16px;
	line-height: 27px;
	margin-bottom: 20px;
	text-align: justify;
}
/*------------------------------------------
パン屑
------------------------------------------*/
#breadcrumb li {
	display: inline;
	font-size:90%;
	font-size: 13px;
	color: #b3b2b2;
}
#breadcrumb li::after{
	content:"\f105";
	font-family: FontAwesome;
	margin: 0 10px;
	color: #343434;
}

#breadcrumb li:last-child:after{
	content:"";
}
#breadcrumb li a {
	color:#003B91;
  text-decoration: none;
}
#breadcrumb li a:hover {
	text-decoration: underline;
	opacity: 0.7;
}
#breadcrumb ul {
	margin: 0;
}
#breadcrumb {
	margin:15px auto 0;
	font-size:90%;
	min-height: 30px;
}
/*-------------------------------------
サイド
-------------------------------------*/
.side {

}

.nav ul li {
	display: flex;
	align-items: flex-start;
	padding: 10px;
	margin-bottom: 0px;
	border-bottom: 1px solid #cfcfcf;
	background:#fff;
}
.nav ul li:first-child {
	padding:15px 10px;
	font-size:100%;
	font-weight:500;
	color:#fff;
	background:#343434;
	border-radius:2px;
	border-bottom: none;
}
.nav ul li:last-child {
	border-bottom: none;
}

.nav ul li a img {
	display: block;
	width: 80px;
	margin-right: 10px;
}
.nav ul li a:hover img {
	opacity: 0.8;
}

.nav ul li h3 a {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 5px;
	line-height: 20px;
}

.nav ul li p {
	font-size: 13px;
	line-height: 18px;
	width: 100%;
}

.side_category {
	margin-bottom:15px;
	background: #ffffff;
}

.side_category h2 {
	font-size: 100%;
	text-align: center;
	color:#fff;
	background:#11B2EC;
	padding:12px;
}

.side_category li a{
	padding:12px 25px 12px 7px;
	line-height:1.4em;
	display:block;
	position: relative;
	color:#343434;
	font-size: 15px;
	font-weight: bold;
	border-bottom: 1px solid #dbdbdb;
  text-decoration: none;
}

.side_category li a:hover{
	color:#8e8e8e;
	text-decoration:none;
}

.side_category li a::after{
	content: "\f138";
	font-family: FontAwesome;
	font-size:80%;
	font-weight:700;
	position:absolute ;
	right:10px;
	color:#003B91;
      top: 50%;
    transform: translateY(-50%);
}
.side_category li a:hover::before{
	right:5px;
	color:#343434;
}


/*-------------------------------------
フッター
-------------------------------------*/
.footer {
	width:100%;
	border-top: 1px solid #dbdbdb;
	margin-top:25px;
}
.copy_right{
    display: block;
    width: 100%;
    text-align: center;
    background: #003B91;
    color: #fff;
    padding: 15px;

}

/*-------------------------------------
リンクテキスト,リンクボタン
-------------------------------------*/
p.text-link {
    margin-bottom: 10px;
    font-weight: bold;
    position: relative;
}
p.text-link a{
	color:#fd5252 !important;
	text-decoration: underline !important;

}
p.text-link a:hover{
	text-decoration: none !important;
	}
p.text-link a:after{
    content: "\f138";
    font-family: FontAwesome;
    color: #fd5252;
    position: absolute;
    margin-left: 10px;
    font-size: 15px;
}

/*-------------------------------------
ページトップ, もくじボタン
-------------------------------------*/
#pagetop {
    position: fixed;
    right: 10px;
    bottom: 10px;
    z-index: 1;
}
#toc-link{
	position: fixed;
	bottom: 100px;
	right: 5px;
	font-size: 77%;
}
#toc-link a {
    background: #343434;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 25px 0;
    text-align: center;
    display: block;
    border-radius: 5px;
	opacity: 0.7;
}
#pagetop a{
    display: block;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    background-color: rgba(0,0,0,0.7);
    width: 60px;
    height: 60px;
    line-height: 56px;
    border-radius: 50%;
    display: block;
    text-decoration: none;
    text-align: center;
}
#pagetop a:before{
	content: '\f106';
    font-family: FontAwesome;
    color: #fff;
    font-size: 36px;
}
#pagetop a:hover, #toc-link a:hover {
     opacity: 0.7;
}

.bl_mt0  {margin-top:      0px !important;}
.bl_mt5  {margin-top:      5px !important;}
.bl_mt10 {margin-top:     10px !important;}
.bl_mt15 {margin-top:     15px !important;}
.bl_mt20 {margin-top:     20px !important;}
.bl_mt30 {margin-top:     30px !important;}
.bl_mt40 {margin-top:     40px !important;}
.bl_mt50 {margin-top:     50px !important;}
.bl_mb0  {margin-bottom:   0px !important;}
.bl_mb5  {margin-bottom:   5px !important;}
.bl_mb10 {margin-bottom:  10px !important;}
.bl_mb15 {margin-bottom:  15px !important;}
.bl_mb20 {margin-bottom:  20px !important;}
.bl_mb30 {margin-bottom:  30px !important;}
.bl_mb40 {margin-bottom:  40px !important;}
.bl_mb50 {margin-bottom:  50px !important;}
.bl_ml0  {margin-left:     0px !important;}
.bl_ml5  {margin-left:     5px !important;}
.bl_ml10 {margin-left:    10px !important;}
.bl_ml15 {margin-left:    15px !important;}
.bl_ml20 {margin-left:    20px !important;}
.bl_ml20 {margin-left:    20px !important;}
.bl_ml20 {margin-left:    20px !important;}
.bl_ml20 {margin-left:    20px !important;}
.bl_mr0  {margin-right:    0px !important;}
.bl_mr5  {margin-right:    5px !important;}
.bl_mr10 {margin-right:   10px !important;}
.bl_mr15 {margin-right:   15px !important;}
.bl_mr20 {margin-right:   20px !important;}
.bl_mr20 {margin-right:   30px !important;}
.bl_mr20 {margin-right:   40px !important;}
.bl_mr20 {margin-right:   50px !important;}


/*追加CSS*/
.bk_red{background: #ea3030!important;}
.bk_red2{background: #ffcaca!important;}
.bk_red3{background: #ff1212!important;}
.bk_pink{background: #fefcf4!important;}
.bk_blue{background: #0d44e1!important;}
.bk_yellow{background: #ff6!important;}
.fc_white{color: #FFF!important;}
.fc_orange{color:#ed8928 !important;}
.fbl{font-weight: bold;}
.fs13{font-size: 13px!important;}
.fs14{font-size: 14px!important;}
.fs15{font-size: 15px!important;}
.fs16{font-size: 16px!important;}
.fs18{font-size: 18px!important;}
.fs20{font-size: 20px!important;font-weight: bold;}
.fwb_s18{font-weight: bold;font-size: 18px;}
.txt_center{text-align: center!important;}


/*レスポンシブ追加*/
#toc-link{
  z-index: 10;
}

header#boxheader {
  background: #fff;
  z-index: 100 !important;
}

.header-box {
  max-width: 1080px;
  margin: 0 auto;
  padding: 25px 0;
}

element.style {
}
.header-box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border-bottom: 1px solid #ccc;
}
.logo {
  max-width: 29%;
}

.logo img {
  max-width: 100%;
}
.pc-menu{
  width: 25%;
    max-width: 25%;
}

@media screen and (max-width:960px) {
  .scrollbox.sidefixa {
    margin-bottom: 100px;
}
  header {
  width: 100%;
  background-color: #f390b9;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}
  .wrapper {
    width: 95%;
    margin: 15px auto;
    max-width: 100%
  }
  .pc-menu {
    display: none;
  }
  .main {
    width: 100% !important;
    width: 100% !important;
    padding: 0 20px 20px;
    margin-right: 0px !important;
    margin-top: 75px;
  }
}

@media screen and (max-width:960px) {
  .logo img{
    max-height: 62px;
    max-width: none !important;
  }
  header#boxheader {
    z-index: 1;
    top:0;
  }
  .header-box {
    max-width: 100% !important;
    display: block;
    text-align: center;
  }
  .logo {
    max-width: 100% !important;
    z-index: 16;
    max-height: 60px;
  }
  .navmanu {
    display: none;
  }
  div#footer_link {
    column-count: 1 !important;
    column-gap: 0.8rem;
    orphans: 1;
    widows: 1;
  }
  #footer_link {
    width: 95%;
  }
  .footer_link_box-item {
    width: 100%;
  }
}
@media screen and (min-width: 961px) {
         .sp-menu,#menu_btn,div#menu,.menu-background{
          display: none !important;
         }

  }
@media screen and (max-width: 960px) {
  .header-box{
        padding: 8px 0 !important;
  }
	.sitelink a{
		width: 100%;
	}
	         .fixed2{
  position: fixed;
  max-width: 100%;
}
	#breadcrumb{
		width: 95% !important;
	}
    .logo img {
    max-height: 46px !important;
  }
  .side_category h2{
    margin-bottom: 0;
  }
  .side_category{
    margin-bottom: 0;
  }
    .wrapper{
    /*margin-top: 95px;*/
  }
}
@media screen and (max-width: 600px) {
   .main{
    margin-top: 60px !important;
   }
   .main h1{
    font-size: 1.7em !important;
    margin-bottom: 15px;
    line-height: 35px;

   }
   .main h2{
    font-size: 1.55em;
   }
   .main h3{
   	font-size: 1.3em;
   }
   .main h4{
   	font-size: 17px;
   	}
   .wrapper{
   	padding: 15px 0 !important;
    max-width: 100%

   }
   .main{
   	padding: 0 15px 20px !important;
   }
  }
/*レスポ追加*/
/*---------- #menu ----------*/
#menu {
  width: 100%;
  max-width: 85%;
  height: 100%;
  background-color: #fff;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
  transform: translate(101%);
  transition: all .5s;
  overflow: auto;
  margin-top: 66px;
}
#menu.open {
  transform: translate(0);
}
#menu ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
#menu_btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 7px;
  color: #fff;
  border-radius: 5px;
  padding: 6px 7px;
  background-color: #003B91;
  cursor: pointer;
  font-size: 14px;
}
/* --- .menu-background --- */
.menu-background {
  position: fixed;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 0;
  height: 0;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 2;
  opacity: 0;
  transition: opacity 0.5s;
}
.menu-background.open {
  width: 100%;
  height: 100%;
  opacity: 1;
}
