@charset "utf-8";
/* CSS Document */
/*
================================================================================================================
 コンテンツエリア（枠のレイアウト指定）
================================================================================================================
*/
/*
==========================================================================
枠内の基本カラー（タイトル/枠内）
==========================================================================
*/
/* 黒 */
.pickup_box.bg_black, .contents_box.bg_black, .contents_QA_Q.bg_black, .contents_info_title.bg_black {
  background-color: #333333;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_black, .contents_title.bg_black {
  background: linear-gradient(#AAAAAA, #333333, #DDDDDD);
  box-shadow: #000 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #000 0 0 2px;
}
.pickup_01.bg_black, .contents_01.bg_black, .contents_02.bg_black, .contents_QA_A.bg_black, .contents_info.bg_black {
  background-color: #EFEFEF;
  box-shadow: #000 0 0 6px;
  color: #333;
}
/* 緑 */
.pickup_box.bg_green, .contents_box.bg_green, .contents_QA_Q.bg_green, .contents_info_title.bg_green {
  background-color: #338833;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_green, .contents_title.bg_green {
  background: linear-gradient(#66EE66, #003300, #88EE88);
  box-shadow: #060 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #060 0 0 2px;
}
.pickup_01.bg_green, .contents_01.bg_green, .contents_02.bg_green, .contents_QA_A.bg_green, .contents_info.bg_green {
  background-color: #EEFFEE;
  box-shadow: #006 0 0 6px;
  color: #060;
}
/* 青 */
.pickup_box.bg_blue, .contents_box.bg_blue, .contents_QA_Q.bg_blue, .contents_info_title.bg_blue {
  background-color: #0066DD;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_blue, .contents_title.bg_blue {
  background: linear-gradient(#00BBDD, #001188, #00CCFF);
  box-shadow: #006 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #006 0 0 2px;
}
.pickup_01.bg_blue, .contents_01.bg_blue, .contents_02.bg_blue, .contents_QA_A.bg_blue, .contents_info.bg_blue {
  background-color: #DDFFFF;
  box-shadow: #006 0 0 6px;
  color: #036;
}
/* 赤 */
.pickup_box.bg_red, .contents_box.bg_red, .contents_QA_Q.bg_red, .contents_info_title.bg_red {
  background-color: #990022;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_red, .contents_title.bg_red {
  background: linear-gradient(#FF00CC, #330000, #FF33EE);
  box-shadow: #600 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #600 0 0 2px;
}
.pickup_01.bg_red, .contents_01.bg_red, .contents_02.bg_red, .contents_QA_A.bg_red, .contents_info.bg_red {
  background-color: #FFEEFF;
  box-shadow: #600 0 0 6px;
  color: #603;
}
/* 黄 */
.pickup_box.bg_yellow, .contents_box.bg_yellow, .contents_QA_Q.bg_yellow, .contents_info_title.bg_yellow {
  background-color: #FFCC44;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_yellow, .contents_title.bg_yellow {
  background: linear-gradient(#EEDD33, #333300, #FFEE33);
  box-shadow: #630 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #630 0 0 2px;
}
.pickup_01.bg_yellow, .contents_01.bg_yellow, .contents_02.bg_yellow, .contents_QA_A.bg_yellow, .contents_info.bg_yellow {
  background-color: #FFFFEE;
  box-shadow: #630 0 0 6px;
  color: #630;
}
/* 橙 */
.pickup_box.bg_orange, .contents_box.bg_orange, .contents_QA_Q.bg_orange, .contents_info_title.bg_orange {
  background-color: #CC4400;
  box-shadow: #CCC 1px 1px 10px;
}
.pickup_title.bg_orange, .contents_title.bg_orange {
  background: linear-gradient(#FFBB00, #442200, #FFCC00);
  box-shadow: #630 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #630 0 0 2px;
}
.pickup_01.bg_orange, .contents_01.bg_orange, .contents_02.bg_orange, .contents_QA_A.bg_orange, .contents_info.bg_orange {
  background-color: #FFF9F9;
  box-shadow: #630 0 0 6px;
  color: #630;
}

/* ページタイトル 赤 */
.pickup_title.title_waku_bg_red, .contents_title.title_waku_bg_red {
  background-image: url("../images/common/title_waku02_l.png"), url("../images/common/title_waku02_r.png"), url("../images/common/title_waku02_loop_red.png");
  background-repeat: no-repeat, no-repeat, repeat-x;
  background-position: left center, right center, top center;
  background-size: contain;
  box-shadow: #630 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #630 0 0 2px;
padding: 18px 0px 14px 0px;
}
/* ページタイトル 青 */
.pickup_title.title_waku_bg_blue, .contents_title.title_waku_bg_blue {
  background-image: url("../images/common/title_waku02_l.png"), url("../images/common/title_waku02_r.png"), url("../images/common/title_waku02_loop_blue.png");
  background-repeat: no-repeat, no-repeat, repeat-x;
  background-position: left center, right center, top center;
  background-size: contain;
  box-shadow: #630 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #630 0 0 2px;
padding: 18px 0px 14px 0px;
}
/* ページタイトル 緑 */
.pickup_title.title_waku_bg_green, .contents_title.title_waku_bg_green {
  background-image: url("../images/common/title_waku02_l.png"), url("../images/common/title_waku02_r.png"), url("../images/common/title_waku02_loop_green.png");
  background-repeat: no-repeat, no-repeat, repeat-x;
  background-position: left center, right center, top center;
  background-size: contain;
  box-shadow: #630 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #630 0 0 2px;
padding: 18px 0px 14px 0px;
}

/* BGimage01 */
.pickup_box.bg_image01, .contents_box.bg_image01, .contents_QA_Q.bg_image01, .contents_info_title.bg_image01 {
  background-image: url("../images/bg/waku_flame_width.png"), url("../images/bg/waku_flame_height.png"),url("../images/bg/waku_flame_width.png"), url("../images/bg/waku_flame_height.png"), url("../images/bg/bg_waku_main.jpg");
  background-repeat:repeat-x, repeat-y,repeat-x, repeat-y,repeat-x;
  background-position:center top,right top,center bottom,left center,center top;
  background-size:auto 10px,9px auto,auto 10px,9px auto,auto;
  background-color: #211711;
  box-shadow: #036 1px 1px 10px;
}
.pickup_title.bg_image01
/*, .contents_title.bg_image01*/{
  background-image: url("../images/common/title_waku_l.png"), url("../images/common/title_waku_r.png"), url("../images/common/title_bg01.jpg");
  background-repeat: no-repeat, no-repeat, repeat-x;
  background-position: top left 42%, top right 42%, top center;
  box-shadow: #006 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #006 0 0 2px;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
  align-items: center; /* 縦方向中央揃え */
  -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
  justify-content: center; /* 横方向中央揃え */
}


@media only screen and (max-width: 899px) {
/*.pickup_box.bg_image01, .contents_box.bg_image01, .contents_QA_Q.bg_image01, .contents_info_title.bg_image01 {
  background-size: 10px, 10px, 4px, 4px, 100%;
}
  .pickup_title.bg_image01, .contents_title.bg_image01 {
    background-position: top left 36%, top right 36%, top center;
  }
*/  
}
@media only screen and (max-width: 599px) {
/*  .pickup_title.bg_image01, .contents_title.bg_image01 {
    background-position: top left 22%, top right 22%, top center;
  }
*/  
}
.pickup_title_long.bg_image01, .contents_title_long.bg_image01 {
  background-image: url("../images/common/title_waku_l.png"), url("../images/common/title_waku_r.png"), url("../images/common/title_waku_c.png"), url("../images/common/title_bg01.jpg");
  background-repeat: no-repeat, no-repeat, no-repeat, repeat-x;
  background-position: top left 30%, top right 30%, top center, top center;
  box-shadow: #006 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #006 0 0 2px;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
  align-items: center; /* 縦方向中央揃え */
  -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
  justify-content: center; /* 横方向中央揃え */
}
@media only screen and (max-width: 899px) {
  .pickup_title_long.bg_image01, .contents_title_long.bg_image01 {
    background-position: top left 20%, top right 20%, top center, top center;
  }
}
@media only screen and (max-width: 599px) {
  .pickup_title_long.bg_image01, .contents_title_long.bg_image01 {
    background-position: top left 16%, top right 16%, top center, top center;
  }
}
.pickup_01.bg_image01, .contents_01.bg_image01, .contents_02.bg_image01, .contents_QA_A.bg_image01, .contents_info.bg_image01 {
  background-color: #F8F3EB;
  box-shadow: #006 0 0 6px;
  color: #036;
}
/* BGimage02 */
.pickup_box.bg_image02, .contents_box.bg_image02, .contents_QA_Q.bg_image02, .contents_info_title.bg_image02 {
  background-image: url("../images/bg/bg02.jpg");
  background-repeat: repeat-y;
  background-position: center center;
  background-size: 100%;
  background-color: #fffac1;
  box-shadow: #036 1px 1px 10px;
}
.pickup_title.bg_image02, .contents_title.bg_image02 {
  background-image: url("../images/common/title_bg01.jpg");
  background-repeat: repeat-x;
  background-position: center center;
  box-shadow: #006 0 0 6px;
  color: #FFFFFF;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  text-shadow: #006 0 0 2px;
}
.pickup_01.bg_image01, .contents_01.bg_image01, .contents_02.bg_image01, .contents_QA_A.bg_image01, .contents_info.bg_image01 {
  background-color: #fff09c;
  box-shadow: #006 0 0 6px;
  color: #804000;
}
/*
==========================================================================
ピックアップ領域(左カラム)
==========================================================================
*/
.flexbox {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 14px auto 32px auto;
  padding: 0;
}
#pickup_all {
  width: calc(26% - 15px);
  /*min-width:260px;*/
  height: auto;
  margin: -14px 0 0 15px;
  padding: 0;
}
#pickup_all_02 {
  position: absolute;
  width: 26.4%;
  /*min-width:260px;*/
  margin-top: 250px;
  margin-right: auto;
  left: 1.2%;
  padding: 0;
  height: auto;
}
.pickup_box {
  position: relative;
  width: 100%;
  padding: 10px 10px 1px 10px;
  margin-bottom: 20px;
  height: auto;
  min-height: 5vh;
  border-radius: 4px;
}
.pickup_title {
  width: 100%;
  height: auto;
  padding: 6px 4px 4px 4px;
  margin: 0px auto 12px auto;
  border-radius: 4px;
}
.pickup_01 {
  width: 100%;
  height: auto;
  min-height: 5vh;
  padding: 5px;
  margin: 0 0 20px 0;
  border-radius: 4px;
  font-weight: bold;
  text-align: center;
}
@media only screen and (max-width: 899px) {
  #pickup_all {
    position: relative;
    width: 100%;
    /*min-width:320px;*/
    height: 100%;
    margin-right: auto;
    padding: 0;
    height: auto;
  }
  #pickup_all_02 {
    position: relative;
    width: 100%;
    /*min-width:320px;*/
    height: 100%;
    margin-top: 0px;
    padding: 0;
    height: auto;
  }
  .pickup_box {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 10px 10px 1px 10px;
    margin: 0 auto 20px auto;
    border-radius: 4px;
  }
  .pickup_title {
    height: auto;
    width: 98%;
    margin: 0px auto 12px auto;
  }
  .pickup_01 {
    width: 100%;
    height: auto;
    min-height: 5vh;
    padding: 5px;
    margin: 0 0 20px 0;
    border-radius: 4px;
    font-weight: bold;
    text-align: center;
  }
}
#pickup_all img, .pickup_box img, .pickup_01 img {
  width: 100%;
}
/*
==========================================================================
サブメニューボタン画像
==========================================================================
*/
#pickup_all ul li a .rank_jp1{
  width: calc(100% - 0px);
  height:100%;
background-image: url(../images/ranking/rank_jp1.png) ;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#pickup_all ul li a .rank_jp2{
  width: calc(100% - 0px);
  height:100%;
background-image: url(../images/ranking/rank_jp2.png) ;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#pickup_all ul li a .rank_jp3{
  width: calc(100% - 0px);
  height:100%;
background-image: url(../images/ranking/rank_jp3.png) ;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#pickup_all ul li a .rank_jp4{
  width: calc(100% - 0px);
  height:100%;
background-image: url(../images/ranking/rank_jp4.png) ;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
#pickup_all ul li a .rank_jp5{
  width: calc(100% - 0px);
  height:100%;
background-image: url(../images/ranking/rank_jp5.png) ;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

/*
==========================================================================
コンテンツ領域(右カラム)
==========================================================================
*/
#contents_right {
  width: calc(74% - 15px);
  height: auto;
  margin: -14px 15px 0 0;
}
@media only screen and (max-width: 899px) {
  #contents_right {
  width: calc(100% - 0px);
  height: auto;
  margin: -14px auto 0 auto;
  }
 }
