@charset "UTF-8";

/*
**************************************************************************
*	toto worldcup style.css
**************************************************************************/

/* Reset - reset YUI
   ----------------------------------------------------------------- */
/**
YUI 3.10.0 (build a03ce0e)
Copyright 2013 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
/** cssreset */
html {
	color: #000;
	background: #FFF;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
table {
	border-collapse:collapse;
	border-spacing: 0;
}
fieldset, img {
	border: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
caption, th {
	text-align: left;
}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
q:before, q:after {
	content: '';
}
abbr, acronym {
	border: 0;
	font-variant: normal;
}
sup {
	vertical-align: text-top;
}
sub {
	vertical-align: text-bottom;
}
input, textarea, select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}
input, textarea, select {
	*font-size: 100%;
}
legend {
	color: #000;
}

/* Base
   ----------------------------------------------------------------- */
* {
  margin: 0;
  padding: 0;
}

html {
  font-family: -apple-system, blinkMacSystemFont, 'ヒラギノ角ゴ Pro W3', Hiragino Kaku Gothic Pro W3, 'メイリオ', Meiryo, sans-serif;
  font-size: 62.5%;
  line-height: 1.6;
  color: #000000;
  word-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  height: 100%;
  overflow-y: scroll;
}

body {
  position: relative;
  font-size: 2.4rem;
}

a {
  outline: none;
  color: #000000;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  display: inline-block;
}

img {
  vertical-align: bottom;
  max-width: 100%;
}

@media (max-width: 767px) {
  body {
    font-size: 1.2rem;
  }

  img {
    width: 100%;
    max-width: none;
  }
}

/* module Parts
   ----------------------------------------------------------------- */
.m-tab {
  display: none;
}

.m-sp {
  display: none;
}

.m-pc {
  display: block;
}

.m-cfx:after {
  content: "";
  display: table;
  clear: both;
}

.m-box_inr {
  position: relative;
  max-width: 1000px;
  width: 90%;
  margin: 0 auto;
  box-sizing: border-box;
}

.m-bg_color {
  background-color: #ffd800;
}

.m-over img {
  transition: transform .1s ease;
  display: block;
  margin: 0 auto;
}

.m-over:hover img {
  -webkit-transform: scale(.98);
  transform: scale(.98);
}

.m-section {
  padding-top: 70px;
  padding-bottom: 20px;
}

.m-sec_title {
  text-align: center;
  margin-bottom: 40px;
}

.m-center {
  text-align: center;
}

.pc-only {
  display: block;
}

.sp-only {
  display: none;
}


@media (max-width: 767px) {
  .m-pc {
    display: none;
  }

  .m-tab {
    display: none;
  }

  .m-sp {
    display: block;
  }

  .m-box_inr {
    width: 92%;
    margin: 0 auto;
  }

  .m-section {
    padding-top: 35px;
    padding-bottom: 10px;
  }

  .m-sec_title {
    margin-bottom: 20px;
  }

  .pc-only {
    display: none;
  }

  .sp-only {
    display: block;
  }
}


/* visual
   ----------------------------------------------------------------- */
.visual .m-box_inr {
  text-align: center;
}

.visual-logo {
  background: #ffd800;
  text-align: center;
  padding: 15px 0;
  margin-bottom: 3.2%;
}

.visual-logo_image {
  display: inline-block;
}

.visual-button {
  margin-top: 44px;
}

.visual-bnr {
  display: inline-block;
  margin-top: 16px;
  width: 40%;
}

.visual-bnr + .visual-bnr {
  margin-left: 30px;
}

.visual-default {
  background-image: url(/system/files/landing/toto2/assets_20230227/images/visual_bg.jpg);
  background-repeat: no-repeat;
  background-position: center top, right center;
  background-size: cover;
  animation: fadeIn 2s cubic-bezier(1, 0, 0.2, 0.8) 0s 1 normal;
  -webkit-animation: fadeIn 2s cubic-bezier(1, 0, 0.2, 0.8) 0s 1 normal;
  padding: 0 0 1.4%;
  display: block !important;
}

@keyframes fadeIn {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@media (max-width: 767px) {
  .visual-default {
    background-image: url(/system/files/landing/toto2/assets_20230227/images/visual_bg_spTab.jpg);
    padding: 0 0 4%
  }

  .visual-logo {
    padding: 1.734% 0;
    margin-bottom: 6%;
  }

  .visual-logo_image {
    width: 20%;
  }


  .visual .m-box_inr {
    width: 81%;
  }

  .visual-default .visual-title {
    
  }

  .visual-button {
    margin-top: 5%;
  }

  .visual-bnr {
    width: 47%;
    margin-top: 5%;
  }

  .visual-bnr + .visual-bnr {
    margin-left: 3%;
  }

  .visual-button {
   
  }
}


/* carryover
   ----------------------------------------------------------------- */
.visaul-carryover {
  display: none;
  margin-bottom: 7%;
}

.visaul-carryover .visual-title {}

.carry-inr {
  width: 1340px;
  margin: 0 auto;
  position: relative;
  max-width: 100%;
}

.carryover-box {
  /*position: absolute;*/
  position: relative;
  z-index: 1;
  /*top: 56.8%;*/
  /*left: 25%;*/
  height: 0;
  /*width: 51.5%;*/
  padding-bottom: 12.8%;
  background-image: url(/system/files/landing/toto2/assets_20230227/images/carryover_01.png);
  background-size: 100% 100%;
}

.carryover-num {
  position: absolute;
  background-size: 100% 1000%;
  background-image: url(/system/files/landing/toto2/assets_20230227/images/carryover_02.png);
  bottom: 7.14286%;
  padding-top: 11.35303%;
  width: 7.77605%;
}

.carryover-num.num00 {
  display: none;
}

.carryover-num.num01 {
  left: 0.7776049766718507%;
}

.carryover-num.num02 {
  left: 17.57387247278383%;
}

.carryover-num.num03 {
  left: 25.97200622083981%;
}

.carryover-num.num04 {
  left: 34.68118195956454%;
}

.carryover-num.num05 {
  left: 43.2348367029549%;
}

.carryover-num.num06 {
  left: 59.40902021772939%;
}

.carryover-num.num07 {
  left: 67.80715396578538%;
}

.carryover-num.num08 {
  left: 76.51632970451011%;
}

.carryover-num.num09 {
  left: 85.06998444790047%;
}

.carryover-button {
  position: absolute;
  top: 84.5%;
  margin: 0 auto;
  left: 0;
  right: 0;
  width: 71%;
  display: block;
}

.carryoverBtn-image {
  position: absolute;
  display: block;
  bottom: 13.16216%;
  transform: scale(1) !important;
}

.carryoverBtn-image.img01 {
  left: -2.35906%;
  width: 24.11576%;
  pointer-events: none;
}

/*
.carryoverBtn-image.img02 {
	right: -2.95906%;
	width: 20.47160%;
	pointer-events: none;
}
*/

@media (max-width: 767px) {
  .visaul-carryover {
    margin-bottom: 8%;
  }
}

/* news
   ----------------------------------------------------------------- */
.news {
  font-weight: bold;
  line-height: 1.5;
  color: #ffffff;
  background-color: #000000;
}

.news .m-box_inr {
  width: 70%;
}

.news-text {
  padding: 38px 0 39px;
}

@media (max-width: 767px) {
  .news .m-box_inr {
    width: 73.467%;
  }

  .news-text {
    padding: 6.5% 0;
  }

  .news-text img {
    width: 100%;
  }
}


/* oversea
   ----------------------------------------------------------------- */
.oversea {
  padding-top: 86px;
  padding-bottom: 6px;
}

.oversea .m-sec_title {
  width: 63%;
  margin: 0 auto 38px;
}

.oversea .buyway-list {
  margin-bottom: 29px;
}

.oversea .buyway-list span {
  display: block;
  text-align: right;
  font-size: 1.1rem;
  margin-top: 10px;
}

.oversea .buyway-list li {
  position: relative;
}

.oversea .buyway-list .buyway-button02 {
  position: absolute;
  top: 24%;
  right: 4.3%;
  width: 42.9%;
}

@media (max-width: 767px) {
  .oversea {
    padding-top: 12.6%;
    padding-bottom: 1px;
  }

  .oversea .m-sec_title {
    width: 100%;
    margin: 0 auto 5.1%;
  }

  .oversea .enjoy-btn_wrap {
    top: 27.43%;
    right: 0;
    width: 87.392%;
    left: 0;
    margin: 0 auto;
  }

  .oversea .enjoy-btn01+.enjoy-btn01 {
    margin-top: 3.5%;
  }

  .oversea .buyway-list {
    margin-bottom: 4.3%;
  }

  .oversea .buyway-list .buyway-button02 {
    position: absolute;
    top: 55%;
    left: 6.3%;
    width: 87.5%;
  }

}

/* lineup
   ----------------------------------------------------------------- */
.lineup {
  padding-top: 145px;
  padding-bottom: 88px;
}

.lineup .m-sec_title {
  margin: 0 auto 37px;
  width: 84.6%;
}

.lineup-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.lineup-list li {
  width: 32%;
}

.lineup-note {
  font-size: 1.2rem;
  margin-bottom: 25px;
}

.lineup-note li {
  display: inline-block;
}

@media (max-width: 767px) {
  .lineup {
    padding-top: 13.3%;
    padding-bottom: 7.3%;
  }

  .lineup .m-box_inr {
    width: 94.4%;
  }

  .lineup .m-sec_title {
    width: 100%;
    margin: 0 auto 2%;
  }

  .lineup-list {
    width: 97.458%;
    margin: 0 auto 2.6%;
  }

  .lineup-list li {
    width: 100%;
    margin-top: 3.6%;
  }

  .lineup-note {
    font-size: 0.9rem;
    margin-bottom: 4.8%;
  }

  .lineup-note li {
    display: block;
  }

  .lineup-button {
    width: 97.458%;
    display: inline-block;
  }

}

/* buyway
   ----------------------------------------------------------------- */
.buyway {
  padding-top: 66px;
  padding-bottom: 86px;
}

.buyway .m-sec_title {
  margin-bottom: 30px;
}

.buyway-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 40px;
}

.buyway-list .buyway-caption {
  margin-bottom: 30px;
}

.buyway-list.enjoy {
  display: block;
}

.enjoy-btn_wrap {
  position: absolute;
  top: 8.81%;
  right: 4%;
  width: 43.4%;
}

.enjoy-btn_wrap .enjoy-btn01 {
  display: block;
}

.enjoy-btn01+.enjoy-btn01 {
  display: block;
  margin-top: 12px;
}

.buyway-item {
  margin-top: 17px;
}

.buyway-list .buyway-caption {
  margin-bottom: 26px;
}

.buyway-list.js-tabs {
  margin-bottom: 0;
}

.buyway-list.js-tabs li {
  cursor: pointer;
  position: relative;
}


.buyway-list.js-tabs li.current {
  z-index: 10;
}

.buyway-list_content {
  padding: 6% 0 0;
  position: relative;
  overflow: hidden;
  margin-top: -1.5%;
  padding-bottom: 4%;
  background: url(/system/files/landing/toto2/assets_20230227/images/buyway_bg01.png) no-repeat 0 0 / contain;
}

.buyway-list_item {
  width: 88%;
  margin: 0 auto;
  position: relative;
  z-index: 10;
}

.buyway-list_content .slick-arrow {
  position: absolute;
  top: 50%;
  left: -20px;
  z-index: 2;
  width: 41px;
  height: 41px;
  background: url(/system/files/landing/toto2/assets_20230227/images/icon_arrow_01.png) no-repeat center center / contain;
  border: none;
  text-indent: -999999px;
  outline: none;
  cursor: pointer;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.buyway-list_content .slick-arrow.slick-disabled {
  display: none !important;
}

.buyway-list_content .slick-arrow.slick-next {
  left: auto;
  background: url(/system/files/landing/toto2/assets_20230227/images/icon_arrow_02.png) no-repeat center center / contain;
  right: -20px;
}

.buyway-list_content .slick-dots {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  z-index: 10;
  margin-top: 3%;
  font-size: 0;
}

.buyway-list_content .slick-dots li {
  padding: 0 10px;
}

.buyway-list_content .slick-dots li button {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #9c9c9c;
  text-indent: -9999px;
  border: none;
  outline: none;
  cursor: pointer;
}

.buyway-list_content .slick-dots li.slick-active button {
  background: #000;
}

.buyway-list_content .slick-slide {
  outline: none;
}

.howtobuyRandom-title {
  margin-bottom: 23px;
  padding-top: 45px;
}

.howtobuyRandom-btn {
  position: absolute;
  top: 91.4%;
  right: 0;
  left: 0;
  width: 65.3%;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap
}

.howtobuyRandom-btn a {
  width: 45.943%;
}

@media (max-width: 767px) {
  .buyway {
    padding-top: 10.7%;
    padding-bottom: 8.2%;
  }

  .buyway .m-sec_title {
    margin-bottom: 5.5%;
  }

  .buyway-item {
    margin-top: 6%;
  }

  .howtobuyRandom-title {
    padding-top: 8%;
    margin-bottom: 3.4%;
  }


  .buyway-list_content {
    margin-top: -2.793%;
    padding: 9% 0 7%;
    background: url(/system/files/landing/toto2/assets_20230227/images/buyway_bg02.png) no-repeat top center / 100% auto;
  }

  .buyway-list_item {
    width: 87.682%;
  }

  .buyway-list_content .slick-arrow {
    width: 8vw;
    height: 8vw;
    left: -4vw;
  }

  .buyway-list_content .slick-arrow.slick-next {
    right: -4vw;
  }

  .buyway-list_content .slick-dots {
    margin-top: 6.2%;
  }

  .buyway-list_content .slick-dots li {
    padding: 0 4%;
  }

  .buyway-list_content .slick-dots li button {
    width: 2.8vw;
    height: 2.8vw;
  }

  .howtobuyRandom-btn {
    width: 86.667%;
    top: 85.9%;
  }

  .howtobuyRandom-btn a {
    width: 100%;
  }

  .howtobuyRandom-btn a:first-child {
    margin-bottom: 5%;
  }
}

.buyway-list .buyway-caption {
  margin-bottom: 12px;
}

/* m-buy-head
   ----------------------------------------------------------------- */
.m-buy-head {
  position: relative;
  background: #ffd800;
}

.m-buy-head:after {
  content: '';
  width: 100%;
  height: calc(100% - 25px);
  background: #e61911;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
}

.m-buy-head .m-sec_title {
  margin-bottom: 0;
  z-index: 2;
  position: relative;
}

@media (max-width: 767px) {

  .m-buy-head {
    padding: 5.7% 0 0;
  }

  .m-buy-head:after {
    height: 100%;
  }

  .m-buy-head .m-box_inr {
    width: 91.734%;
  }

}
/* m-bnr
   ----------------------------------------------------------------- */

.m-bnr-ttl {
  width: 838px;
  margin: 87px auto 0;
}

.m-bnr-img {
  margin-top: 34px;
}

.m-bnr-img img {
  width: 100%;
}

.m-bnr-btn {
  display: block;
  width: 429px;
  margin: 35px auto 0;
}

.m-bnr + .m-buy {
  margin-top: 10px;
  margin-bottom: 52px;
}

@media (max-width: 767px) {
  .m-bnr-img {
    margin-top: 21px;
  }

  .m-bnr-ttl {
    width: 100%;
    margin: 20px auto 0;
  }

  .m-bnr-btn {
    width: 100%;
    margin: 10px auto 0;
  }
  .m-bnr + .m-buy {
    margin-top: 0;
    margin-bottom: 0;
  }
}


/* m-buy
   ----------------------------------------------------------------- */
.m-buy {
  padding-bottom: 28px;
}

.m-buy-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding: 40px 0 0;
}

.m-buy-list li {
  width: 19.2%;
}

.m-buy .m-center a {
  width: 42.9%;
}

@media (max-width: 767px) {
  .m-buy {
    padding-bottom: 5.3%;
  }

  .m-buy-list {
    padding: 6% 0 0;
    margin-bottom: 0;
  }

  .m-buy-list li {
    width: 48.87005%;
    margin-bottom: 1.1%;
  }

  .m-buy-list li:last-child {
    width: 100%;
    margin-bottom: 2.3%;
  }

  .m-buy .m-center a {
    width: 100%;
  }
}

/* aim
   ----------------------------------------------------------------- */
.aim {
  padding-top: 66px;
}

.aim .m-sec_title {
  margin-bottom: 31px;
}

@media (max-width: 767px) {
  .aim {
    padding-top: 11%;
  }

  .aim .m-sec_title {
    margin-bottom: 5%;
  }
}

/* voice
   ----------------------------------------------------------------- */
.voice {
  padding-top: 63px;
  padding-bottom: 42px;
}

.voice-box {
  margin-bottom: 29px;
}

.voice-bottom {
  margin-top: 59px;
  text-align: center;
}

.voice-bottom_text {
  width: 48.5%;
  margin: 0 auto 10px;
}

.voice-bottom a {
  width: 49%;
}

@media (max-width: 767px) {
  .voice {
    padding-top: 11.5%;
    padding-bottom: 7%;
  }

  .voice .m-sec_title {
    margin-bottom: 12.4%;
  }

  .voice-box {
    margin-bottom: 11.4%
  }

  .voice-bottom {
    margin-top: -3.4%;
  }

  .voice-bottom_text {
    width: 100%;
    margin: 0 auto 8px;
  }

  .voice-bottom a {
    width: 100%;
  }
}

/* place
   ----------------------------------------------------------------- */
.place {
  padding-top: 82px;
  padding-bottom: 86px;
}

.place .m-sec_title {
  margin-bottom: 37px;
}

.place-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.place-list li {
  position: relative;
  width: 32.4%;
}

.place-button01,
.place-button02 {
  position: absolute;
  top: 41.74%;
  left: 9.10494%;
  width: 81.79012%;
}

.placeLink-list {
  position: absolute;
  top: 41.6%;
  left: 4.012345%;
  width: 91.97531%;
  display: flex;
  flex-wrap: wrap;
}

.placeLink-list li {
  width: 50%;
  padding: 0 2.01342% 2.7%;
  box-sizing: border-box;
}

.placeLink-list li:first-child {
  width: 100%;
}

.placeLink-list a {
  display: block;
}

@media (max-width: 767px) {
  .place {
    padding-top: 12.8%;
    padding-bottom: 8.7%;
  }

  .place .m-sec_title {
    margin-bottom: 5.4%;
  }

  .place-list {
    display: block;
  }

  .place-list li {
    width: 100%;
  }

  .place-list>li {
    margin-top: 7.4%;
  }

  .place-list>li:first-child {
    margin-top: 0;
  }

  .place-button01 {
    top: 72.13439%;
    left: 6.35593%;
    width: 87.0057%;
  }

  .place-button02 {
    top: 55.52632%;
    left: 6.35593%;
    width: 87.0057%;
  }

  .placeLink-list {
    top: 51.5%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 88.8405797%;
  }

  .placeLink-list li {
    width: 30.995106%;
    padding: 0;
    margin-top: 2.3%;
    margin-right: 3%;
  }

  .placeLink-list li:first-child {
    margin-top: 0;
    margin-right: 0;
  }

  .placeLink-list li:nth-child(4),
  .placeLink-list li:nth-child(7),
  .placeLink-list li:nth-child(10) {
    margin-right: 0;
  }
}

/* member
   ----------------------------------------------------------------- */
.member {
  padding-top: 89px;
  padding-bottom: 42px;
}

.member .m-sec_title {
  margin-bottom: 35px;
}

.member-body {
  margin-bottom: 13px;
}

.member-note {
  font-size: 1.2rem;
}

.member-note li {
  display: block;
}

.member-bottom {
  margin-top: -25px;
}

@media (max-width: 767px) {
  .member {
    padding-top: 13.5%;
    padding-bottom: 5.5%;
  }

  .member .m-sec_title {
    margin-bottom: 5.3%;
  }

  .member-body {
  	margin-bottom: 1%;
  }

  .member-note {
    font-size: 2.4vw;
    margin-bottom: 0;
  }

  .member-bottom {
    margin-top: -13.3%;
  }
}

/* carryover
   ----------------------------------------------------------------- */
.carryover {
  padding-top: 66px;
  padding-bottom: 60px;
}

.carryover .m-sec_title {
  margin-bottom: 55px;
}

.carryover-txt {
  text-align: center;
  margin-bottom: 23px;
}

.carryover-number {
  margin-bottom: 71px;
}

@media (max-width: 767px) {
  .carryover {
    padding-top: 11%;
    padding-bottom: 8.3%;
  }

  .carryover .m-sec_title {
    margin-bottom: 6%;
  }

  .carryover-txt {
    margin-bottom: 3%;
  }

  .carryover-number {
    margin-bottom: 8%;
  }
}

/* confirm
   ----------------------------------------------------------------- */
.confirm {
  padding-top: 86px;
  padding-bottom: 45px;
}

.confirm_wrap {
  position: relative;
}

.confirm_img {
  max-width: 800px;
  margin: 0 auto;
  position: relative;
}

.confirm_btn01 {
  position: absolute;
  top: 39%;
  left: 16%;
  width: 22.875%;
}

.confirm_btn02 {
  position: absolute;
  top: 39%;
  left: 61.5%;
  width: 22.875%;
}

.confirm_btn03 {
  position: absolute;
  top: 77.8%;
  left: 60%;
  width: 24.375%;
}

@media (max-width: 767px) {
  .confirm {
    padding-top: 13%;
    padding-bottom: 6%;
  }

  .confirm .m-sec_title {
    margin-bottom: 5.1%;
  }

  .confirm_btn01 {
    top: 24.5%;
    left: 0;
    width: 86.667%;
    right: 0;
    margin: 0 auto;
  }

  .confirm_btn02 {
    top: 54.3%;
    left: 0;
    width: 86.667%;
    right: 0;
    margin: 0 auto;
  }

  .confirm_btn03 {
    top: 89.9%;
    left: 0;
    width: 86.667%;
    right: 0;
    margin: 0 auto;
  }
}

/* refund
   ----------------------------------------------------------------- */
.refund {
  padding-top: 66px;
  padding-bottom: 30px;
}

.refund-box {
  position: relative;
  margin-bottom: 60px;
}

.refund_btn01 {
  position: absolute;
  bottom: 12%;
  right: 10.7%;
  width: 33.4%;
}

@media (max-width: 767px) {
  .refund {
    padding-top: 11%;
    padding-bottom: 1.3%;
  }

  .refund .m-sec_title {
    margin-bottom: 5%;
  }

  .refund-box {
    margin-bottom: 7.6%;
  }

  .refund_btn01 {
    left: 0;
    width: 84%;
    right: 0;
    margin: 0 auto;
    bottom: 10.2%;
  }

}

/* deal
   ----------------------------------------------------------------- */
.deal {
  padding-top: 84px;
  padding-bottom: 0;
}

.deal .m-sec_title {
  margin-left: 17px;
}

.deal-box {
  position: relative;
}

.deal_btn01 {
  position: absolute;
  bottom: 11.8%;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 42.9%;
  height: 15.024%;
}

@media (max-width: 767px) {
  .deal {
    padding-top: 12.6%;
  }
  .deal .m-sec_title {
    margin-left: 0;
    margin-bottom: 5.6%;
  }
  .deal_btn01 {
    width: 87.392%;
    height: 21.65%;
    bottom: 17%;
  }
}

/* newsletter
   ----------------------------------------------------------------- */
.newsletter {
  padding-top: 84px;
  padding-bottom: 90px;
}

.newsletter .m-sec_title {
  margin-bottom: 38px;
}

.newsletter-box {
  position: relative;
}

.newsletter_btn01 {
  position: absolute;
  top: 61.5%;
  width: 40.2%;
  right: 15.1%;
}

@media (max-width: 767px) {
  .newsletter {
    padding-top: 13%;
    padding-bottom: 12.6%;
  }

  .newsletter .m-sec_title {
    margin-bottom: 5%;
  }

  .newsletter_btn01 {
    top: 74%;
    width: 87.392%;
    right: 0;
    left: 0;
    margin: 0 auto;
  }
}

/* social
   ----------------------------------------------------------------- */
.social {
  padding-top: 0;
  padding-bottom: 28px;
}

.social-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.social-list li {
  width: 44px;
  margin: 0 11px;
}

.social-list li img {
  width: 100%;
}

@media (max-width: 767px) {
  .social {
    padding-top: 15px;
    padding-bottom: 25px;
  }
}

/* infomation
   ----------------------------------------------------------------- */
.infomation {
  padding-top: 65px;
  padding-bottom: 5px;
}

.infomation .m-sec_title {
  margin-bottom: 30px;
}

.infomation-bnr {
  margin-bottom: 72px;
}

.infomation-bnr:last-child {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .infomation {
    padding-top: 25%;
  }

  .infomation-bnr {
    width: 96%;
    margin-bottom: 9%;
  }

  .infomation .m-sec_title {
    margin-bottom: 5%;
  }

  .infomation a {
  	width: 97.79%;
  }
}

/* footer
   ----------------------------------------------------------------- */
.footer-pagetop {
  padding-top: 20px;
  margin-bottom: 39px;
}

.pagetop-button {
  display: inline-block;
  width: 108px;
  transition: opacity .2s ease;
}

.pagetop-button:hover {
  opacity: 0.8;
}

.footer-box01 {
  border-top: 1px solid #656363;
}

.footer-list {
  padding: 32px 0;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.footer-list>div {
  padding: 0 20px;
  border-left: 1px solid #cccccc;
}

.footer-list>div:first-child {
  border-left: none;
}

.footer-contact {
  border-top: 1px solid #e6e6e6;
}

.footer-contact dl {
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  padding: 20px 0 5px;
}

.footer-contact dt {
  margin-bottom: 9px;
  color: #ca0813;
}

.footer-contact span {
  display: inline-block;
}

.footer-copyright p {
  text-align: center;
  font-size: 1.2rem;
  padding: 11px 0 10px;
}

@media (max-width: 767px) {
  .footer {
    padding-bottom: 79px;
  }

  .footer-pagetop {
    padding-top: 7%;
    margin-bottom: 7%;
  }

  .pagetop-button {
    width: 24%;
  }

  .social-list li {
    width: 15%;
    margin: 0 2%;
  }

  .footer-list {
    padding: 15px 0;
    margin: 0 -10px;
  }

  .footer-list>div {
    padding: 0 10px;
  }

  .footer-contact dl {
    font-size: 1.0rem;
    padding: 10px 0 8px;
  }

  .footer-contact span {
    display: none;
  }

  .footer-contact a {
    display: inline-block;
    text-decoration: underline;
  }

  .footer-copyright p {
    font-size: 0.9rem;
    padding: 7px 0 5px;
  }
}

/* navi
   ----------------------------------------------------------------- */
.navi {
  position: fixed;
  z-index: 10;
  top: 50%;
  right: 0;
  padding: 3px 0 3px 3px;
  background-color: #000000;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.navi-title {
  font-size: 0;
}

.navi-list li {
  margin-top: 3px;
  background-color: #ffffff;
}

.navi-list li a {
  transition: opacity .2s ease;
}

.navi-list li a:hover {
  opacity: 0.8;
}

@media (max-width: 767px) {
  .navi {
    top: auto;
    bottom: 0;
    padding: 0 0;
    width: 100%;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  .navi-title {
    width: 48px;
    margin: 0 auto;
  }

  .navi-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }

  .navi-list li {
    margin-top: 0;
    width: 20%;
    padding: 0 1px;
    box-sizing: border-box;
    background-color: transparent;
  }

  .navi-list li:first-child {
    padding-left: 0;
  }

  .navi-list li:last-child {
    padding-right: 0;
  }

  .navi-list li a {
    display: block;
    overflow: hidden;
    text-align: center;
    background-color: #ffffff;
  }

  .navi-list li:last-child a {
    background-color: #6cad2f;
  }

  .navi-list li a:hover {
    opacity: 1;
  }

  .navi-list li a img {
    width: 73px;
  }
}

/* purchase
   ----------------------------------------------------------------- */
.purchase {
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

.purchase-02 {
  padding-top: 46px;
}

@media (max-width: 767px) {}

.js-tabs_content {
  display: none;
}

.js-tabs_content.current {
  display: block;
}

/* modal
   ----------------------------------------------------------------- */
#modal {
  position: fixed;
  z-index: 10000;
  /* 1 */
  top: 0;
  left: 0;
  visibility: hidden;
  display: none;
  width: 100%;
  height: 100%;
}

#modal.is-visible {
  visibility: visible;
  display: block;
}

.modal-overlay {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: hsla(0, 0%, 0%, 0.6);
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s linear 0.3s, opacity 0.3s;
}

#modal.is-visible .modal-overlay {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.modal-wrapper {
  position: absolute;
  z-index: 9999;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: translateY(-50%);
  max-width: 992px;
  width: 90%;
  background-color: #fff;
  border: 4px solid #000;
  border-radius: 10px;
  opacity: 0;
  transition: all 0.3s 0.12s;
}

