@charset 'UTF-8';

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap');

/* Body setting
------------------------------------------------------------------------------- */
html {
  font-size: 62.5%;
  font-family: 'Noto Sans JP', sans-serif;
  /* ベース:10px */
}

/*
font-size(指定：例)

1.0rem = 10px; / 1.2rem = 12px; / 1.4rem = 14px; / 1.6rem = 16px; / 1.8rem = 18px; / 2.0rem = 20px;
*/
body {
  background: #fff;
  color: #343434;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.6;
  font-family: "Roboto-Medium", 'Noto Sans JP', 'Roboto-Medium JP', 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
}

/* header */
header {
  padding: 30px 0;
  z-index: 999;
}

header button {
  padding: 20px !important;
}

.drawer-open header button {
  padding: 3em 1em !important;
  right: 1em !important;
}
.drawer-open.drawer--right header .drawer-nav {
  right: 0 !important;
}

.drawer--right header .drawer-nav {
  width: 100% !important;
  right: -100% !important;
  overflow: scroll !important;
  background: #000000f0;
}


header ul {
  margin: .5em !important;
}

header ul.drawer-menu {
  padding: 100px 1em 0 !important;
}
header ul.drawer-menu li+li {
  margin-top: 60px;
}

header ul.drawer-menu li a {
  font: normal normal bold 18px/24px  'Noto Sans JP';
  text-align: center;
  color:#fff;
}

header .drawer-hamburger {
  width: 50px !important;
}
header .drawer-hamburger-icon {
  margin-top: 11px !important;
}

header .drawer-hamburger-icon,
header .drawer-hamburger-icon:after,
header .drawer-hamburger-icon:before {
  height: 5px !important;
  background:#828C8C;
}
.drawer-open header .drawer-hamburger-icon:before,
.drawer-open header .drawer-hamburger-icon:after{
  top: 0!important;
  background: #fff;
}
header .drawer-hamburger-icon:after {
  top: 12px!important;
}
header .drawer-hamburger-icon:before {
  top: -12px!important;
}

/* footer */
footer {
  padding: 6rem 2rem 5rem;
  text-align: center;
  font: normal normal bold 18px/24px 'Noto Sans JP';
}
footer #link a+a{
  margin-left: 1em;
}

 /* parts */
main {
  padding: 0 20px;
  max-width: 650px;
  margin: auto;
}
section+section{
  margin-top: 6rem;
}
img {
  max-width: 100%;
  height: auto;
}

.btn-box{
  margin-left: auto;
  margin-right: auto;
}
.btn-box a {
  padding: 1em;
  text-align: center;
  border-radius: 2rem;
  margin: 1.5em 0;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  -ms-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
  display: block;
  font-size: 2rem;
  letter-spacing: .5px;
}
.btn-box a::after {
  content: "";
  display: inline-block;
	width: .6em;
	height: .6em;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
  margin-left: 0.5rem;
}
.btn-box a:hover {
  opacity: 0.75;
}

.btn-box .btn-rd {
  background: #fc7f2a;
  color: #fff;
  box-shadow: 0px 5px 0px 0px rgba(144, 73, 25, 1);
}

.btn-box .btn-gn {
  background: #009571;
  color: #fff;
  box-shadow: 0px 5px 0px 0px #135600;
}
.btn-box .btn-ye {
  background: #FCBE03;
  color: #fff;
  box-shadow: 0px 5px 0px 0px #DD8703;
}

.h2-ttl{
  text-align: center;
  font: normal normal bold 32px/43px 'Noto Sans JP';
  color: #828C8C;
}
.h2-ttl::after{
  content: "";
  display: block;
  width: 100px;
  height: 4px;
  background: #828C8C;
  margin: 2rem auto 0;
}

@media screen and (min-width:768px) {
  /* parts */
  main {
    max-width: 900px;
    margin: auto;
  }
  .btn-box a {
    font-size: 4rem;
    padding: 0.5em 1em;
  }
  }

