@charset "utf-8";
/* CSS Document */

*{
		margin: 0;
		padding: 0;
	    font-family:"メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3","HIragino Kaku Gothic Pro W3","HIragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
}

label.panel-label {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  display: block;
  width: 100%;
  color: #2B2B2B;
  cursor: pointer;
  background-color: #ecf0f1;
  -webkit-transition-property: background-color, color;
  transition-property: background-color, color;
  -webkit-transition-duration: 200ms;
  transition-duration: 200ms;
}

label.panel-label:hover {
  /*color: #003399;*/
}

#panels {
  background-color: #FEFFF6;
  border: solid 2px #F55F06;
  height: 320px;
  margin-bottom: 10px;
  /*width: 100%;*/	 
  }

#panels .container {
  margin: 0 auto;
  width: 98%;
}

#panels section header label.panel-label {
  padding: 0.02% 0.04%;
  box-sizing: border-box;
}

#panels section .main {
　display: none;/*ieバグ*/
  box-sizing: border-box;
  max-height: 0;
  opacity: 0;
  -webkit-transition: opacity 600ms;
  transition: opacity 600ms;
  overflow-y: hidden;
}


#panel-1-ctrl:checked ~ #panels #panel-1 .main {
  max-height: none;
  opacity: 1;
  padding: 0.02%;
　display: inline;
  overflow: hidden;
}

#panel-2-ctrl:checked ~ #panels #panel-2 .main {
  max-height: none;
  opacity: 1;
  padding: 0.02%;
　display: inline;
  overflow: hidden;
}

#panel-3-ctrl:checked ~ #panels #panel-3 .main {
  max-height: none;
  opacity: 1;
  padding: 0.02%;
　display: inline;
  overflow: hidden;
}

#panel-4-ctrl:checked ~ #panels #panel-4 .main {
  max-height: none;
  opacity: 1;
  padding: 0.02%;
　display: inline;
  overflow: hidden;
}

#panel-5-ctrl:checked ~ #panels #panel-5 .main {
  max-height: none;
  opacity: 1;
  padding: 0.02%;
　display: inline;
  overflow: hidden;
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 {
  /*pointer-events: none;
  cursor: default;*/
  /*-webkit-transform: translate3d(0, 1px, 0);*/
          /*transform: translate3d(0, 1px, 0);*/
  /*box-shadow: none;*/
  /*border-right: none;*/
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1.last {
  border-right: 1px solid transparent;
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 + li {
  border-left: 1px solid #dfdfdf;
}

#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label {
  background-color: #D71013;
  color: #fff;
  /*padding-top: 30%;*/
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 label.panel-label::after {
  height: 10%;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 {
  /*pointer-events: none;
  cursor: default;*/
  /*-webkit-transform: translate3d(0, 1px, 0);*/
          /*transform: translate3d(0, 1px, 0);*/
  /*box-shadow: none;*/
  /*border-right: none;*/
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2.last {
  border-right: 1px solid transparent;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 + li {
  border-left: 1px solid #dfdfdf;
}

#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label {
  background-color: #D71013;
  color: #fff;
 /* padding-top: 30%;*/
}
#panel-2-ctrl:checked ~ #tabs-list #li-for-panel-2 label.panel-label::after {
  height: 10%;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 {
  /*pointer-events: none;
  cursor: default;*/
  /*-webkit-transform: translate3d(0, 1px, 0);*/
          /*transform: translate3d(0, 1px, 0);*/
  /*box-shadow: none;*/
  /*border-right: none;*/
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3.last {
  border-right: 1px solid transparent;
}
#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 + li {
  border-left: 1px solid #dfdfdf;
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label {
  background-color: #D71013;
  color: #fff;
  /*padding-top: 30%;*/
}

#panel-3-ctrl:checked ~ #tabs-list #li-for-panel-3 label.panel-label::after {
  height: 10%;
}	

#panel-4-ctrl:checked ~ #tabs-list #li-for-panel-4 {
  /*pointer-events: none;
  cursor: default;*/
  /*-webkit-transform: translate3d(0, 1px, 0);*/
          /*transform: translate3d(0, 1px, 0);*/
  /*box-shadow: none;*/
  /*border-right: none;*/
}

#panel-4-ctrl:checked ~ #tabs-list #li-for-panel-4.last {
  border-right: 1px solid transparent;
}
#panel-4-ctrl:checked ~ #tabs-list #li-for-panel-4 + li {
  border-left: 1px solid #dfdfdf;
}

#panel-4-ctrl:checked ~ #tabs-list #li-for-panel-4 label.panel-label {
  background-color: #D71013;
  color: #fff;
  /*padding-top: 30%;*/
}

