/*!
 * Start Bootstrap - Logo Nav HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
	font-size:small;
	font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    padding-top: 70px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
}

.navbar-fixed-top .nav {
    padding: 15px 0;
}

.navbar-fixed-top .navbar-brand {
    padding: 0 15px;
}


@media(min-width:768px) {
    body {
        padding-top: 100px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
    }

    .navbar-fixed-top .navbar-brand {
        padding: 15px 0;
    }
}


/*---------------------*/
/*余白の設定*/
/*---------------------*/
.clear{ clear:both; }
.left{ float:left;  }
.right{ float:right; }

.mgB0{   margin-bottom:0px;  }
.mgB5{   margin-bottom:5px;  }
.mgB10{  margin-bottom:10px; }
.mgB15{  margin-bottom:15px; }
.mgB20{  margin-bottom:20px; }
.mgB30{  margin-bottom:30px; }
.mgB40{  margin-bottom:40px; }
.mgB50{  margin-bottom:50px; }
.mgB60{  margin-bottom:60px; }

.mgT0{   margin-top:0px;  }
.mgT5{   margin-top:5px;  }
.mgT10{  margin-top:10px; }
.mgT15{  margin-top:15px; }
.mgT20{  margin-top:20px; }
.mgT30{  margin-top:30px; }
.mgT40{  margin-top:40px; }
.mgT50{  margin-top:50px; }

.mgR0{   margin-right:0px;  }
.mgR5{   margin-right:5px;  }
.mgR10{  margin-right:10px; }
.mgR15{  margin-right:15px; }
.mgR20{  margin-right:20px; }
.mgR30{  margin-right:30px; }
.mgR40{  margin-right:40px; }
.mgR50{  margin-right:50px; }

.mgL0{   margin-left:0px;  }
.mgL5{   margin-left:5px;  }
.mgL10{  margin-left:10px; }
.mgL15{  margin-left:15px; }
.mgL20{  margin-left:20px; }
.mgL30{  margin-left:30px; }
.mgL40{  margin-left:40px; }
.mgL50{  margin-left:50px; }

.pdgB0{   padding-bottom:0px;  }
.pdgB5{   padding-bottom:5px;  }
.pdgB10{  padding-bottom:10px; }
.pdgB15{  padding-bottom:15px; }
.pdgB20{  padding-bottom:20px; }
.pdgB30{  padding-bottom:30px; }
.pdgB40{  padding-bottom:40px; }
.pdgB50{  padding-bottom:50px; }

.pdgT0{   padding-top:0px;  }
.pdgT5{   padding-top:5px;  }
.pdgT10{  padding-top:10px; }
.pdgT15{  padding-top:15px; }
.pdgT20{  padding-top:20px; }
.pdgT30{  padding-top:30px; }
.pdgT40{  padding-top:40px; }
.pdgT50{  padding-top:50px; }

.pdgR0{   padding-right:0px;  }
.pdgR5{   padding-right:5px;  }
.pdgR10{  padding-right:10px; }
.pdgR15{  padding-right:15px; }
.pdgR20{  padding-right:20px; }
.pdgR30{  padding-right:30px; }
.pdgR40{  padding-right:40px; }
.pdgR50{  padding-right:50px; }

.pdgL0{   padding-left:0px;  }
.pdgL5{   padding-left:5px;  }
.pdgL10{  padding-left:10px; }
.pdgL15{  padding-left:15px; }
.pdgL20{  padding-left:20px; }
.pdgL30{  padding-left:30px; }
.pdgL40{  padding-left:40px; }
.pdgL50{  padding-left:50px; }


/*---------------------*/
/*テキスト指定*/
/*---------------------*/
.strong{font-weight:bold;}

.font8{ font-size: 80%; }
.font10{ font-size: 100%; }
.font12{ font-size: 120%; line-height:1.2em; }
.font14{ font-size: 140%; line-height:1.4em; }
.font16{ font-size: 160%; line-height:1.6em; }
.font18{ font-size: 180%; line-height:1.8em; }
.font20{ font-size: 200%; line-height:2em; }