/*
==========================================================================
コンテンツ領域(中央カラム)
==========================================================================
*/
#contents_all {
  position: relative;
  width: 100%;
  height: auto;
  margin: auto;
  padding: 0px;
}
.contents_box {
  position: relative;
  width: 100%;
  height: auto;
  padding: 40px 10px 1px 10px;
  margin-bottom: 50px;
}
.contents_box .corner{
position:absolute;
width:55px;height:36px;
background-repeat:no-repeat;
background-size: cover;
}
.contents_box .corner.lt{
top:-7px;left:-15px;
background-image: url(../images/bg/waku_corner_lt.png);
}
.contents_box .corner.rt{
top:-7px;right:-15px;
background-image: url(../images/bg/waku_corner_rt.png);
}
.contents_box .corner.lb{
bottom:-7px;left:-15px;
background-image: url(../images/bg/waku_corner_lb.png);
}
.contents_box .corner.rb{
bottom:-7px;right:-15px;
background-image: url(../images/bg/waku_corner_rb.png);
}


.contents_title{
  position: absolute;
  top:-40px;
  left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);  
  min-width:300px;
  height: 85px;
  padding: 0 65px;
background-image: url(../images/common/waku_title_l.png), url(../images/common/waku_title_r.png);
background-position:center left,center right;
background-size:auto 100%;
background-repeat:no-repeat;  
}
.contents_title span{
    width: 100%;
      height: 85px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #FFFFFF;
    font-weight: bold;
background-image: url(../images/common/waku_title_bg.png);
background-size:auto 100%;
background-repeat:repeat-x; 
}