#panel-4-ctrl:checked ~ #tabs-list #li-for-panel-4 label.panel-label::after {
  height: 10%;
}

#panel-5-ctrl:checked ~ #tabs-list #li-for-panel-5 {
  /*pointer-events: none;
  cursor: default;*/
  /*-webkit-transform: translate3d(0, 1px, 0);*/
          /*transform: translate3d(0, 1px, 0);*/
  /*box-shadow: none;*/
  /*border-right: none;*/
}

#panel-5-ctrl:checked ~ #tabs-list #li-for-panel-5.last {
  border-right: 1px solid transparent;
}
#panel-5-ctrl:checked ~ #tabs-list #li-for-panel-5 + li {
  border-left: 1px solid #dfdfdf;
}

#panel-5-ctrl:checked ~ #tabs-list #li-for-panel-5 label.panel-label {
  background-color: #D71013;
  color: #fff;
  /*padding-top: 30%;*/
}

#panel-5-ctrl:checked ~ #tabs-list #li-for-panel-5 label.panel-label::after {
  height: 10%;
}	

ul#tabs-list {
  display: flex;
  /*justify-content: center;*/
  list-style: none;
  text-align: center;
  /*border-bottom: 1px solid #dfdfdf;*/
  margin: 0;
  padding: 0;
  text-align: center;
  /*border-bottom: 1px solid #dfdfdf;*/
 margin-top: 2%;
 width: 99.8%;
}

ul#tabs-list li {
  display: flex;
  text-align: center;
  font-size: 0.9em;
  width: 24%;
  box-shadow: 0px -2px 2px rgba(0, 0, 0, 0.05);
 /* border-right: 1px solid #dfdfdf;*/
  position: relative;
  border-top: solid 2px #9A191B;
  /*border-bottom: solid 2px #9A191B;*/
  
	
}

ul#tabs-list li:hover {
  /*-webkit-transition: none;
  transition: none;
  border-right: none;*/
}

ul#tabs-list li:hover.last {
 /* border-right: 1px solid transparent;*/
}

ul#tabs-list li:hover + li {
 /* border-left: 1px solid #dfdfdf;*/
}

ul#tabs-list li label.panel-label {
  position: relative;
  /*padding: 1.2em 0;*/
  font-size: 0.9em;
  
}

ul#tabs-list li label.panel-label::after {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 100%;
  background-color: #003399;
  height: 0;
  -webkit-transition-property: height;
  transition-property: height;
  -webkit-transition-duration: 200ms;
          transition-duration: 200ms;
}

ul#tabs-list li label.panel-label:hover {
  /*padding-top: 1.2em;*/
}

ul#tabs-list li label.panel-label:hover::after {
  height: 10%;
}

#li-for-panel-1,#li-for-panel-2,#li-for-panel-3,#li-for-panel-4,#li-for-panel-5{
	border-left: solid 2px #9A191B;
	
}

#li-for-panel-5{
	border-right: solid 2px #9A191B;
	
}


.main {
    width: 100%;
    margin: 0 auto;
}

.panel-radios {
  display: none;
}

body {
  /*background: #00bfff;*/
  color: #444444;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
}

.main p {
  line-height: 1.8;
	
}

#r_box{
	margin: 0 auto;
	/*width: 750px;*/
	text-align: center;
	}
	

