@charset "utf-8";
/* CSS Document */
/*レスポンシブ対応の時、スマホサイズは800pxで統一
@media screen and (max-width: 800px) {}*/

/*==========================================
 gloval
===========================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
li {
    list-style-type: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

::before , ::after {
    box-sizing: inherit;
}

button {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    vertical-align: middle;
    text-align: inherit;
    font: inherit;
    -webkit-appearance: none;
    appearance: none;
}
body {
  margin: 0 auto;
  line-height: 1;
  font-family:"Hiragino Sans", "ヒラギノ角ゴ Pro W3", Meiryo, 'メイリオ', "ＭＳ Ｐゴシック", sans-serif, Arial;
  -webkit-text-size-adjust: 100%;
  padding: 0;
  font-size: 16px;
  font-size: 1.6rem;
}
html {
    font-size: 62.5%;
    background:white;
    scroll-behavior: smooth;
}
* {
  margin: 0;
  padding: 0;
}
a {
  color: #333;
}
a:link {
  text-decoration: none;
}
a:hover {
    color: #6284ff;
    text-decoration: none;
}
img {
    width: 100%;
    max-width: 1000px;
    display: block;
    height: auto;
    vertical-align: middle;
    text-align: center;
    margin: auto;
    border: 0;
}
#w_1400{
  margin: 0 auto;
  max-width: 1400px;
}

#w_800 {
    margin: 0 auto;
    max-width: 100%;
    overflow: hidden;
    text-align: center;
}

.pc_800{
  width:800px;
  margin: 0 auto;
}

.pc_900{
  width:900px;
  margin: 0 auto;
}

.pc_1000{
  width:1000px;
  margin: 0 auto;
}

h1, h2, h3 {
    margin: 0;
    padding: 0;
}
/*テキストの基本サイズ*/
p , li{
    font-feature-settings: "palt";
    letter-spacing: 0.5px;
    text-align: justify;
}
p{
    font-size: 20px;
    line-height: 1.7em;
}
h1, h2, h3, h4, h5 {
    line-height: 1.6em;
    font-weight: bold;
}
span{
    display:inline-block;
}
@media screen and (max-width: 800px) {
p {
    font-size: 16px;
    line-height: 1.7em;
}
}


/*==========================================
 common
===========================================*/

.pc {
  display: block;
}
.sp {
  display: none;
}
.center {
  text-align: center;
}
.right {
  text-align: right;
}
.left {
  text-align: left;
}

@media screen and (max-width: 800px) {
.pc {
    display: none;
}
.sp {
    display: block;
}
}

/*余白設定*/

.mb_ss{
    margin-bottom:24px;
}
.mb_s{
    margin-bottom:24px;
}
@media screen and (max-width: 800px) {
.pc {
    display: none;
}
.sp {
    display: block;
}

.mb_ss{
    margin-bottom:6px;
}
.mb_s{
    margin-bottom:8px;
}
}

/*==========================================
 各セクション設定
===========================================*/

.lyellow{
  background-color: #fff6c4;
}

.skyblue{
  background-color: #c2dde7;
}

.yellow{
  background-color: #fded7b;
}


.grey{
  background-color: #a4a4a4;
}

.lgrey{
  background-color: #f3f5f4;
}


.white{
  background-color: #fff;
}

.navy{
  background-color: #234493;
}

.form_area{
    background-color: #234493;
    background-position: center;
    background-attachment: fixed;
    background-size: 100%;
}

.form_area2{
    background-color: #234493;
    background-position: center;
    background-attachment: fixed;
    background-size: 100%;
}

.form_inner{
    width: 740px;
    margin: 0 auto;
    line-height: 0;
    background-size: cover;
    background-position: center;
    padding:0 0px 30px;
    text-align: center;
}

.form_message{
  margin:0 auto 20px;
}

ul.chart_box li{
    margin-bottom:30px;
}

@media screen and (max-width: 800px) {
.form_area{
        background-size: 230%;
}

.form_inner{
    width: 100%;
    max-width: 100%;
    padding:0 0 30px;
    }

    .form_message{
      width:100%;
      margin:0 auto 10px;
    }
}


/*==========================================
 詳細CSS
===========================================*/
.header_img{
    width:100%;
    max-width:1920px;
    margin:auto;
}

.relative {
    position: relative;
}
video.mainvid {
    width: 100%;
}
.vid_absolute{
    position: absolute;
    width: 100%;
    max-width: 630px;
    top: 58%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}

.vid_absolute01{
    width: 96%;
    padding:10px 0 20px 0;
    margin:0 auto;
}

.vid_absolute02{
    width: 100%;
    max-width: 630px;
    padding:20px 0 20px 0;
    margin:0 auto;
}


.p_detail{
    font-size: 16px;
    width: 100%;
    max-width: 800px;
    margin: 10px auto 0;
    text-align: left;
    line-height:1.5em;
}
.p_white{
    color: white;
}


