@charset "utf-8";

/*body{font-family: "ヒラギノ角ゴ Pro N W6"}*/
#Contents img {
  max-width: 100%;
}

div#Contents {
  background-color: #fff;
  max-width: 750px;
  margin-top: auto;
  color: #32363A;
}

section {
  padding: 0;
}

/* ===============================
PC共通
===============================*/
@media all and (min-width: 767px) {
  div#Contents {
    margin-top: 0;
  }
}

/*font-size指定*/
.fs10 {
  font-size: 2.667vw;
}

.fs12 {
  font-size: 3.2vw;
}

.fs13 {
  font-size: 3.467vw;
}

.fs14 {
  font-size: 3.733vw;
}

.fs15 {
  font-size: 4vw;
}

.fs18 {
  font-size: 4.8vw;
}

.fs20 {
  font-size: 5.333vw;
}

.fs24 {
  font-size: 6.4vw;
}

.chara_outer p {
  font-size: 3.071vw;
}

.font_bold {
  font-weight: bold;
}

.red {
  color: #EB5F2B;
}

.blue {
  color: #2BA1EB;
}

a.blue {
  color: #2A80B9;
  text-decoration: underline;
}

@media screen and (min-width: 750px) {
  .fs10 {
    font-size: 20px;
  }

  .fs12 {
    font-size: 24px;
  }

  .fs13 {
    font-size: 26px;
  }

  .fs14 {
    font-size: 28px;
  }

  .fs15 {
    font-size: 30px;
  }

  .fs18 {
    font-size: 36px;
  }

  .fs20 {
    font-size: 40px;
  }

  .fs24 {
    font-size: 48px;
  }

  .chara_outer p {
    font-size: 23px;
  }
}

/*------------*/
body,
#Page {
  background: #F7F5F3;
}

a._blank {
  padding-right: 1.2em;
  position: relative;
}

a._blank::after {
  content: '';
  position: absolute;
  background-image: url('/portal/images/icon-outlink.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 0.7em;
  height: 0.7em;
  right: 0.3em;
  top: 0;
  bottom: 0;
  margin: auto;
}

#KV_area {
  position: relative;
  margin-bottom: 5.33vw;
}

.kv_anchor {
  background-color: #ffffff;
  border-radius: 6px;
  width: 90%;
  line-height: 1;
  margin: auto;
  position: absolute;
  bottom: 5.33vw;
  left: 0;
  right: 0;
}

.kv_anchor p {
  border-bottom: solid 1px #C4CDDC;
  box-sizing: border-box;
  padding: 4vw;
}

.kv_anchor ul {
  box-sizing: border-box;
  padding: 4vw;
}

.kv_anchor ul li {
  margin-bottom: 4vw;
  cursor: pointer;
  position: relative;
}

.kv_anchor ul li:last-of-type {
  margin-bottom: 0;
}

.kv_anchor ul li::before {
  content: '';
  border: 1px solid;
  border-color: transparent transparent #0c3752 #0c3752;
  transform: rotate(-45deg);
  width: 2vw;
  height: 2vw;
  left: 0.5em;
  position: absolute;
  top: -0.5em;
  bottom: 0;
  margin: auto;
}

.kv_anchor ul li a {
  padding-left: 8vw;
  display: block;
}

@media screen and (min-width: 750px) {
  #KV_area {
    border-radius: 12px;
    margin-bottom: 40px;
  }

  .kv_anchor {
    bottom: 40px;
  }

  .kv_anchor p {
    padding: 30px;
  }

  .kv_anchor ul {
    padding: 30px;
  }

  .kv_anchor ul li {
    margin-bottom: 30px;
  }

  .kv_anchor ul li::before {
    width: 15px;
    height: 15px;
  }

  .kv_anchor ul li a {
    padding-left: 60px;
  }
}

@media screen and (min-width: 768px) {
  .anchor_box {
    display: block;
    padding-top: 117px;
    margin-top: -117px;
  }
}

div#Contents {
  background-color: #F7f5f3;
}

#Contents h1 {
  line-height: 1;
  width: 100%;
  text-align: center;
  padding: 5.33vw;
}

@media screen and (min-width: 750px) {
  #Contents h1 {
    padding: 40px;
  }
}

h2 {
  background-color: #FACB32;
  color: #4D4639;
  font-weight: bold;
  padding: 4vw;
  line-height: 1;
}

@media screen and (min-width: 750px) {
  h2 {
    padding: 30px;
  }
}

