@charset "UTF-8";

/* 見出し表示 */

h2.midashi
{
  padding: 0.8rem;
  padding-left:0;
  border-bottom:#8FC31F 2px solid;
  font-weight: bolder;
  font-size: 2rem!important;
  color: #8FC31F !important;
  margin: 4% 0% 2%!important;
}

h3.midashi {
    padding: 1rem 1rem;
    border-bottom: 3px solid #8FC31F;
    background: #8FC31F;
    font-weight: bolder;
    color: #fff;
    border: rgb(176,157,96) 1px solid;
    font-size: 1.4rem!important;
    margin: 4% 0%  2% !important;
    position: relative;
    padding-left: 25px;
}
h3.midashi:before {
    content: "";
    background: rgb(176,157,96);
    width: 6px;
    height: 37px;
    position: absolute;
    top: 50%;
    left: 1%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}
@media screen and (max-width: 767px){
  h3.midashi {
    font-size: 1.2rem!important;
    padding-left:10px;
  }
  h3.midashi:before {
   display:none;
  }
}

h4.midashi  {
  position: relative;
  padding: 0rem 0rem 0.5rem 0rem;
  border-bottom: 4px solid #8FC31F;
  font-weight: bolder;
  font-size: 1.2rem;
  margin: 2% 0%;
}
 
h4.midashi::after {
  padding: 0.5rem 0.5rem;
  position: absolute;
  content: " ";
  border-bottom: solid 4px #8FC31F;
  bottom: -4px;
  width:20%;
  display: block;
}
@media screen and (max-width: 767px){
  h4.midashi {
    font-size: 1.1rem!important;
  }
}

h5.midashi {
  font-size: 16px; 
  font-weight:  bold;
  color: #8FC31F;
  padding: 0.5rem 0rem;
}


/* 段落表示 */

.dummy-area ul.m-list li { 
padding-left: 1em; 
text-indent: -1em; 
margin-top: 0.5rem;
margin-bottom: 0.5rem;
line-height: 2.0em;
}

/* 注意書きBOX */

.flame1 {
padding: 1rem;
margin-bottom: 3rem;
background: #f3eeee
} 

/* リンクボタン */

.button1 a {
  background: #f4f4f4;
  border: #8FC31F 1px solid;
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin-top: 1rem;
  margin-bottom: 1rem;
  max-width: 100%;
  padding: 0.7rem 1rem;
  transition: 0.3s ease-in-out;
  font-weight: bold;
  font-size: 14px;
}

.button1 a:hover {
  background: #717070;
  color: #FFF;
}

