/*====================================================
////id |  mv
====================================================*/
#mv {
 display: grid;
 grid-template-rows: 1fr auto;
 overflow: hidden;
}

#mv .coverImg {
 padding-top: 60%;
}

#mv .coverImg picture {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

#mv .slick-dots {
 justify-content: flex-end;
 position: absolute;
 bottom: 10px;
 right: 5vw;
}

#mv .slick-dots li button:before {
 background: #fff;
}

#mv .slick-dots li.slick-active button:before {
 background: var(--d_gray2);
}

#mv .linkBox {
 position: absolute;
 right: 5vw;
 bottom: 60px;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
 #mv .linkBox {
  bottom: 40px;
 }

 #mv .linkBtn {
  font-size: .8em;
  min-width: 0;
  min-height: 0;
 }
}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {
 /* #mv {
    height: 80vw;
      max-height: calc(100vh - 100px);
      min-height: 600px;
  } */
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {
 #mv .coverImg {
  padding-top: 760px;
 }
}

@media (hover: hover) {}

/*====================================================
////id |  slider_article
====================================================*/
#slider_article .item {
 padding: 0 min(1vw, 14px);
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}

/*====================================================
////id |  search
====================================================*/
#search .head_text {
 line-height: 1.4;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
 #search .head_text {
  font-size: 1.2em;
 }

 #search .ex_text {
  font-size: 12px;
 }

 #search .searchform {
  font-size: 1.1em;
 }
}

@media screen and (max-width:500px) {
 #search .ex_text {
  font-size: 3.0vw;
  letter-spacing: 0;
 }
}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {
 #search .txtBox {
  font-size: 2.4rem;
 }

 #search .head_text {
  font-size: 3.6rem;
 }

 #search .searchform {
  font-size: 2.4rem;
 }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
 #search .txtBox {
  font-size: 2.0rem;
 }

 #search .head_text {
  font-size: 3.0rem;
 }

 #search .searchform {
  font-size: 2.4rem;
 }
}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}

/*====================================================
////id |  archive
====================================================*/
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
 .archive_item:nth-child(2) {
  grid-column: span 1;
 }
}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {
 .archive_itemBox {
  grid-gap: 45px;
 }
}

@media (hover: hover) {}

/*====================================================
////id |  pickup
====================================================*/
#pickup .headBox .decoBox,
#pickup .linkBox .decoBox {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
}

#pickup .headBox .decoBox::before,
#pickup .headBox .decoBox::after,
#pickup .linkBox .decoBox::before,
#pickup .linkBox .decoBox::after {
 content: '';
 display: block;
 margin: auto;
 position: absolute;
}

#pickup .headBox .decoBox::before {
 background: url('../img/cmn/deco-bubble-1.png') no-repeat left center / contain;
 top: -80px;
 left: -2vw;
 bottom: -50px;
 width: min(16vw, 250px);
 height: min(16vw, 250px);
}

#pickup .headBox .decoBox::after {
 background: url('../img/cmn/deco-bubble-2.png') no-repeat right center / contain;
 top: -80px;
 right: -2vw;
 bottom: -50px;
 width: min(10vw, 152px);
 height: min(15vw, 227px);
}

#pickup .linkBox .decoBox::before {
 background: url('../img/cmn/deco-bubble-3.png') no-repeat left center / contain;
 top: 50px;
 left: -2vw;
 width: min(15vw, 200px);
 height: min(10vw, 200px);
}

#pickup .linkBox .decoBox::after {
 background: url('../img/cmn/deco-bubble-4.png') no-repeat right center / contain;
 top: 30px;
 right: -2vw;
 width: min(15vw, 150px);
 height: min(15vw, 230px);
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
 #pickup .headBox .decoBox::before {
  background: url('../img/cmn/deco-bubble-5.png') no-repeat left center / contain;
  top: -35px;
  left: 0;
  width: min(30vw, 85px);
  height: min(40vw, 133px);
 }

 #pickup .headBox .decoBox::after {
  top: -40px;
  right: 0;
  width: min(20vw, 71px);
  height: min(30vw, 105px);
 }
}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}

/*====================================================
////id |  new
====================================================*/
#new .bg_decoBox {
 background: var(--blue) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 710 140"><path fill="%23FFFA6F" d="M623.58,118.61c-46.92,3.37-46.77-68.67-93.68-72.18-41.94-3.14-58.19,67.54-98.58,57.62-40.38-9.91-13.34-85.9-53.72-95.81-40.38-9.91-54.46,59.39-96.52,57.75C234.29,64.16,229.12-6.11,182.96.43c-46.16,6.54-30.13,84.65-76.29,91.19C61.18,98.06,44.62,22.29,0,26.3v113.7h710V26.21c-46.64,3.68-39.59,89.03-86.42,92.4Z" /></svg>') repeat-x center / auto 100%;
 margin-top: -5px;
 left: 0;
 position: relative;
 width: 100%;
 height: 18vw;
 max-height: 140px;
}

#new .bg_decoBox::after {
 background: var(--l_yellow);
 content: '';
 display: block;
 position: absolute;
 bottom: -1px;
 left: 0;
 width: 100%;
 height: 2px;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}