.mainContents {
  width: 90%;
  margin: 5.33vw auto 10.66vw;
}

.mainContents_inner {
  padding-bottom: 10.67vw;
}

.bottomVector .mainContents_inner {
  padding-bottom: 5px;
}

.mainContents_box {
  background-color: #ffffff;
  border-radius: 6px 6px 0 0;
  margin-bottom: 5.33vw;
}

.mainContents_box h2 {
  border-radius: 6px 6px 0 0;
}

.bottomVector {
  position: relative;
  margin-bottom: 16vw;
}

.bottomVector::after {
  content: '';
  position: absolute;
  border-top: 11.66vw solid #ffffff;
  border-left: 45vw solid transparent;
  border-right: 45vw solid transparent;
  transition: auto;
}

@media screen and (min-width: 750px) {
  .mainContents {
    margin: 40px auto 0;
  }

  .mainContents_inner {
    padding-bottom: 80px;
  }

  .mainContents_box {
    border-radius: 12px 12px 0 0;
    margin-bottom: 40px;
  }

  .mainContents_box:last-of-type {
    margin-bottom: 0;
  }

  .mainContents_box h2 {
    border-radius: 12px 12px 0 0;
  }

  .mainContents_box.bottomVector {
    margin-bottom: 120px;
  }

  .bottomVector::after {
    border-top: 87.487px solid #ffffff;
    border-left: 337.675px solid transparent;
    border-right: 337.675px solid transparent;
  }
}

.chara_outer {
  display: flex;
  width: 90%;
  margin: 5.33vw auto;
  align-items: flex-start;
  justify-content: center;
}

.chara_outer p {
  background-color: inherit;
  border-radius: inherit;
  box-sizing: inherit;
  box-shadow: inherit;
  width: inherit;
  font-weight: bold;
  text-align: center;
}

/*
.chara_outer p:after{
  border-left: 4.8vw solid #fff;
  border-top: 4.8vw solid transparent;
  content: ' ';
  display: block;
  position: absolute;
  top: 18%;
  right: -9%;
}
.chara_outer img{
  width: 31.2vw;
}
  */
.monthSelect_box {
  border-bottom: 3px solid #cc0000;
}

@media screen and (min-width: 750px) {
  .chara_outer {
    margin: 40px auto;
  }

  .chara_outer p {
    padding: 30px 0;
    width: 340px;
  }
}

.monthSelect_box {
  display: flex;
  justify-content: space-between;
  width: 90%;
  margin: auto;
}

.monthSelect_inner {
  border-radius: 6px 6px 0 0;
  color: #fff;
  width: 39vw;
  padding: 4.267vw 0;
  position: relative;
  line-height: 1;
  text-align: center;
}

/*
.monthSelect_inner._select{
  background: -moz-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
  background: -webkit-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
  background: linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
}
*/
.monthSelect_inner._select,
.mainContents_inner .btn .btn_text {
  background: #CC0000;
  transition: none;
}

.mainContents_inner .btn a::before {
  height: 0;
  width: 0;
}

.mainContents_inner .btn .btn_text {
  border-radius: 60px;
}