.modal-wrapper.open {
  opacity: 1;
}

.modal-content {
  padding: 56px 46px;
}

.frame-wrap {
  position: relative;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.modal-content iframe {
  width: 101%;
  height: 101%;
  position: absolute;
  top: -1px;
  left: -1px;
  right: 0;
  border: none;
}

.modal-close {
  position: absolute;
  top: -15px;
  right: -15px;
  width: 56px;
  height: 56px;
  background: url('/system/files/landing/toto2/assets_20230227/images/icon_close.png') no-repeat center center / contain;
  cursor: pointer;
}

.modal-close:hover {
  color: #777;
}

@media (max-width: 767px) {
  .modal-wrapper {
    border-width: 0.6vw;
    width: 91%;
  }

  .modal-content {
    padding: 8.865% 5.3%;
  }

  .modal-close {
    width: 9%;
    height: 13%;
    top: -5%;
    right: -5%;
  }
}

@media (max-width: 812px) and (orientation: landscape) {
	.modal-content {
		padding: 3.865% 5.3%;
	}
  .frame-wrap {
  	padding-bottom: 42.58%;
  }
}

/* dialogue
   ----------------------------------------------------------------- */
#dialogue {
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
  pointer-events: none;
}

#dialogue.is-visible {
  visibility: visible;
  pointer-events: inherit;
}

