@charset "utf-8";
/* 「お盆玉」レスポンシブCSS */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700,900&display=swap&subset=japanese');
/**/
/*★ リセット ★*/
.main div:not([class])::after {
  content: none;
}
.main a {
  text-decoration: none;
}
.main b {
  font-weight: normal;
}
.main .is-em {
  font-weight: bold;
}

.bnr {
  margin: 0 auto;
  text-align:center;
  padding:5px;
}

.bnr a:hover {
  opacity:0.8;
  transition:0.2s;
}

.nopc {
  display:none;
}
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
#hisApp {
  position: relative;
  font-family: "Noto Sans JP", sans-serif;
}
:root {
  --icon-arrow-right-white: url("/cmn/icon/icon_arrow_right_white.svg");
  --icon-blank-white: url("/cmn/icon/icon_launch_white.svg");
  --default-color-bg: #002975;
  --default-font-size-pc-val: 16;
  --default-font-size-pc: 16px;
  --default-font-size-sp: calc(20vw / 7.5);
  --default-font-size: min(var(--default-font-size-sp), var(--default-font-size-pc));
  --default-width-pc: 992px;
  --default-width: min((670vw / 7.5), var(--default-width-pc));
  --default-bg-width-pc: max(100%, 1920px);
  --default-bg-setting: no-repeat center center / cover;
  --default-icon-arrow-right-white: var(--icon-arrow-right-white) var(--default-bg-setting);
  --default-icon-blank-white: var(--icon-blank-white) var(--default-bg-setting);
}
.main {
  font-family: "Noto Sans JP", sans-serif;
  font-size: var(--default-font-size);
  color: #000;
  line-height: calc(22 / var(--default-font-size-pc-val));
  overflow: hidden;
  background:#fecb1a;
}
.main.is-bg-gradation {
  position: relative;
  @media (width >=860px) {
    --bg-size-h: 1121px;
    --bg-posi: 759px;
  }

  > * {
    position: relative;
  }
}
.is-inline-block {
  display: inline-block;
}
.base-button {
  display: grid;
  justify-content: center;
}
.base-button__link {
  display: grid;
  justify-items: center;
  align-items: center;
  text-align: center;
  grid-template-columns: 1fr 1em;
  gap: 0 .5em;
  line-height: 1.2;
  height: 100%;
  min-height: 3em;
  min-width: min((670vw/ 7.5), 400px);
  font-size: min((28vw/ 7.5), 20px);
  font-weight: bold;
  color: #fff;
  background: #002975;
  border-radius: 200px;
  padding: .4em 1em .5em 1.5em;
  text-indent: .5em;
  box-shadow: 0px 3px 0px 0px rgb(0 0 0 / .23);
}
.base-button__link::after {
  content: "";
  width: 100%;
  height: 1.5em;
  background: var(--default-icon-arrow-right-white);
}
.base-button__link[target="_blank"]::after {
  height: 1em;
  background: var(--default-icon-blank-white);
}
.base-button__link[href^="#"]:not([target="_blank"])::after {
  transform: rotate(90deg);
}
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
/*mv*/

 .mv {
    height: 40vw;
    text-align: center;
    background: url("../images/mv_bg_pc.jpg") no-repeat top center / 100%;
  }
 

#lead {
  padding: min((100vw / 7.5), 20px) 0;
  color: #000000;
  font-weight: bold;
  font-size: min((20vw / 7.5), 24px);
  line-height: calc(42 / 24);
  text-align: center;
}


.midashi {
  color:#144679;
  font-size:4rem;
  line-height:1.2;
  margin-bottom:50px;
}

.midashi span {
  font-size:3rem;
}

.midashi2 {
  color:#ff0047;
  font-size:2.5rem;
  margin-top:40px;
}



/*------------------------------------------------*/
/*★ ＝＝ mainArea ＝＝ ★*/
#mainArea {
  padding: min((108vw / 7.5), 90px) 0 min((80vw / 7.5), 100px);
}
.main:has(#lead) #mainArea {
  padding-top: 0;
}
.section__inner, .contents__wrapper {
  width: var(--default-width);
  margin: auto;
  position: relative;
}
.winning__inner, .campaign__detail {
  border-radius: min((20vw / 7.5), 20px);
  padding: min((40vw / 7.5), 40px);
  font-weight: bold;
}
.section + .section {
  padding-top: min((60vw / 7.5), 60px);
}
/*winning*/
.winning__inner {
  background: rgba(255, 255, 255, .9);
  padding-top: 0;
  text-align: center;
}
.winning__inner::before, .winning__inner::after {
  content: "";
  display: block;
  background: url("../images/winning_kazari_flag.png") no-repeat 0 0 / contain;
  width: min((168vw / 7.5), 247px);
  height: min((77vw / 7.5), 113px);
  position: absolute;
  top: 0;
  left: 0;
}