.monthSelect_inner._select:after {
  border-left: 4.8vw solid linear-gradient(to right, #F67F88 50%, #B9B8F0);
  border-top: 4.8vw solid transparent;
  content: ' ';
  display: block;
  position: absolute;
  bottom: -4.8vw;
  left: 0;
  right: 0;
  margin: auto;
}

.monthSelect_inner._gray {
  color: #32363A;
  background-color: #ffffff !important;
  font-weight: normal;
  cursor: pointer;
  border: 1px solid #d4d2cf;
}

.monthSelect_content {
  background-color: #fff;
  width: 90%;
  margin: 0 auto 5.33vw;
  padding: 5.33vw 2.667vw;
  position: relative;
  border: 1px solid #D4D2CF;
}

.monthSelect_content._03 li {
  border-bottom: solid 1px #DDDDDD;
  display: flex;
  line-height: 2.8;
  justify-content: space-between;
  align-items: center;
}

.monthSelect_content._03 li .ranking {
  display: inline-block;
  padding-right: 1em;
}

.monthSelect_content._03 li.crown {
  position: relative;
  padding-left: 12vw;
}

.monthSelect_content._03 li.crown p::after {
  content: '';
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  width: 10.667vw;
  height: 9.6vw;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.monthSelect_content._03 li.crown._1st p::after {
  background-image: url('/report/2010/images/icon_1st.png');
}

.monthSelect_content._03 li.crown._2nd p::after {
  background-image: url('/report/2010/images/icon_2nd.png');
}

.monthSelect_content._03 li.crown._3rd p::after {
  background-image: url('/report/2010/images/icon_3rd.png');
}

.monthSelect_content._03 li:nth-of-type(1) {
  border-bottom: solid 1px #EBB72B;
}

.monthSelect_content._03 li:nth-of-type(2) {
  border-bottom: solid 1px #6B757A;
}

.monthSelect_content._03 li:nth-of-type(3) {
  border-bottom: solid 1px #855B2D;
}

.monthSelect_content._03 li .line_height {
  line-height: 1.3;
}

.monthSelect_content_inner {
  position: relative;
}

._01 .monthSelect_content_inner {
  height: 64.168vw;
}

._02 .monthSelect_content_inner {
  height: 76.267vw;
}

._03 ._03_box1 {
  height: 159vw;
}

._03 ._03_box2 {
  height: 159vw;
}

.monthSelect_content_inner img,
.monthSelect_content_inner .listOuter {
  position: absolute;
  transition: 0.4s;
  width: 100%;
  top: 0;
  bottom: 0;
  margin: auto;
}

.monthSelect_content_inner ._visible {
  opacity: 0;
  z-index: -1;
}

.btn a {
  width: 90%;
  font-size: 4vw !important;
  height: 15.33vw;
  line-height: 15.33vw;
  position: relative;
  /*
  background: -moz-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
  background: -webkit-linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
  background: linear-gradient(to right,#FCC87E,#F67F88 33%,#B9B8F0 66%,#87D9D6)!important;
  */
}

.btn_icon {
  display: block;
  border-top: 0.5vw solid #fff;
  border-right: 0.5vw solid #fff;
  transform: rotate(45deg);
  width: 3vw;
  height: 3vw;
  position: absolute;
  top: 0;
  right: 5.337vw;
  bottom: 0;
  margin: auto;
}

.beforeList .btn_icon {
  border-top: 0.3vw solid #2A80B9;
  border-right: 0.3vw solid #2A80B9;
  right: auto;
  left: 0;
}

.caution {
  margin-top: 5.333vw;
}

@media screen and (min-width: 750px) {
  .monthSelect_inner {
    border-radius: 12px 12px 0 0;
    padding: 32px 0;
    width: 290px;
  }

  .monthSelect_content {
    margin: 0 auto 40px;
    padding: 40px 20px;
  }

  .monthSelect_content._03 li.crown {
    padding-left: 90px;
  }

  .monthSelect_content._03 li.crown p::after {
    width: 80px;
    height: 72px
  }

  ._01 .monthSelect_content_inner {
    height: 481.27px;
  }

  ._02 .monthSelect_content_inner {
    height: 572.3px;
  }

  ._03 ._03_box1 {
    height: 1190px;
  }

  ._03 ._03_box2 {
    height: 1190px;
  }

  .monthSelect_content_inner img,
  .monthSelect_content_inner ul {
    width: 568.275px;
  }

  .btn a {
    font-size: 30px !important;
    height: 115px;
    line-height: 115px;
  }

  .btn_icon {
    border-top: 3.75px solid #fff;
    border-right: 3.75px solid #fff;
    width: 18.75px;
    height: 18.75px;
    right: 40px;
  }

  .beforeList .btn_icon {
    border-top: 2.25px solid #2A80B9;
    border-right: 2.25px solid #2A80B9;
    width: 16.5px;
    height: 16.5px;
  }

  .caution {
    margin-top: 40px;
  }
}

.beforeList {
  background-color: #fff;
  box-sizing: border-box;
  width: 90%;
  margin: auto;
}

.beforeList ul {
  width: 100%;
  display: none;
}

.beforeList ul li {
  line-height: 2.4;
  padding-left: 3.5rem;
  position: relative;
}

.beforeList ul a {
  color: #2A80B9;
}

.bannerList li {
  position: relative;
}

.bannerList li._blank::after {
  position: absolute;
  content: '';
  background-image: url('/portal/images/icon-outlink.png');
  background-size: contain;
  background-repeat: no-repeat;
  width: 5vw;
  height: 5vw;
  max-width: 31px;
  max-height: 31px;
  bottom: 0;
  right: 5%;
}

.bannerList a {
  display: block;
  margin: 0 auto 0 5%;
  margin-bottom: 5.33vw;
  width: 83%;
}

.bannerList li:last-of-type a {
  margin-bottom: 0;
}

.beforeList_btn {
  border: 1px solid #D4D2CF;
  background-color: #ffffff;
  border-radius: 12px;
  padding: 16px 0 16px 1em;
  position: relative;
  cursor: pointer;
}

.beforeList_btn:last-of-type {
  margin-bottom: 0;
  /* margin-top: 80px; */
}

.beforeList_btn span {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 0;
  bottom: 0;
  right: 1em;
  margin: auto;
}

.beforeList_btn span::before,
.beforeList_btn span::after {
  position: absolute;
  top: 9px;
  left: 50%;
  content: '';
  display: inline-block;
  width: 13px;
  height: 13px;
  border-top: 2px solid #3d3d3d;
  transform: translateX(-50%);
}

.beforeList_btn:not(.open) span::after {
  top: 3px;
  left: -3px;
  transform: rotate(90deg);
}

@media screen and (min-width: 750px) {
  .bannerList a {
    margin-bottom: 40px;
  }

  .bannerList img {
    width: 100%;
    max-width: 560px;
  }
}

.banner_text {
  margin: 0 auto 0 5%;
  font-weight: bold;
  width: 83%;
  text-align: center;
  line-height: 1.5;
}

.banner_text span {
  font-weight: normal;
}


body,
div#Contents {
  background: #F7F5F3;
}

#Menu {
  display: none;
}