.content_wrap {
  clear: left;
  width: 100%;
 height: 300px;	
  font-size: 20px;
  text-align: center;
  line-height: 100%;
  /*background: #F8E6E6;*/
  color: #fff;
  margin: 0 auto;
  padding: 10px 0;
 /* margin-bottom: 15px;*/
}
.content_wrap iframe {
    width:100%;
	height: 300px;	
	}

.ranking_wrap iframe {
height: 300px;
width: 100%;
}

ul#tabs-list li{
/*left:20px;*/
height:25px;
}


ul#tabs-list{
justify-content:center;
}

ul#tabs-list li label.panel-label{
padding-top:3px;
}

.none_changed{
	display: none;
}

.block_changed{
	display: block;
}


@media (max-width: 576px) {
.ranking_wrap iframe {
   	height: calc(310vw / 3.75)!important;
	
		
}
	
  .content_wrap {
    clear: left;
    width: 100%!important;
	width: 740px;
	height: calc(250vw / 3.75)!important;
	line-height: 0;
	
	
}

.content_wrap iframe {
    width: 100%!important;
	height: calc(250vw / 3.75)!important;
	font-size: 0.7em!important;
	
}
	
ul#tabs-list li {
    height: auto!important;
	
}
#li-for-panel-1 ,
#li-for-panel-2 ,
#li-for-panel-3 ,
#li-for-panel-4,
#li-for-panel-5{
	height: 20px!important;
	line-height: 1;
}
#panels {
	height: calc(270vw / 3.75)!important;
}
ul#tabs-list li label.panel-label {
    font-size: 0.8em!important;
	padding: 5px 0!important;
}
footer {
	padding-top: 60px;
}

#slick-slide00, #slick-slide01, #slick-slide02, #slick-slide03, #slick-slide04, #slick-slide05, #slick-slide06, #slick-slide07, #slick-slide08, #slick-slide09 {
    width: 100% !important;
}

ul#tabs-list li label.panel-label::after {
	display: none;
}

ul#tabs-list li label.panel-label:hover {
  /*padding-top: 1.2em;*/
}

ul#tabs-list li label.panel-label:hover::after {
  display: none;
}




#panel-3-ctrl:checked ~ #panels #panel-4 .main {
  /*max-height: none*/;/*ieバグ*/
  /*opacity: 1;*/
  /*padding: 0.02%;*/
}
#panel-1-ctrl:checked ~ #tabs-list #li-for-panel-1 {
 /* pointer-events: none;*/
  cursor: default;
  -webkit-transform: translate3d(0, 1px, 0);
          transform: translate3d(0, 1px, 0);
  box-shadow: none;
  border-right: none;

}
ul#tabs-list li {
  display: flex;
  text-align: center;
  font-size: 1em;
  width: 48%;
  box-shadow: 0px -2px 2px rgba(0, 0, 0, 0.05);
  /*border-right: 1px solid #dfdfdf;*/
  position: relative;
}

ul#tabs-list li:hover {
  -webkit-transition: none;
  transition: none;
  border-right: none;
}

ul#tabs-list li:hover.last {
  border-right: 1px solid transparent;
}

ul#tabs-list li:hover + li {
 /* border-left: 1px solid #dfdfdf;*/
}

ul#tabs-list li label.panel-label {
  position: relative;
  /*padding: 0.5em 0;*/
	/*padding: 0.8em;*/
  font-size: 1em;
	white-space: nowrap;
}

ul#tabs-list li label.panel-label::after {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 100%;
  background-color: #003399;
  height: 0;
  -webkit-transition-property: height;
  transition-property: height;
  -webkit-transition-duration: 200ms;
          transition-duration: 200ms;
}

ul#tabs-list li label.panel-label:hover {
  /*padding-top: 1.2em;*/
/*padding: 0.8em;*/
}

ul#tabs-list li label.panel-label:hover::after {
  height: 20%;
}

.main {
    width: 100%;
    margin: 0 auto;
}

.panel-radios {
  display: none;
}
.slider {
    width: 100%!important;
}
.slick-dotted.slick-slider {
    margin-bottom: 0!important;
}
}