@media only screen and (max-width: 899px) {
.contents_title{
  top:-26px;
  width:80%;
  height: 60px;
  padding: 0 44px;
}

.contents_title span{height: 60px;}

}
.contents_01 {
  width: calc(100% - 50px);
  height: auto;
  padding: 8px;
  margin: 14px auto 32px auto;
  border-radius: 4px;
  font-weight: bold;
  text-align: center;
}
.contents_02 {
  width: calc(100% - 20px);
  height: auto;
  min-height: 5vh;
  padding: 8px;
  margin: 14px auto 22px auto;
  border-radius: 4px;
  font-weight: bold;
  text-align: center;
}
.contents_QA {
  width: auto;
  height: auto;
  padding: 0 10px;
  margin: 0 0 10px 0;
  font-weight: bold;
  text-align: left;
  color: #000066;
  overflow: hidden;
}
.contents_QA a {
  color: #FF6600;
}
.contents_QA span {
  color: #990022;
  margin-right: 10px;
}
.contents_QA_Q {
  width: auto;
  height: auto;
  padding: 10px;
  margin: 0 0 20px 0;
  border-radius: 20px;
  color: #FFFFFF;
  text-align: left;
  overflow: hidden;
}
.contents_QA_Q a {
  color: #FF6666;
}
.contents_QA_Q span {
  color: #FFFF00;
  margin-right: 10px;
}
.contents_QA_A {
  width: auto;
  height: auto;
  padding: 10px;
  margin: 0 0 20px 0;
  border-radius: 20px;
  font-weight: bold;
  text-align: left;
  overflow: hidden;
}
.contents_QA_Q span, .contents_QA_Q li, .contents_QA span, .contents_QA li {
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.contents_info {
  width: auto;
  height: auto;
  padding: 10px;
  margin: 0 0 10px 0;
  border-radius: 10px;
  color: #FFFFFF;
  text-align: center;
  overflow: hidden;
}
.contents_info_title {
  font-weight: bold;
  width: auto;
  height: auto;
  padding: 10px;
  margin: 0 0 20px 0;
  border-radius: 10px;
  color: #FFFFFF;
  text-align: center;
  overflow: hidden;
}
@media only screen and (max-width: 899px) {
  #contents_all {
    position: relative;
    width: 100%;
    /*min-width:320px;*/
    height: auto;
    margin: 20px auto 0 auto;
    padding: 0px;
  }
  .contents_box {
    position: relative;
    width: 100%;
    height: auto;
    padding: 10px 10px 1px 10px;
    margin: 0 auto 40px;
  }
  .contents_box .corner{
    width:35px;height:25px;
  }  
  .contents_box .corner.lt{
top:-5px;left:-10px;
}
.contents_box .corner.rt{
top:-5px;right:-10px;
}
.contents_box .corner.lb{
bottom:-5px;left:-10px;
}
.contents_box .corner.rb{
bottom:-5px;right:-10px;
}
  
  .contents_01 {
    width: calc(100% - 20px);
    margin: 30px auto;
  }
  .contents_02 {
    width: calc(100% - 0px);
    height: auto;
    min-height: 5vh;
    padding: 15px 5px 5px 5px;
    margin: 30px auto;
    border-radius: 0px;
    font-weight: bold;
    text-align: center;
  }
  .contents_QA {
    width: auto;
    height: auto;
    padding: 0 10px;
    margin: 0 0 10px 0;
    font-weight: bold;
    text-align: left;
    color: #000066;
    overflow: hidden;
  }
  .contents_QA a {
    color: #FF6600;
  }
  .contents_QA span {
    color: #990022;
    margin-right: 5px;
  }
  .contents_QA_Q {
    width: auto;
    height: auto;
    padding: 10px;
    margin: 0 0 20px 0;
    border-radius: 20px;
    color: #FFFFFF;
    text-align: left;
    overflow: hidden;
  }
  .contents_QA_Q a {
    color: #FF6666;
  }
  .contents_QA_Q span {
    color: #FFFF00;
    margin-right: 10px;
  }
  .contents_QA_A {
    width: auto;
    height: auto;
    padding: 10px;
    margin: 0 0 20px 0;
    border-radius: 20px;
    font-weight: bold;
    text-align: left;
    overflow: hidden;
  }
  .contents_QA_Q span, .contents_QA_Q li, .contents_QA span, .contents_QA li {
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
  .contents_info, .contents_info_title {
    width: 100%;
    height: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
}


#contents_all img, .contents_box img, .contents_01 img, .contents_02 img {
  width: 100%;
}
/*
==========================================================================
領域内用ボタン
==========================================================================
*/
/*//// ボタン横幅（％） ////*/
ul.wid_01 li a {
  width: 98%;
  margin: 1.5% 1%;
}
ul.wid_02 li a {
  width: 48%;
  margin: 1%;
}
ul.wid_03 li a {
  width: 31.3%;
  margin: 1%;
}
ul.wid_04 li a {
  width: 23%;
  margin: 1%;
}
ul.wid_05 li a {
  width: 19%;
  margin: 0.5%;
}
ul.wid_06 li a {
  width: 15.6%;
  margin: 0.5%;
}
ul.wid_07 li a {
  width: 13.2%;
  margin: 0.5%;
}
ul.wid_08 li a {
  width: 11.5%;
  margin: 0.5%;
}
/*//// ボタンカラー ////*/
/* 白黒 */
.btn_01.white, .btn_act.white {
  background: #FFF;
  border: 1px solid #333;
  color: #333;
  text-shadow: none;
}
.btn_01.white:hover {
  color: #333;
  text-shadow: none;
}
.btn_01.white:hover::after {
  background: #FFF;
}
/* 白緑 */
.btn_01.white_g, .btn_act.white_r {
  background: #EFE;
  border: 1px solid #060;
  color: #060;
  text-shadow: none;
}
.btn_01.white_g:hover {
  color: #060;
  text-shadow: none;
}
.btn_01.white_g:hover::after {
  background: #EFE;
}
/* 白青 */
.btn_01.white_b, .btn_act.white_b {
  background: #DFF;
  border: 1px solid #06C;
  color: #06C;
  text-shadow: none;
}
.btn_01.white_b:hover {
  color: #06C;
  text-shadow: none;
}
.btn_01.white_b:hover::after {
  background: #FFF;
}
/* 白赤 */
.btn_01.white_r, .btn_act.white_r {
  background: #FCC;
  border: 1px solid #900;
  color: #900;
  text-shadow: none;
}
.btn_01.white_r:hover {
  color: #900;
  text-shadow: none;
}
.btn_01.white_r:hover::after {
  background: #FCC;
}
/* 白黄 */
.btn_01.white_y, .btn_act.white_y {
  background: #FEC;
  border: 1px solid #630;
  color: #630;
  text-shadow: none;
}
.btn_01.white_y:hover {
  color: #630;
  text-shadow: none;
}
.btn_01.white_y:hover::after {
  background: #FEC;
}
/* 白緑 */
.btn_01.white_g, .btn_act.white_g {
  background: #AFA;
  border: 1px solid #080;
  color: #080;
  text-shadow: none;
}
.btn_01.white_g:hover {
  color: #080;
  text-shadow: none;
}
.btn_01.white_g:hover::after {
  background: #AFA;
}
/* 白橙 */
.btn_01.white_o, .btn_act.white_y {
  background: #FEC;
  border: 1px solid #630;
  color: #630;
  text-shadow: none;
}
.btn_01.white_o:hover {
  color: #630;
  text-shadow: none;
}
.btn_01.white_o:hover::after {
  background: #FFF;
}
/* 黒 */
.btn_01.black, .btn_act.black {
  background: linear-gradient(#000000, #999999);
  border: 1px solid #333;
  color: #FFF;
  text-shadow: #333 0 0 4px;
}
.btn_01.black:hover {
  color: #333;
  text-shadow: none;
}
.btn_01.black:hover::after {
  background: #FFF;
}
/* 緑 */
.btn_01.green, .btn_act.green {
  background: linear-gradient(#006600, #66FF66);
  border: 1px solid #060;
  color: #FFF;
  text-shadow: #060 0 0 4px;
}
.btn_01.green:hover {
  color: #060;
  text-shadow: none;
}
.btn_01.green:hover::after {
  background: #FFF;
}
/* 青 */
.btn_01.blue, .btn_act.blue {
  background: linear-gradient(#0066CC, #00CCFF);
  border: 1px solid #06C;
  color: #FFF;
  text-shadow: #06C 0 0 4px;
}
.btn_01.blue:hover {
  color: #06C;
  text-shadow: none;
}
.btn_01.blue:hover::after {
  background: #FFF;
}
/* 赤 */
.btn_01.red, .btn_act.red {
  background: linear-gradient(#660000, #FF3300);
  border: 1px solid #600;
  color: #FFF;
  text-shadow: #600 0 0 4px;
}
.btn_01.red:hover {
  color: #600;
  text-shadow: none;
}
.btn_01.red:hover::after {
  background: #FFF;
}
/* 黄 */
.btn_01.yellow, .btn_act.yellow {
  background: linear-gradient(#AA8800, #FFEE66);
  border: 1px solid #A80;
  color: #FFF;
  text-shadow: #A80 0 0 4px;
}
.btn_01.yellow:hover {
  color: #A80;
  text-shadow: none;
}
.btn_01.yellow:hover::after {
  background: #FFF;
}
/* 橙 */
.btn_01.orange, .btn_act.orange {
  background: linear-gradient(#CC6600, #FFCC00);
  border: 1px solid #C60;
  color: #FFF;
  text-shadow: #C60 0 0 4px;
}
.btn_01.orange:hover {
  color: #C60;
  text-shadow: none;
}
.btn_01.orange:hover::after {
  background: #FFF;
}
.btn_01, .btn_act {
  display: inline-block;
  float: left;
  height: 38px;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  line-height: 38px;
  outline: none;
  position: relative;
  z-index: 2;
  overflow: hidden;
  border-radius: 6px;
}
.btn_01::before, .btn_01::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.btn_01, .btn_01::before, .btn_01::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
.btn_01:hover {
  color: #090;
}
.btn_01::after {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(.5);
  transform: scale(.5);
}
.btn_01:hover::after {
  -webkit-transform: scale(1);
  transform: scale(1);
  border-radius: 3px;
}
/*
==========================================================================
コンテンツ領域(横100％)
==========================================================================
*/
#contents_s_all {
  position: relative;
  width: 100%;
  height: auto;
  margin-left: auto;
  padding: 0px;
}
/*
==========================================================================
バナー領域(ページ下部)
==========================================================================
*/
.banner_all {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 5px;
  background-color: #fff09c;
  height: auto;
  min-height: 5vh;
  border-radius: 4px;
  box-shadow: #39F 1px 1px 10px;
}
.bottom_banner ul {
  width: 100%;
  padding: 0%;
  display:flex;
  justify-content:center;
  align-items:center;
}
.bottom_banner li {
  width: 15.6%;
  margin: 0.5%;
  float: left;
}
.bottom_banner li img {
  width: 100%;
}
@media only screen and (max-width: 899px) {
  .banner_all {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 5px;
    margin: 0 auto;
    border-radius: 4px;
  }
  .bottom_banner ul {
    width: 100%;
    padding: 0%;
    display: block;
    display: -moz-block;
    display: -o-block;
    display: -webkit-block;
    display: -ms-block;
  }
  .bottom_banner li {
    width: 32%;
    margin: 0.6%;
    float: left;
  }
  .bottom_banner li img {
    width: 100%;
  }
}
@media only screen and (max-width: 499px) {
  .banner_all {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 5px;
    margin: 0 auto;
    border-radius: 4px;
  }
  .bottom_banner ul {
    width: 100%;
    padding: 0%;
    display: block;
    display: -moz-block;
    display: -o-block;
    display: -webkit-block;
    display: -ms-block;
  }
  .bottom_banner li {
    width: 48%;
    margin: 1%;
    float: left;
  }
  .bottom_banner li img {
    width: 100%;
  }
}

/*コナステメダルバナー読み込み用*********************************************************/

.contents_01.bg_image01.knst_inc .regular_bnr {
    max-width:initial;
}

.contents_01.bg_image01.knst_inc .regular_bnr .period ul li .title_img{
display: flex;
justify-content: center;
align-items: center;
}

@media screen and (max-width: 799px) {
.contents_01.bg_image01.knst_inc .regular_bnr .period ul li .text {
        width:initial;
        padding:0;
        }
}

@media screen and (max-width: 639px) {
.contents_01.bg_image01.knst_inc .regular_bnr sp1,
.contents_01.bg_image01.knst_inc .regular_bnr sp2 {
        letter-spacing: 1.5px;
    }
}