.button1 a:after {
    content: '';
    width: 10px;
    height: 10px;
    border-top: 3px solid #8FC31F;
    border-right: 3px solid #8FC31F;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
.button1 a:hover:after {
    border-color: #8FC31F;
}

/* シーズンカーディング */
.game-card{
    padding: 0.5em 1em;
    margin: 1em 0;
    align-items: center;
    justify-content: left;
    display: flex;
    font-family: "abolition",sans-serif;
}
.game-card:before {
    font-size: 20px;
    color: #fff;
    top: 50%;
    left: 0%;
    transform: rotate(-90deg);
    margin-left: -72px;
    letter-spacing:3px;
}
.layout-content .second-body .game-card p{
  margin-left:-8px;
  width:99%;
  margin-bottom:0;
}

.homebox {
    color: #232323;
    background: #8FC31F;
    border: solid 8px #000;
    border-left: solid 26px #000;
}
.homebox:before {
    content: "HOME GAME";
}

.game-date{
  font-size:24px;
  font-weight:bold;
  font-family: "abolition",sans-serif;
  line-height:1.4;
  letter-spacing:1.6px;
}
.game-date span{
  font-size:14px;
  color:#fff; 
  padding:2px 2px;
  margin:4px;
}
.game-date span.sat{
  background:#3E1E87;
}
.game-date span.sun{
  background:#DE3139;
}
.game-date span.nor{
  background:#B2A88C;
}
.game-number{
  display:block;
}
.game-opponent{
  font-size:22px;
  display:block;
  line-height:1.6;
  margin-bottom:6px;
}
.game-venue{
  display:block;
  border-top:1px solid #333;
  padding-top:7px;
  font-family:sans-serif;
}


.awaybox {
    color: #232323;
    background: #f4f4f4;
    border: solid 8px #999999;
    border-left: solid 26px #999999;
}
.awaybox:before {
    content: "AWAY GAME";
}
.awaybox.sample:before,.homebox.sample:before{
  display:none;
}
@media screen and (max-width: 1500px){
  .awaybox:before {
    content: "AWAY";
    margin-left: -49px;
}
.homebox:before {
    content: "HOME";
    margin-left: -49px;
}
.layout-content .second-body .game-card p{
  margin-left:2px;
}
.game-opponent{
  font-size:18px;
}
}
@media screen and (max-width: 767px){
  .awaybox:before {
    margin-left: -53px;
}
.homebox:before {
    margin-left: -53px;
}
.game-card{
  padding-right:0;
}
}

/* 見出し表示（従来） */

h3.midashi2
{
  padding: 0.3rem 0.5rem;
  background: #f4f4f4;
  border: solid 1px #b4b4b4;
  font-size: 11px;
  font-weight: bolder;
}

/* GAME REPORT */


/*タブ切り替え全体のスタイル-1*/

.gametabs {
  background-color: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  width: 100%;
  }

/*タブのスタイル*/
.gametab_item {
  width: calc(100%/3);
  height: 100%;
  border-bottom: 3px solid #8FC31F;
  background-color: #f4f4f4;
  line-height: 30px;
  font-size: 11px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.gametab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="gametab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.gametab_content {
  display: none;
  padding: 0.3rem;
  clear: both;
  overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#all:checked ~ #all_content,
#programming:checked ~ #programming_content,
#design:checked ~ #design_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.gametabs input:checked + .gametab_item {
  background-color: #8FC31F;
  color: #fff;
}

/*タブ切り替え全体のスタイル-2*/

.gametabs2 {
  background-color: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  width: 100%;
  }

/*タブのスタイル*/
.gametab2_item {
  width: calc(100%/3);
  height: 100%;
  border-bottom: 3px solid #8FC31F;
  background-color: #f4f4f4;
  line-height: 30px;
  font-size: 11px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.gametab2_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="gametab2_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.gametab2_content {
  display: none;
  padding: 0.3rem;
  clear: both;
  overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#all2:checked ~ #all2_content,
#programming2:checked ~ #programming2_content,
#design2:checked ~ #design2_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.gametabs2 input:checked + .gametab2_item {
  background-color: #8FC31F;
  color: #fff;
}

/*タブ切り替え全体のスタイル-3*/

.gametabs3 {
  background-color: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  width: 100%;
  }

/*タブのスタイル*/
.gametab3_item {
  width: calc(100%/3);
  height: 100%;
  border-bottom: 3px solid #8FC31F;
  background-color: #f4f4f4;
  line-height: 30px;
  font-size: 11px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.gametab3_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="gametab3_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.gametab3_content {
  display: none;
  padding: 0.3rem;
  clear: both;
  overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#all3:checked ~ #all3_content,
#programming3:checked ~ #programming3_content,
#design3:checked ~ #design3_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.gametabs3 input:checked + .gametab3_item {
  background-color: #8FC31F;
  color: #fff;
}

/*タブ切り替え全体のスタイル-4*/

.gametabs4 {
  background-color: #fff;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
  width: 100%;
  }

/*タブのスタイル*/
.gametab4_item {
  width: calc(100%/3);
  height: 100%;
  border-bottom: 3px solid #8FC31F;
  background-color: #f4f4f4;
  line-height: 30px;
  font-size: 11px;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.gametab4_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="gametab4_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.gametab4_content {
  display: none;
  padding: 0.3rem;
  clear: both;
  overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#all4:checked ~ #all4_content,
#programming4:checked ~ #programming4_content,
#design4:checked ~ #design4_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.gametabs4 input:checked + .gametab4_item {
  background-color: #8FC31F;
  color: #fff;
}


/*テーブル*/
.normaltable {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin-top: 2%;
  margin-bottom: 4%;
}

.normaltable th{
  padding: 0.5em 0.5em;
  background-color: #F4f4f4;
  border-color: #999999;
  border-style: solid;
 border-width: 1px 0;
  font-weight: bolder;
  vertical-align: middle;
  text-align: center;
  width: 35%
}

.normaltable td{
  padding: 0.5rem;
  vertical-align: middle;
  border-color: #999999;
  border-style: solid;
 border-width: 1px 0;
}


/*注意書き*/
.attentionbox{
  position: relative;
  padding: 3rem 1rem 1rem 1rem;
  margin-bottom: 2rem ;
  background: #f4f4f4;
  border: solid 2px #3E1E87;
  }

  .attentionbox .box1 {
    position: absolute;
    display: block;
    top: 0.5rem;
    left: 0.5rem;
    padding: 0.5rem;
    height: 1rempx;
    line-height: 1rem;
    font-size: 14px;
    background: #3E1E87;
    color: #ffffff;
    font-weight: bold;
  }
  .tsuikibox{
    position: relative;
    padding: 3rem 1rem 1rem 1rem;
    margin-bottom: 2rem ;
    border: solid 2px #8FC31F;
    font-size: 13px; !important
    }
  
    .tsuikibox .box2 {
      position: absolute;
      display: block;
      top: 0.5rem;
      left: 0.5rem;
      padding: 0.5rem;
      height: 1rempx;
      line-height: 1rem;
      font-size: 14px;
      background: #8FC31F;
      color: #ffffff;
      font-weight: bold;
    }
/*画像*/
.image-box{
  margin-bottom:1rem;
  width:100%;
}
.image-box img{
  width:100%;
}

/*画像右寄せ・左寄せ*/
div.leftImg,
div.rightImg{
  margin-bottom:4rem;
}
div.leftImg p,
div.rightImg p{
  margin-bottom:1rem;
}

div.leftImg .img{
	float: left;
	margin-right: 30px;
	width: 35%;
  margin-bottom:1rem;
}
div.leftImg img{
	width: 100%;
	height: auto;
}
div.rightImg .img{
	float: right;
	margin-left: 30px;
	width: 35%;
  margin-bottom:1rem;
}
div.rightImg img{
	width: 100%;
	height: auto;
}

@media screen and (max-width: 767px){
  div.leftImg .img,
  div.rightImg .img{
	  float: inherit;
	  margin:0 auto 1rem;
	  width: 100%;
  }
}

/*2列の表*/
.profile-table {
    max-width: 1000px;
    margin: auto;
    margin-bottom:2rem;
    width: 100%;
    border-collapse: collapse;
    border-top: 1px solid #CED0D6;
    border-left: 1px solid #CED0D6;

}
.profile-table  tr th,
.profile-table  tr td {
    border-right: 1px solid #CED0D6;
    border-bottom: 1px solid #CED0D6;
    padding: 20px;
    font-size: 16px;
}
.profile-table  tr th{
    vertical-align: top;
    width: 22.5%;
    background: #8FC31F;
    color:#fff;
    vertical-align: middle;
}
.profile-table  tr td{
    background-color: #fff;
    width: 77.5%;
}
.profile-table p{
    margin: 0;
}

@media screen and (max-width: 767px){
  .profile-table  tr th{
    display: block;
    width: 100%;
    text-align: center;
  }
  .profile-table  tr th,
  .profile-table  tr td {
    box-sizing: border-box;
  }
  .profile-table  tr td{
    display: block;
    width: 100%;
  }
}

/*アコーディオン*/
.toggle {
	display: none;
}
.Label {		/*タイトル*/
	padding: 1rem!important;
	display: block;
  font-size:1rem;
	color: #8FC31F;
  border:2px solid #8FC31F;
	background: #f5f5f5;
  position:relative;
}
.Label::before{		/*タイトル横の矢印*/
	content:"";
	width: 6px;
	height: 6px;
	border-top: 2px solid #8FC31F;
	border-right: 2px solid #8FC31F;
	-webkit-transform: rotate(45deg);
	position: absolute;
	top:calc( 50% - 3px );
	right: 20px;
	transform: rotate(135deg);
}
.Label,
.content {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	transform: translateZ(0);
	transition: all 0.3s;
}
.content {		/*本文*/
	height: 0;
	margin-bottom:10px;
	padding:0 20px;
	overflow: hidden;
}
.toggle:checked + .Label + .content {	/*開閉時*/
	height: auto;
	padding:20px ;
	transition: all .3s;
}
.toggle:checked + .Label::before {
	transform: rotate(-45deg) !important;
}
.code{
  margin-bottom:4rem;
}
.code .Label{
  width:150px;
  background:#ddd;
  color:#000;
  border:0px;
  font-size:14px;
  text-align:center;
  padding: 0.5rem!important;
}
.code .Label::before{
  display:none;
}
.code div.content p{
  margin-top:2rem;
}
/*コンバージョンボタン*/
.miniConversion {
    margin: 25px auto;
    width: 80%;
    max-width: 800px;
    text-align: center;
}
.miniConversion a {
    background: #3E1E87;
    color: #fff!important;
    padding: 1rem;
    font-size: 1.4rem;
    display: block;
    text-decoration: none;
    font-weight:bold;
    border-radius:4px;
    box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5), inset 0px -3px 6px -2px rgba(0, 0, 0, 0.3);
    transition: all 0.5s!important;
}
.miniConversion a:hover {
    transform: translateY(4px);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5), inset 0px -3px 4px -2px rgba(0, 0, 0, 0.3);
    opacity: 0.7;
}
@media screen and (max-width: 767px){
  .miniConversion a {
      padding: 1rem;
      font-size: 1.2rem;
  }
}
.block-topbnr{
  margin-bottom: -6px;
}
.block-topbnr a{
  transition:0.5s;
  display:block;
}
.block-topbnr a:hover{
  opacity:0.5;
}
.block-topbnr img{
  width:100%;
}

.layout-content .second-body p {
    margin-bottom: 30px;
    line-height: 2.4;
}
@media screen and (max-width: 767px) {
    .layout-content .second-body p {
        margin-bottom: 30px;
        line-height: 1.6;
    }
    .layout-sponsors li{
      width: 44%;
    }
}