/* top */
/* keyvisual */
#keyvisual img {
  display: block;
  margin: 0 auto;
  padding-bottom: 30px;
}
@media screen and (min-width:768px) {
  #keyvisual img {
    padding-bottom: 60px;
  }
}
/* KV下 */
@media screen and (min-width:768px) {
  #lead .pc-d-f {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }
  #lead .pc-d-f .col-l{
    width: 55%;
  }
  #lead .pc-d-f .col-r{
    width: 45%;
  }
}
/* 期間 */
#kikan table {
  margin-bottom: 50px;
  margin-top: 1rem;
}
#kikan table tr{
  font: normal normal bold 14px/19px 'Noto Sans JP';
}
#kikan table tr th{
  vertical-align: middle;
  background: #828C8C;
  padding: 0 5rem;
  color: #FFFFFF;
  letter-spacing: 3px;
}
#kikan table tr td{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 1rem 0;
  width: 100%;
}
#kikan table tr td img{
  display: inline-block;
  padding: 0 10px 0 5px;
}
@media screen and (min-width:768px) {
  #kikan table {
    margin-bottom: 60px;
  }
  #kikan table tr{
    border-bottom: 3rem solid #fff;
  }
  #kikan table tr th{
    font: normal normal bold 22px/30px 'Noto Sans JP';
  }
  #kikan table tr td{
    font: normal normal bold 24px/33px 'Noto Sans JP';
    padding-left: 3rem;
    letter-spacing: 9px;
  }
}
@media screen and (max-width:767px){
#kikan table{
  width: 100%;
}
#kikan table tr th{
  display: inline-block;
  padding: 2.5vw 5vw;
  font-size: 4vw;
}
#kikan table tr td {
  padding: 4vw 0 7vw;
  font-size: 4.5vw;
  justify-content: center;
}
}
/* キャンペーン対象モデル */
.cp-target-model{
  border: 1px solid #009571;
  text-align: center;
}
.cp-target-model h2{
  padding: .5em;
  font: normal normal bold 22px/30px 'Noto Sans JP';
  background: #009571;
  color: #FFFFFF;
}
.cp-target-model p{
  font: normal normal bold 22px/30px 'Noto Sans JP'!important;
}
.cp-target-model img{
  padding: 2em;
}
@media screen and (min-width:768px) {
  .cp-target-model h2{
    font: normal normal bold 32px/43px 'Noto Sans JP';
  }
  .cp-target-model .pc-d-f{
    padding: 3.6rem;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
  }
  .cp-target-model .pc-d-f .cp-target-model-txt{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  .cp-target-model .pc-d-f .cp-target-model-txt .btn-box a{
    font-size: 3rem;
    padding: .9em;
    margin-bottom: 0;
    min-width: 420px;
  }
  .cp-target-model p{
    font: normal normal bold 40px/55px 'Noto Sans JP'!important;
  }
}
@media screen and (max-width:767px){
  .cp-target-model .pc-d-f img{
    margin: 1em 0;
  }
}

/* 応募方法 */
#oubo .oubo-item .d-f{
  gap: 3rem;
  margin-top: 5rem;
}
#oubo .oubo-item .oubo-img img{
  min-width: 120px;
}
#oubo .oubo-item .oubo-txt{
  font: normal normal normal 18px/30px 'Noto Sans JP';
  letter-spacing: 0.9px;
}
@media screen and (min-width:768px) {
  #oubo .pc-d-f{
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 6rem;
    margin-top: 60px;
  }
  #oubo .pc-d-f .oubo-item {
   width: calc(50% - 3rem);
  }
}
@media screen and (max-width:767px){
  #oubo .oubo-item{
    margin-top: 60px;
  }
}
/* キャンペーン要項 */
#cp .cp-txt h3{
  margin: 6rem 0 2rem;
  font: normal normal bold 22px/30px 'Noto Sans JP';
  letter-spacing: 1.1px;
  color: #EA4334;
}
#cp p{
  font: normal normal normal 18px/30px 'Noto Sans JP';
  letter-spacing: 0.9px;
}
#cp p small{
  margin: 2rem 0 0;
  font: normal normal normal 14px/22px 'Noto Sans JP';
  letter-spacing: 0.7px;
  display: inline-block;
}
#cp .cp-bg-ye{
  margin-top: 3rem;
  background: #fff8e5;
  border-radius: 2rem;
  padding: 2.5rem 2rem 1rem;
}
#cp .cp-bg-ye h3{
  text-align: center;
  font: normal normal bold 22px/30px 'Noto Sans JP';
  letter-spacing: 1.1px;
  color: #FCBE03;
  margin-bottom: 2.5rem;
}
@media screen and (min-width:768px){
  #cp{
    margin-top: 11rem;
  }
  #cp .cp-bg-ye {
    margin-top: 6rem;
    border-radius: 2rem;
    padding: 3rem 5rem 1rem;
}
  #cp .cp-bg-ye .btn-ye {
    max-width: 420px;
    font-size: 3rem;
    margin: 3rem auto;
}
}

#lottery{
  margin: 0 -2rem;
}

#lottery img{
  margin: auto;
  display: block;
}
#lottery.bg{
  background: url(../img/lottery-loading.jpg);
  background-size: contain;
  max-width: 780px;
}
@media screen and (min-width:780px) {
  #lottery.bg{
    margin: auto;
  }
}
#lottery.bg img{
  opacity: 0;
}
#lottery.bg img.opacity1{
  opacity: 1;
  -webkit-transition: .5s ease;
    -moz-transition: .5s ease;
    -ms-transition: .5s ease;
    -o-transition: .5s ease;
    transition: .5s ease;
}


/*display*/
.d-n{display:none}
.d-b{display:block}
.d-tc{display:table-cell}
.d-f{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (min-width:768px){
.pc-d-n{display:none!important}
.pc-d-b{display:block}
.pc-d-tc{display:table-cell}
.pc-d-f{
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
}
@media screen and (max-width:767px){
.sp-d-n{display:none}
.sp-d-b{display:block}
.sp-d-tc{display:table-cell}
}

/*background*/
.bg-wt{background:#fff}
.bg-gy{background:#E8ECEC}
.bg-ye{background:#FFF000}

.max-w250{
  max-width: 250px;
}
@media screen and (max-width:767px){
.sp-max-w300{
  max-width: 300px;
}
}
.m60{
  margin: 6rem 0 !important;
}