@media screen and (max-width: 800px) {
.vid_absolute {
    width: 87%;
}
.p_detail {
    font-size: 11px;
    width: 100%;
    max-width: 90%;
}
}

/*期間限定テーブル*/
#sec01 table{
  max-width: 910px;
    width:91%;
    margin: 0 auto;
}

#sec01 table td{
text-align: center;
    width: 25%;
    padding: 35px 0;
    border:solid 1px;
    color:#fff;
    font-size: 24px;
    vertical-align: middle;
  }

#sec01 table tr td:first-child{
      background-color: #234493;
      line-height: 1.6em;
}

.today {
  color:#f5f200 ;

}
td.end {
    background: #464646;
}
td.accepting {
    background: #cb1025 !important;
    color:#f5f200 !important;
    font-size: 36px !important;
    border:solid white 1px !important;
}

.flash{
  font-weight: bold;
  animation: flash 2s linear infinite;
}

@keyframes flash {
  0%,100% {
    opacity: 1;
  }

  50% {
    opacity: 0.3;
  }
}

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

#sec01 table {
    width: 91%;
    margin: 0 auto;
    background-color: #234493;
}

#sec01 table tr td:first-child {
    text-align: center;
    padding-left: 2px;
    background-color: #234493;

}
#sec01 table td{
    text-align: center;
    width: 25%;
    padding: 20px 0;
    border:solid 1px;
    color:#fff;
    font-size: 14px;
    line-height: 1.6em;
    vertical-align: middle;
}
td.accepting {
    background: #cb1025 !important;
    color:#f5f200 !important;
    font-size: 24px !important;
    border:solid white 1px !important;
}
}

/*フッターメニュー*/
.address_wrap {
	width: 100%;
	background-color: #ff5a00;
	margin: 0 auto;
	padding: 0;
}
.address  {
	width: 100%;
	max-width: 1200px;
	line-height: 50px;
	font-style: normal;
	color: #fff;
	font-size: 15px;
	text-align: center;
	margin: 0 auto;
	padding: 16px 0;
    padding-bottom: 120px;
}
.bottom_navi {
	text-align: center;
}
.address a {
	color: #fff;
	text-decoration: none;
}
.address a:hover {
	color: #ccc;
}
.copy {
    text-align: center;
    line-height: 1.5em;
    display: block;
}
ul.footer_flex {
    display: flex;
    width: 100%;
    max-width: 800px;
    margin: auto;
    flex-wrap: wrap;
    align-content: stretch;
    justify-content: center;
    align-items: center;
    margin-bottom: 10px;
}
ul.footer_flex li+li {
    border-left: 1px solid #fff;
}
.footer_flex li {
    display: flex;
    width: 30%;
    line-height: 1.3em;
    height: 3em;
    text-align: center;
    padding: 0 4px;
    align-items: center;
    justify-content: center;
}
.footer_flex li p{
    font-size:15px;
    line-height: 1.3em;
    text-align: center;
    color:#8087a3;
}
.mail_box {
    margin: 20px 0px 30px 0px;
    text-align: left;
}
@media screen and (max-width: 800px) {
.footer_flex li {
    width: 50%;
    margin-bottom: 0.8em;

}
.footer_flex li:nth-of-type(4){
    border-left: none;
}
.address  {
    padding-bottom: 100px;
}
}
/*end　フッターメニュー*/

/* buttonBox
============================== */
button img {
    width: 100%;
    margin: auto;
}
.buttonBox {
  text-align: center;
}

.buttonBox_item {
  background-color: rgba(222, 237, 242, .9);
  border-top: none;
  bottom: 0;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  padding: 15px;
  position: fixed;
  width: 100%;
  z-index: 2;
}

.buttonBox_buttonLink {
    background: -webkit-linear-gradient(bottom, rgba(57,168,18,1) 0%, rgba(63,201,14,1) 100%);
    background: -o-linear-gradient(bottom, rgba(57,168,18,1) 0%, rgba(63,201,14,1) 100%);
    background: linear-gradient(to top, rgba(57,168,18,1) 0%, rgba(63,201,14,1) 100%);
    color: #fff;
    -webkit-box-shadow: 0 4px 0 0 #397823;
    box-shadow: 0 4px 0 0 #397823;
    border-radius: 3px;
    border-radius: 56px;
    font-weight: bold;
    border: none;
}

.buttonBox_buttonIcon {
  margin-left: 10px;
}

.buttonBox_buttonIconItem {
  display: inline-block;
  border-style: solid;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent #fff;
  height: 0;
  -webkit-transform: translateY(2px);
  transform: translateY(2px);
  width: 0;
}

.buttonBox_buttonIconItem + .buttonBox_buttonIconItem {
  margin-left: 4px;
}

.buttonBox_buttonIconItem {
  -webkit-animation: buttonIconAnimation 3s ease 0s infinite normal;
  animation: buttonIconAnimation 3s ease 0s infinite normal;
}

.buttonBox_buttonIconItem:nth-child(2) {
  -webkit-animation-delay: .5s;
  animation-delay: .5s;
  opacity: 0;
}