.dialogue-overlay {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: hsla(0, 0%, 0%, 0.6);
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s;
}

#dialogue.is-visible .dialogue-overlay {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.dialogue-wrapper {
  position: absolute;
  z-index: 9999;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: translateY(-50%);
  width: 90%;
  max-width: 1280px;
  max-height: 90vh;
  overflow-y: auto;
  background-color: hsla(51, 100%, 49%, 0.95);
  border: 4px solid #000;
  border-radius: 10px;
  opacity: 0;
  transition: opacity 0.3s 0.12s;
}

#dialogue.is-visible .dialogue-wrapper {
  opacity: 1;
}

.dialogue-close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 69px;
  height: 69px;
  background: url('/system/files/landing/toto2/assets_20230227/images/icon_close_simple.png') no-repeat center center / contain;
  cursor: pointer;
}

@media (max-width: 767px) {
  .dialogue-wrapper {
    border-width: 1.33vw;
    width: 91%;
  }

  .dialogue-content {
    padding: 8.865% 0.5%;
  }

  .dialogue-close {
    top: 0.2%;
    right: 0.3%;
    width: 12.7%;
    padding-bottom: 12.7%;
    height: 0;
  }
}

/* wc
   ----------------------------------------------------------------- */
.wc {
  padding-top: 65px;
  padding-bottom: 55px;
}

.wc-info {
  margin-bottom: 40px;
}

@media (max-width: 767px) {
  .wc {
    padding-top: 8.3%;
    padding-bottom: 2.7%;
  }
  
  .wc-info {
    margin-bottom: 4.75%;
  }
}

/* floating
   ----------------------------------------------------------------- */
#floating {
  position: fixed;
  right: 0;
  bottom: 50px;
  z-index: 9999;
  transition: opacity 0.3s, transform 0.3s;
}

#floating.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateX(100%);
}

@media (max-width: 767px) {
  #floating {
    right: 0;;
    bottom: 10.5vh;
    width: 64.1%;
  }
}