.tokusyu, .reco-banner__list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  background: #fff;
}
.reco-banner__list {
  padding: min((39vw / 7.5), 30px);
  gap: min((38vw / 7.5), 40px);
  margin-top: min((50vw / 7.5), 40px);
}
.reco-banner__item {
  width: min((296vw / 7.5), 192px);
}
.tokusyu li a, .reco-banner__link {
  display: block;
  box-shadow: 0px 0px 0px 1px #000;
  transition: opacity .4s;
}
.tokusyu li a:hover, .reco-banner__link:hover {
  box-shadow: 0px 0px 0px 2px #000;
  opacity: 0.6;
}
.tokusyu li img, .reco-banner__image {
  width: 100%;
}
@media screen and (max-width: 750px) {
  .winning__inner::before, .winning__inner::after {
    top: max((-12vw / 7.5), -12px);
  }
}
.winning__inner::after {
  transform: scale(-1, 1);
  right: 0;
  left: auto;
}
.winning__title, .winning__detail {
  position: relative;
  z-index: 1;
}
.winning__title--text, .winning__detail--title--text {
  width: auto;
  object-fit: contain;
}
.winning__title {
  margin-bottom: min((10vw / 7.5), 10px);
}
.winning__title--text {
  height: min((125vw / 7.5), 125px);
  margin-top: max((-60vw / 7.5), -60px);
}
.winning__detail {
  display: grid;
  gap: min((50vw / 7.5), 50px);
}
.winning__detail::before, .winning__detail::after {
  content: "";
  background: no-repeat 0 0 / contain;
  position: absolute;
}
.winning__detail::before {
  background-image: url("../images/winning_kazari_cracker_left.png");
  width: min((178vw / 7.5), 281px);
  height: min((203vw / 7.5), 319px);
  top: min((250vw / 7.5), 165px);
  left: max((-82vw / 7.5), -81px);
}
.winning__detail::after {
  background-image: url("../images/winning_kazari_cracker_right.png");
  width: min((173vw / 7.5), 272px);
  height: min((207vw / 7.5), 325px);
  top: min((248vw / 7.5), 162px);
  right: max((-83vw / 7.5), -75px);
}
.winning__detail--title {
  margin-bottom: min((20vw / 7.5), 20px);
}
.winning__detail--item.is-toku .winning__detail--title--text {
  height: min((145vw / 7.5), 145px);
}
.winning__detail--item.is-1st .winning__detail--title--text {
  height: min((77vw / 7.5), 77px);
}
.winning__detail--item.is-2nd .winning__detail--title--text {
  height: min((68vw / 7.5), 68px);
}
.winning__detail--item.is-3rd .winning__detail--title--text {
  height: min((61vw / 7.5), 61px);
}
.winning__detail--target {
  display: grid;
  grid-template-columns: min((580vw / 7.5), 580px);
  row-gap: min((10vw / 7.5), 10px);
  justify-content: center;
}
.winning__detail--item.is-1st .winning__detail--target {
  grid-template-columns: min((360vw / 7.5), 360px);
}
.winning__detail--item.is-2nd .winning__detail--target {
  grid-template-columns: repeat(2, 1fr);
  column-gap: min((40vw / 7.5), 40px);
}
.winning__detail--item.is-3rd .winning__detail--target {
  grid-template-columns: repeat(3, 1fr);
  column-gap: min((14vw / 7.5), 14px);
}
@media screen and (min-width: 961px) {
  .winning__detail--item.is-1st .winning__detail--target {
    grid-template-columns: repeat(2, 1fr);
    column-gap: min((40vw / 7.5), 40px);
  }
  .winning__detail--item.is-2nd .winning__detail--target {
    grid-template-columns: repeat(3, 1fr);
    column-gap: min((10vw / 7.5), 10px);
  }
  .winning__detail--item.is-3rd .winning__detail--target {
    grid-template-columns: repeat(4, 1fr);
    column-gap: min((20vw / 7.5), 20px);
  }
}
.winning__detail--target--item {
  background: #fff;
  border-radius: 500px;
  color: #d81230;
  font-size: min((60vw / 7.5), 60px);
  line-height: 1;
  padding: .2em .5em .35em;
  text-decoration: none;
}
.winning__detail--item.is-1st .winning__detail--target--item {
  font-size: min((36vw / 7.5), 40px);
}
.winning__detail--item.is-2nd .winning__detail--target--item {
  font-size: min((28vw / 7.5), 30px);
}
.winning__detail--item.is-3rd .winning__detail--target--item {
  font-size: min((20vw / 7.5), 20px);
}
/*campaign*/
.campaign__detail {
  background: #fff;
  display: grid;
  gap: 1em 0;
}
.campaign__detail:not(:last-child) {
  margin-bottom: min((45vw / 7.5), 50px);
}
.campaign__detail--title {
  display: inline-block;
  background: #ff005a;
  color: #fff;
  font-size: min((16vw / 7.5), 12px);
  line-height: 1;
  padding: .4em 1em .5em;
  margin-bottom: .25em;
}
.campaign__detail--notes {
  font-size: min((15vw / 7.5), 14px);
  margin-top: .2em;
}
.campaign__detail--notes--item {
  text-indent: -1em;
  padding-left: 1em;
}
.campaign__detail--notes--item:not(:first-child) {
  margin-top: .3em;
}
.campaign__detail--item [class*="is-indent-"] {
  display: block;
}
.campaign__detail--item [class*="is-indent-"]:not(:first-child) {
  margin-top: .25em;
}
.is-indent-6 {
  text-indent: -6em;
  padding-left: 6em;
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .base-button__link {
    transition: background .3s;
  }
  .base-button__link:hover {
    background: #6592e5;
  }
}