/*---------------------*/
/*カラー指定*/
/*---------------------*/
.crn-grn {color:#107B3A;}
.crn-gry {color:#535652;}
.red {color:#d61826;}
.org {color:#FF6600;}
.bl {color:#003366;}
.light-bl {color:#4444FF;}
.brn {color:#AF5818;}
.bg-gry {background-color:#F3F3F3; padding:10px;}
.gry {color:#444444;;}


/*---------------------*/
/*トピックスのレイアウト設定*/
/*---------------------*/
.topics{
    line-height: 1.2;
    padding: 3px 3px 5px;
    margin: 4px 0;
    border-bottom: 1px dashed #CCC;
    padding-left:1em;
    text-indent:-1em;
}

.update{
    color:#CC0000;
    font-size:10px;
}


/*---------------------*/
/*各デバイスでの表示切替*/
/*---------------------*/
.sp {display: none;}/*only SP*/
.tab {display: none;}/*only TAB*/
.pc {display: block;}/*only PC*/

@media screen and (max-width: 1199px) {
.sp {display: none;}
.tab {display: none;}
.pc {display: block;}
}

@media screen and (max-width: 991px) {
.sp {display: none;}
.pc {display: none;}
.tab {display: block;}
}

@media screen and (max-width: 767px) {
.tab {display: none;}
.pc {display: none;}
.sp {display: block;}
}


/*---------------------*/
/*イメージ*/
/*---------------------*/
.imgL{float:left; padding:2px;}
.imgLB{float:left; padding:2px; margin:5px; border:1px solid #CCC;}
.imgR{float:right; padding:2px;}
.imgRB{float:right; padding:2px; margin:5px; border:1px solid #CCC;}
.imgB{padding:2px; border:1px solid #CCC;}
.img{padding:2px;}
.img0{padding:0px;}


.image {
    position: absolute;
    bottom: 0;
}


/*---------------------*/
/*ページタイトル（大）*/
/*---------------------*/
.contents-ttl {
	background-image: url(../images/bg_ttl.png);
	background-position: top left;
	background-repeat: repeat;
}
.contents-ttl h1,
.contents-ttl h2,
.contents-ttl h3,
.contents-ttl h4 {
	text-align: left;
	line-height: 1em;
}

.contents-ttl h1 span,
.contents-ttl h2 span,
.contents-ttl h3 span,
.contents-ttl h4 span {
	display: inline-block;
	padding: 1em 2em;
	background-image: url(../images/line_ttl.png);
	background-position: top left;
	background-repeat: no-repeat;
}


/*---------------------*/
/*ページタイトル（小）*/
/*---------------------*/
.second-ttl {
	padding: 1em 1em;
	text-align: center;
	background-image: url(../images/line_ttl.png);
    margin: 0 0 20px;
}
.second-ttl span {
	font-size:16px;
	color: #fff;
	line-height: 1em;
	text-align: center;
	margin: 0 auto;
}


/*---------------------*/
/*タイトル*/
/*---------------------*/
.third-ttl {
    padding:3px 6px;
	background:#FFFFFF;
	border-color:#FFFFFF #FFFFFF #e3e3e3 #e3e3e3;
	border-width:1px 1px 1px 5px;
	border-style:solid;
	margin:20px 0;
}

.third-ttl-red {
    padding:3px 6px;
	background:#FFFFFF;
	border-color:#FFFFFF #FFFFFF #F5A5A9 #F5A5A9;
	border-width:1px 1px 1px 5px;
	border-style:solid;
	margin:20px 0;
}

/*---------------------*/
/*タイトル*/
/*---------------------*/
.topics-header {
    padding-bottom: 9px;
    margin: 20px 0 20px;
    border-bottom: 1px solid #535652
}


/*---------------------*/
/*馬具紹介タイトルナビ*/
/*---------------------*/
.page-anchor ul {
	display: table;
	border: solid 1px #107B3A;
	border-collapse: collapse;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.page-anchor ul li {
	position: relative;
	display: table-cell;
	line-height: 1em;
	border-right: solid 1px #107B3A;
}
.page-anchor ul li a:link,
.page-anchor ul li a:visited {
	color: #107B3A;
	text-decoration: none;
	display: block;
	vertical-align: middle;
	padding: 15px;
	/*↓グラデ*/
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 49%, #f5f5f5 50%, #f5f5f5 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#ffffff), color-stop(50%,#f5f5f5), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 49%,#f5f5f5 50%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#ffffff 49%,#f5f5f5 50%,#f5f5f5 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#ffffff 49%,#f5f5f5 50%,#f5f5f5 100%); /* IE10+ */
	background: linear-gradient(to bottom, #ffffff 0%,#ffffff 49%,#f5f5f5 50%,#f5f5f5 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.bladient( startColorstr='#ffffff', endColorstr='#f5f5f5',GradientType=0 ); /* IE6-9 */
}
.page-anchor ul li a:hover {
	background-color: #EDFFE8;
	background-image: none;
}
@media screen and (max-width: 768px) {
.page-anchor ul {
	padding: 0;
	display: block;
	width: 95%;
}
.page-anchor ul li {
	display: block;
	width: 100%;
	border-bottom: solid 1px #107B3A;
	border-right: none;
}
.page-anchor ul li:last-child {
	border-bottom: none;
}
}


/*---------------------*/
/*段落の字下げ・行間*/
/*---------------------*/
.one-em{
	padding-left: 1em;
	line-height: 1.4;
}
.two-em{
	padding-left: 2em;
	line-height: 1.4;
}


/*---------------------*/
/*グリーン＆グレーの下線*/
/*---------------------*/
.line {
	margin-bottom: 15px;
	background: url(../course/images/line.gif) bottom left no-repeat;
	padding-bottom: 15px;
}


/*---------------------*/
/*リスト*/
/*---------------------*/
.list {
	list-style:outside;
	margin-top: -20px;
	margin-bottom: 20px;
}
.list li{
	line-height: 2.5em;
	border-bottom: dotted 1px #B5B2B2;
}

/*---------------------*/
/*リスト＿レッスン内容*/
/*---------------------*/
.substance {
	margin-top: 10px;
	margin-left: -20px;
	margin-bottom: 10px;
}

.substance-ol {
	margin-left: -20px;
	margin-bottom: 10px;
}

.substance-arrow {
	margin-top: 10px;
	margin-left: -40px;
	margin-bottom: 10px;
	list-style: none;
}





/*---------------------*/
/*追加スタイル*/
/*---------------------*/

/*---スマホメニュー---*/
.sp .list-group .list-group-item a {
  display: block;
}

/*---ワイド指定---*/
.wid33 { width: 33.33333%; }
.wid50 { width: 50%; }

/*---位置指定---*/
.txtR { text-align: right; }
.txtL { text-align: left; }
.txtC { text-align: center; }

/*---ボーダー---*/
.point { border: 3px double #A0C13E; padding: 10px; }
.bodDBL { border: 3px double transparent; padding: 10px; }
.bodSLD { border: 1px solid transparent; padding: 10px; }
.bodDTD { border: 1px dotted transparent; padding: 10px; }

.bodC-grn { border-color: #A0C13E; }
.bodC-red { border-color: #d61826; }
.bodC-blu { border-color: #5089E4; }

/*---矢印---*/
#arrow-box {
  position: relative;
  height: 220px;
  margin-bottom: 26px;
}

#arrow-text {
  float: left;
  width: 75%
}

#arrow-triangle {
  position: relative;
  float: left;
  top: 99%;
  left: -24px;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  border-top-color: #d61826;
  border-bottom: none;
}

#arrow-square {
  float: left;
  width: 16px;
  height: 100%;
  background-color: #d61826;
  margin-left: 10px;
}

/*---スタイル崩壊防止用---*/
div:after {
  content: "";
  clear: both;
  display: block;
}

.press img {
  max-width: 33.33333%;
}

.widM65 { max-width: 65%; }

.sit img { max-width: 25%; }

@media screen and (min-width : 768px) {
  .sit img { margin-right: 10px; }
}

@media screen and (max-width : 480px) {
  #arrow-box {
    height: 250px;
  }
}

@media screen and (max-width : 420px) {
  #arrow-box {
    height: 290px;
  }
}

@media screen and (max-width : 370px) {
  #arrow-box {
    height: 320px;
  }
}