.buttonBox_buttonIconItem:nth-child(3) {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  opacity: 0;
}

@-webkit-keyframes buttonIconAnimation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  51% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes buttonIconAnimation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  51% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}



@media screen and (min-width: 1025px) {
  .buttonBox_item {
    height: 100px;
    min-width: 960px;
  }
  .buttonBox_text {
    color: #fff;
    font-size: 1.8rem;
    letter-spacing: .2rem;
    padding: 22px;
    width: 32vw;
  }
  .buttonBox_buttonLink {
    display: block;
    font-size: 2.2rem;
    height: 70px;
    left: calc(50% - 200px);
    line-height: 3.2rem;
    padding: 0 45px;
    position: absolute;
    width: 400px;
  }
  .buttonBox_buttonLink:hover {
    background-color: #1a924d;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
}


}

@media screen and (max-width: 1024px) {
  .buttonBox_item {
    height: 84px;
  }
  .buttonBox_text {
    display: none;
  }

  .buttonBox_buttonLink {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: inherit;
    flex-flow: inherit;
    font-size: 1.8rem;
    height: 50px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    line-height: 1.2;
    width: 90%;
  }
   .buttonBox_buttonIconItem {
    border-width: 7.5px 0 7.5px 8px;
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
}

}




/*lp8ex 流用分*/
.formtext {
    width: 90%;
    margin: 0 auto;
    padding: 3% 0;
}


.mfrom {
    width: 100%;
    /* text-align: center; */
    outline: 0;
    border: #231815 2px solid;
    color: #a6a8a8;
    font-size: 1.4vw;
    margin: 0 auto 5% auto;
    padding: 1.5% 3%;
}

.addFriend input{ width:100%;}

.form_box1 input{
    width: 100%;
    height: 0%;
    text-align: center;
    border-radius: 0;
    outline: 0;
    border: #afafaf 4px solid;
    color: #b9b9b9;
    font-size: 28px;
    margin: 0 auto 3% auto;
    border-radius: 15px;
    padding: 20px 0;
}

::placeholder {
    font-weight:bold;
    color: #afafaf;
}
/* 旧Edge対応 */
::-ms-input-placeholder {
    font-weight:bold;
    color: #afafaf;
}
/* IE対応 */
:-ms-input-placeholder {
    font-weight:bold;
    color: #afafaf;
}

.e1{display: none;}

.e2{}
.e3{}
.e4{}
.e5{}
.e6{}
.e7{}

.e8{}

.e9{}
.e10{display: none;}
.e11{}


.addFriend{
    width: 68%;
    margin: -1% auto 10% auto;
}

.info_send .addFriend { margin: 5% auto 5% auto;width: 31.2%;}
input{ width:100%;}
.line_btn img,.line_btn input,.buy_btn img
	{
		animation:
			bounce 2s ease infinite normal 0s none running
		;
		-webkit-animation:
			bounce 2s ease infinite normal 0s none running
		;
		-ms-animation:
			bounce 2s ease infinite normal 0s none running
		;
	}
	@keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}

	}
	@-webkit-keyframes bounce {
		0%, 100%, 20%, 50%, 80% {
		    transform: scale(1.0);
		}
		40% {
		    transform: scale(1.2);
		}
		60% {
		    transform: scale(1.1);
		}
	}


.reflection.go {
  height: 100%;
  width: 8%;
  position: absolute;
  top: -56%;
  left: -3%;
  background-color: #fff;
  opacity     :0;
  transform: rotate(45deg);
  animation: reflection 2s ease-in-out ;
  -webkit-transform: rotate(45deg);
  -webkit-animation: reflection 2s ease-in-out ;
  -moz-transform: rotate(45deg);
  -moz-animation: reflection 2s ease-in-out ;
  -ms-transform: rotate(45deg);
  -ms-animation: reflection 2s ease-in-out ;
  -o-transform: rotate(45deg);
  -o-animation: reflection 2s ease-in-out ;
}


@keyframes reflection {
  0% { transform: scale(0) rotate(45deg); opacity: 0; }
  80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
  0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
  0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
  0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
  0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
  80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
  81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
  100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}



@media screen and ( max-width:800px ){
.mfrom {
    width: 100%;
    /* text-align: center; */
    outline: 0;
    border: #231815 2px solid;
    color: #a6a8a8;
    font-size: 3.4vw;
    margin: 0 auto 5% auto;
    padding: 1.5% 3%;
}

.addFriend input{ width:100%;}


.form_box1 input{
    width: 90%;
    height: 0%;
    text-align: center;
    border-radius: 6px;
    outline: 0;
    border: #afafaf 2px solid;
    font-size: 16px;
    margin: 0 0 6px 0;
    padding: 12px 0px;
}

.e1{display: none;}

.e2{}
.e3{}
.e4{}
.e5{}
.e6{}
.e7{}

.e8{}

.e9{}
.e10{display: none;}
.e11{}
}
/*end lp8ex 流用分*/