@media only screen and (min-width: 741px) {
    .breadcrumb {
        width: 100%;
        margin: 0 auto;
    }
	
	
	
}


/*------------------------------------------------
	LINEお友達登録ボタン
--------------------------------------------------*/
.line-wrap-detail {
	padding: 0;
    background: #fff;
	padding-bottom: 50px;
}

.line-inner {
    background: #fff;
    border: solid 1px #d3d3d3;
    width: 992px;
    margin: 0 auto;
	text-align: center;
}
.line-inner .head {
	width: 100%;
    text-align: center;
    background-color: #15c618;
    padding: 6px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
}

.textarea {
	margin-top:10px;
}
.line-inner .text1 {
    font-size: 17px;
    line-height: 1.4em;
}
.line-inner .text1 span {
	font-weight: bold;
	color: #fb0b0b;
}
.line-inner .text2 {
    font-size: 21px;
    font-weight: bold;
    margin-bottom: -2px;
    background: linear-gradient(transparent 60%, #fff231 0%);
    display: inline-block;
    line-height: 1.7em;
    padding: 0 4px;
}
.line-button {
	width: 340px;
}
.line-button a {
	display: block;
    color: #fff;
    font-size: 20px;
    text-align: center;
    font-weight: bold;
    border-radius: 100px;
    box-shadow: 0px 3px 0px 0 rgba(0, 0, 0, .14);
    background-color: #15c618;
    padding: 14px 10px;
    position: relative;
    text-decoration: none;
}
.line-button a:hover {
	opacity: .8;
	transition: all 0.6s ease;	
}
.line-button a span.small {
	display: block;
	font-size: 14px;
	font-weight: normal;
}
.line-button a span.strong {
	position: relative;
	display: inline-block;
}
.line-button a span.strong::after {
    font-family: "FontAwesome";
    font-weight: 900;
    content: "▶";
	font-size: 20px;
	margin-left: 5px;
}
.btnarea {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;

	width:45%;
}

.box {
		margin:20px 0;
	display:flex;
	flex-wrap: wrap;
	align-items: center;
	text-align: left;
	justify-content:center;
	
}

.btnarea .line-qr {
	width: 43%;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	text-align: left;
}


.btnarea .line-qr:last-of-type {
	flex-wrap: nowrap;
	margin-left: 20px;

}
.btnarea .line-qr {
    display: inline-block;
    width: 80px;
    margin-right: 8px;
}
.btnarea .line-qr img {
	width: 100%;
}

@media only screen and (max-width:740px){
.mv {
  height: 90vw;
  background: url("../images/mv_bg_sp.jpg") no-repeat center top / 100%; 
}
.mv__inner {
  display: grid;
  justify-content: center;
  padding: calc(340vw / 7.5) 0 ;
}

  .midashi {

  font-size:2.5rem;
    margin-bottom:15px;
}

.midashi span {
  font-size:2rem;
}

  .nosp {
    display:none !important;
  }

  .nopc {
    display:block;
  }

  .midashi2 {

  font-size:1.2rem;
  margin-top:20px;
}
	.line-inner {
   		 width: 98%;
	}
	
	.btnarea {
		width:95%;
		margin-bottom:10px;
	}
	
	.line-button {
		width: 100%!important;
	}
	
}

@media only screen and (max-width:1024px){
	.line-inner {
   		 width: 100%;
	}
	
	.line-button {
		width: 250px;
	}
}