div#Contents {
  color: #3D3D3D;
  background-color: #F7F5F3;
  padding: 56px 0 25px;
}

#Page {
  background: #F7F5F3;
}

#Header {
  max-width: 750px;
}

h2 {
  background-color: #FACB32;
  color: #4D4639;
  font-weight: bold;
}

.btn a,
.btn input {
  border-radius: 60px;
}

.btn a:hover::before {
  background: inherit;
}

.kv_anchor a {
  color: #3D3D3D;
}

.kv_anchor ul li::before {
  border-color: transparent transparent #3D3D3D #3D3D3D;
}

/* .chara_outer {
      width: 100%;
      margin-bottom: 0;
    } */

.chara_outer p {
  background-color: inherit;
  border-radius: inherit;
  box-sizing: inherit;
  box-shadow: inherit;
  width: inherit;
  font-weight: bold;
  font-size: 3.071vw;
  padding: 0;
}

@media screen and (min-width: 750px) {
  .chara_outer p {
    font-size: 23px;
  }
}

.chara_outer p:after {
  content: none;
}

.mainContents_box {
  background-color: #FFFFFF;
}

/* .monthSelect_box {
      border-bottom: 3px solid #CC0000;
      margin-top: 5.33vw;
    } */

.monthSelect_inner._select,
.btn a {
  background: #CC0000 !important;
}

.monthSelect_inner._gray {
  color: #3D3D3D;
  background-color: #FFFFFF !important;
  border: 1px solid #D4D2CF;
}

.monthSelect_content {
  border: 1px solid #D4D2CF;
}

.bottomVector::after {
  border-top: 11.66vw solid #FFFFFF;
  border-left: 45vw solid #F7F5F3;
  border-right: 45vw solid #F7F5F3;
}

@media screen and (min-width: 750px) {
  .bottomVector::after {
    border-top: 87.487px solid #FFFFFF;
    border-left: 337.675px solid #F7F5F3;
    border-right: 337.675px solid #F7F5F3;
  }
}

.beforeList {
  margin-top: 10.67vw;
  border: 1px solid #D4D2CF;
  border-radius: 10px;
  padding: 0;
}

@media screen and (min-width: 750px) {
  .beforeList {
    margin-top: 80px;
  }
}

.beforeList_btn {
  border: none;
  background-color: #FFFFFF;
  border-radius: 12px;
  padding: 16px 0 16px 1em;
}

.beforeList_btn span::before,
.beforeList_btn span::after {
  border-top: 2px solid #3D3D3D;
}

.beforeList_btn.open {
  position: relative !important;
  left: inherit;
  transform: inherit;
}

.backnumber {
  padding-left: 1em;
}

.home a::before {
  content: "";
  width: 36px;
  height: 36px;
  background: url(/images/ico-home_black.png) no-repeat;
  background-size: contain;
  position: absolute;
}

#Nav .navlist li._active a p {
  color: #3D3D3D;
}

#Page.menuContents div#Contents {
  padding-bottom: 0;
}