/*====================================================
////id |  ranking
====================================================*/
#ranking {
 overflow: hidden;
}

#ranking .bg_decoBox {
 background: var(--l_yellow) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 600 70"><path fill="%2345B2F1" d="M438.94,69.75c-112.01-4.47-164.15-49.17-256.49-65.17C85.39-12.24,0,22.69,0,22.69v47.31h600V22.69s-13.25,4.84-55.34,25.36c-19.98,9.74-61.52,23.46-105.72,21.7Z" /></svg>') repeat-x bottom center / auto 100%;
 position: relative;
 left: -1%;
 width: 102%;
 height: 12vw;
 max-height: 150px;
 box-sizing: content-box;
}

/*
#ranking .bg_decoBox::before {
 background: var(--l_yellow);
 content: '';
 display: block;
 margin: auto;
 position: absolute;
 top: -1px;
 left: 0;
 width: 100%;
 height: 1px;
 z-index: 10;
 box-sizing: border-box;
} */

#ranking .bg_decoBox::before {
 background: var(--blue);
 content: '';
 display: block;
 margin: auto;
 position: absolute;
 bottom: -1px;
 left: 0;
 width: 100%;
 height: 1px;
 z-index: 10;
 box-sizing: border-box;
}

#ranking .bg_decoBox::after {
 background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 50 72"><path fill="%2345B2F1" d="M13.66,5.6c1.79-1.51,3.78-2.76,5.91-3.72,5.56-2.48,12.79-2.56,18.89.06,8.39,3.6,11.66,13.68,8.57,21.27-5.76,14.18-20.14,17.02-30.5,26.75-7.21,6.77-11.64,16.56-11.51,16.36.36-.53-1.89-4.96-2.12-5.64C-3,43.41-.13,17.2,13.66,5.6M37.4,52.58c1.31.17,2.6.5,3.83.98,3.4,1.38,6.2,3.92,7.9,7.17,1.91,3.59.56,8.05-3.01,9.96-.36.19-.74.36-1.13.49-7.58,2.62-14.65-1.86-22.53-2.49-3.63-.21-7.28.19-10.78,1.18.34-.04,1.01-2.39,1.16-2.72,3.81-8.09,14.55-15.87,24.56-14.58" /></svg>') no-repeat center / contain;
 content: '';
 display: block;
 margin: auto;
 position: absolute;
 top: 5%;
 left: 72%;
 width: 8%;
 height: 70%;
}

#ranking .archive_item a::before {
 content: '';
 display: block;
 margin: auto;
 position: absolute;
 top: .5em;
 right: .5em;
 width: 25%;
 min-width: 35px;
 max-width: 6em;
 height: 6em;
 z-index: 5;
}

@media screen and (max-width: 769px) {
 #ranking .archive_item a::before {
  width: 15%;
  max-width: 50px;
 }
}

#ranking .archive_item:nth-child(1) a::before {
 background: url('../img/cmn/rank-1.webp') no-repeat top center / contain;
}

#ranking .archive_item:nth-child(2) a::before {
 background: url('../img/cmn/rank-2.webp') no-repeat top center / contain;
}

#ranking .archive_item:nth-child(3) a::before {
 background: url('../img/cmn/rank-3.webp') no-repeat top center / contain;
}

#ranking .archive_item:nth-child(4) a::before {
 background: url('../img/cmn/rank-4.webp') no-repeat top center / contain;
}

#ranking .archive_item:nth-child(5) a::before {
 background: url('../img/cmn/rank-5.webp') no-repeat top center / contain;
}

#ranking .archive_item .category {
 width: 70%;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
 #ranking .bg_decoBox {
  background-size: contain;
  height: 24vw;
 }

 #ranking .bg_decoBox::after {
  top: 0;
  left: 65%;
  width: 25%;
  height: 75%;
 }
}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {
 #ranking .bg_decoBox::after {
  left: calc(50% + 300px);
 }
}

@media (hover: hover) {}

/*====================================================
////id |  area
====================================================*/
#area .bg_decoBox {
 background: var(--blue) url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 600 70"><path fill="%23FFFA6F" d="M438.94,69.75c-112.01-4.47-164.15-49.17-256.49-65.17C85.39-12.24,0,22.69,0,22.69v47.31h600V22.69s-13.25,4.84-55.34,25.36c-19.98,9.74-61.52,23.46-105.72,21.7Z" /></svg>') repeat-x center / auto 100%;
 margin-top: -5px;
 position: relative;
 transform: scale(-1, 1);
 width: 100%;
 height: 12vw;
 max-height: 170px;
}

#area .bg_decoBox::before,
#area .bg_decoBox::after {
 content: '';
 display: block;
 margin: auto;
 position: absolute;
 left: 0;
 width: 100%;
 height: 2px;
}

#area .bg_decoBox::before {
 background-color: var(--blue);
 top: -2px;
}

#area .bg_decoBox::after {
 background-color: var(--l_yellow);
 bottom: -1px;
}

#area .innerBox {
 padding-top: 30px;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}

/*====================================================
////id |  event
====================================================*/
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {}

@media screen and (max-width:500px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769px) {}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {}

@media screen and (min-width:1300px) {}

@media (hover: hover) {}
