@charset "UTF-8";
@keyframes spriteBackground { 0% { background-position: 0 0; }
  100% { background-position: 0 100%; } }
* { padding: 0; margin: 0; border: none; }

html, body { width: 100%; height: 100%; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; }

html { font-size: 62.5%; }

body { font-family: "Yu Gothic", YuGothic, Meiryo, "メイリオ", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif; font-size: 12px; font-size: 1.2rem; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { background: #ffffff; }

li { list-style: none; }

img { vertical-align: bottom; }

a { display: block; text-decoration: none; }

button { display: block; -webkit-appearance: none; appearance: none; padding: 0; border: none; outline: none; background-color: transparent; cursor: pointer; }

@keyframes modalarrow_andmore { 0% { background-position: -52px 0, 0 0; }
  100% { background-position: -52px 0, 0 100%; } }
@keyframes modalclose_andmore { 0% { background-position: -80px 0, 0 0; }
  100% { background-position: -80px 0, 0 100%; } }
@keyframes modalarrow_yellow { 0% { background-position: -52px 0, 0px 0; }
  100% { background-position: -52px 0, 0px 100%; } }
@keyframes modalclose_yellow { 0% { background-position: -80px 0, 0px 0; }
  100% { background-position: -80px 0, 0px 100%; } }
@keyframes modalarrow_orange { 0% { background-position: -52px 0, -52px 0; }
  100% { background-position: -52px 0, -52px 100%; } }
@keyframes modalclose_orange { 0% { background-position: -80px 0, -80px 0; }
  100% { background-position: -80px 0, -80px 100%; } }
@keyframes modalarrow_pink { 0% { background-position: -52px 0, -104px 0; }
  100% { background-position: -52px 0, -104px 100%; } }
@keyframes modalclose_pink { 0% { background-position: -80px 0, -160px 0; }
  100% { background-position: -80px 0, -160px 100%; } }
@keyframes modalarrow_halfpink { 0% { background-position: -52px 0, -156px 0; }
  100% { background-position: -52px 0, -156px 100%; } }
@keyframes modalclose_halfpink { 0% { background-position: -80px 0, -240px 0; }
  100% { background-position: -80px 0, -240px 100%; } }
@keyframes modalarrow_purple { 0% { background-position: -52px 0, -208px 0; }
  100% { background-position: -52px 0, -208px 100%; } }
@keyframes modalclose_purple { 0% { background-position: -80px 0, -320px 0; }
  100% { background-position: -80px 0, -320px 100%; } }
@keyframes modalarrow_blue { 0% { background-position: -52px 0, -260px 0; }
  100% { background-position: -52px 0, -260px 100%; } }
@keyframes modalclose_blue { 0% { background-position: -80px 0, -400px 0; }
  100% { background-position: -80px 0, -400px 100%; } }
@keyframes modalarrow_skyblue { 0% { background-position: -52px 0, -312px 0; }
  100% { background-position: -52px 0, -312px 100%; } }
@keyframes modalclose_skyblue { 0% { background-position: -80px 0, -480px 0; }
  100% { background-position: -80px 0, -480px 100%; } }
@keyframes modalarrow_mossgreen { 0% { background-position: -52px 0, -364px 0; }
  100% { background-position: -52px 0, -364px 100%; } }
@keyframes modalclose_mossgreen { 0% { background-position: -80px 0, -560px 0; }
  100% { background-position: -80px 0, -560px 100%; } }
@keyframes modalarrow_lightgreen { 0% { background-position: -52px 0, -416px 0; }
  100% { background-position: -52px 0, -416px 100%; } }
@keyframes modalclose_lightgreen { 0% { background-position: -80px 0, -640px 0; }
  100% { background-position: -80px 0, -640px 100%; } }
@keyframes modalarrow_brown { 0% { background-position: -52px 0, -468px 0; }
  100% { background-position: -52px 0, -468px 100%; } }
@keyframes modalclose_brown { 0% { background-position: -80px 0, -720px 0; }
  100% { background-position: -80px 0, -720px 100%; } }
@keyframes modalarrow_gray { 0% { background-position: -52px 0, -520px 0; }
  100% { background-position: -52px 0, -520px 100%; } }
@keyframes modalclose_gray { 0% { background-position: -80px 0, -800px 0; }
  100% { background-position: -80px 0, -800px 100%; } }
@keyframes modalarrow_chanbarablue { 0% { background-position: -52px 0, -572px 0; }
  100% { background-position: -52px 0, -572px 100%; } }
@keyframes modalclose_chanbarablue { 0% { background-position: -80px 0, -880px 0; }
  100% { background-position: -80px 0, -880px 100%; } }
@keyframes modalarrow_dancingyellow { 0% { background-position: -52px 0, -624px 0; }
  100% { background-position: -52px 0, -624px 100%; } }
@keyframes modalclose_dancingyellow { 0% { background-position: -80px 0, -960px 0; }
  100% { background-position: -80px 0, -960px 100%; } }
@keyframes modalarrow_tablegreen { 0% { background-position: -52px 0, -676px 0; }
  100% { background-position: -52px 0, -676px 100%; } }
@keyframes modalclose_tablegreen { 0% { background-position: -80px 0, -1040px 0; }
  100% { background-position: -80px 0, -1040px 100%; } }
@keyframes modalarrow_magicalpurple { 0% { background-position: -52px 0, -728px 0; }
  100% { background-position: -52px 0, -728px 100%; } }
@keyframes modalclose_magicalpurple { 0% { background-position: -80px 0, -1120px 0; }
  100% { background-position: -80px 0, -1120px 100%; } }
@keyframes modalarrow_milkypink { 0% { background-position: -52px 0, -780px 0; }
  100% { background-position: -52px 0, -780px 100%; } }
@keyframes modalclose_milkypink { 0% { background-position: -80px 0, -1200px 0; }
  100% { background-position: -80px 0, -1200px 100%; } }
@keyframes prev_move { 0% { transform: scaleX(-1) translateX(0); }
  25% { transform: scaleX(-1) translateX(5px); }
  100% { transform: scaleX(-1) translateX(0); } }
@keyframes next_move { 0% { transform: translateX(0); }
  25% { transform: translateX(5px); }
  100% { transform: translateX(0); } }
#c_modal { width: 100%; height: 100%; min-width: 960px; min-height: 846px; position: fixed; top: 0; left: -100%; z-index: 10200; transition: left 0s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
@media (max-width: 960px) { #c_modal { left: -960px; } }
#c_modal div.modalArea { width: 100%; height: 100%; overflow: hidden; opacity: 0; background-size: 250px 250px, auto auto; transition: opacity 0s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_modal div.container { width: 100%; max-width: 1280px; height: 100%; position: relative; margin: 0 auto; }
#c_modal.open { left: 0; transition-duration: 0.4s; transition-delay: 0.2s; }
#c_modal.open div.modalArea { opacity: 1; transition-duration: 0.5s; transition-delay: 0.85s; }
#c_modal a, #c_modal button { overflow: hidden; position: absolute; text-indent: 80px; white-space: nowrap; }
#c_modal a.prev, #c_modal a.next, #c_modal button.prev, #c_modal button.next { width: 52px; height: 92px; top: 50%; margin-top: -46px; background: url(../img/main/pc/modal_arrow.svg) no-repeat 0 0, url(../img/main/pc/modal_arrow.png) no-repeat 52px 0; background-size: 52px 92px, auto auto; }
#c_modal a.prev, #c_modal button.prev { transform: scaleX(-1); }
#c_modal a.close, #c_modal button.close { width: 80px; height: 80px; top: 0; right: 0; background: url(../img/main/sp/modal_close.svg) no-repeat 0 0, url(../img/main/pc/modal_close.png) no-repeat 80px 0; background-size: 80px 80px, auto auto; }
#c_modal button.prev { left: 10px; transition: left 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_modal button.next { right: 10px; transition: right 0.3s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_modal button.close { top: -80px; transition: top 0.2s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_modal a.prev { left: -92px; animation: prev_move 0.475s infinite; }
#c_modal a.next { right: -92px; animation: next_move 0.475s infinite; }
#c_modal.open a.prev:hover, #c_modal.open a.next:hover, #c_modal.open button.prev:hover, #c_modal.open button.next:hover { animation-duration: 0.475s, 0.45s; animation-delay: 0s, 0s; animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1), steps(13); animation-iteration-count: infinite, 1; animation-fill-mode: forwards, forwards; }
#c_modal.open a.close:hover, #c_modal.open button.close:hover { animation-duration: 0.45s; animation-timing-function: steps(10); animation-iteration-count: 1; animation-fill-mode: forwards; }
#c_modal.open button { transition-delay: 1.35s; }
#c_modal.open button.prev { left: -92px; animation: prev_move 0.475s 1.55s infinite; }
#c_modal.open button.next { right: -92px; animation: next_move 0.475s 1.55s infinite; }
#c_modal.open button.close { top: 0; }

#c_youtube { width: 100%; padding: 160px 112px 272px; height: 100%; box-sizing: border-box; overflow: hidden; text-align: center; position: relative; }
#c_youtube div.videoArea { display: inline-block; height: 100%; max-width: 100%; max-height: 100%; position: relative; }
#c_youtube div.videoArea img { display: inline; width: auto; height: auto; max-width: 100%; max-height: 100%; }
#c_youtube section.video { width: 100%; padding-top: 56.25%; position: absolute; top: 50%; left: 0; margin-top: -28.125%; }
#c_youtube section.video div.text { width: 950px; position: absolute; left: 50%; top: 100%; margin: 30px 0 0 -475px; }
#c_youtube h3 { width: 956px; height: 80px; overflow: hidden; position: absolute; top: -120px; left: 50%; margin-left: -478px; }
#c_youtube h3 span { display: block; height: 80px; border-radius: 40px; margin: 0 auto; background: url(../img/main/modal_title.png) no-repeat; text-indent: 100%; white-space: nowrap; }
#c_youtube p { width: 950px; overflow: hidden; margin: 0 auto 19px; background: url(../img/main/pc/modal_caption.png) no-repeat; text-indent: 950px; white-space: nowrap; }
#c_youtube dl { height: 68px; padding-right: 31px; border: 4px solid #ffffff; border-radius: 38px; position: relative; margin: 0 auto; background: rgba(0, 0, 0, 0.15); }
#c_youtube dl.ftof { width: 750px; padding-left: 151px; }
#c_youtube dl.sense { width: 762px; padding-left: 139px; }
#c_youtube dt { height: 76px; border-radius: 38px; overflow: hidden; position: absolute; top: -4px; left: -4px; background: url(../img/main/pc/modal_point_title.png) no-repeat 0 0; text-indent: 130px; white-space: nowrap; }
#c_youtube dl.ftof dt { width: 130px; background-position: 100% 0; }
#c_youtube dl.sense dt { width: 118px; }
#c_youtube dd { width: 100%; height: 68px; overflow: hidden; background: url(../img/main/pc/modal_point.png) no-repeat 50% 0; text-indent: 762px; white-space: nowrap; }

#c_youtubeIframe { width: 100%; height: 100%; overflow: hidden; position: absolute; top: 0; right: 0; background: url(../img/main/pc/js_off.png) no-repeat 50% 50% #000000; text-align: left; text-indent: 100%; white-space: nowrap; }

#c_modal.eatingcontest { background-color: #ffd728; }

#c_modal.soda a.prev:hover, #c_modal.soda button.prev:hover { animation-name: prev_move, modalarrow_yellow; }

#c_modal.runway a.next:hover, #c_modal.runway button.next:hover { animation-name: next_move, modalarrow_yellow; }

#c_modal.safecracker a.close:hover, #c_modal.safecracker button.close:hover { animation-name: modalclose_yellow; }

#c_modal.quickdraw { background-color: #ff8228; }

#c_modal.milk a.prev:hover, #c_modal.milk button.prev:hover { animation-name: prev_move, modalarrow_orange; }

#c_modal.shiraha a.next:hover, #c_modal.shiraha button.next:hover { animation-name: next_move, modalarrow_orange; }

#c_modal.swordfight a.close:hover, #c_modal.swordfight button.close:hover, #c_modal.wizard a.close:hover, #c_modal.wizard button.close:hover { animation-name: modalclose_orange; }

#c_modal.runway { background-color: #ff787d; }

#c_modal.eatingcontest a.prev:hover, #c_modal.eatingcontest button.prev:hover { animation-name: prev_move, modalarrow_pink; }

#c_modal.milk a.next:hover, #c_modal.milk button.next:hover { animation-name: next_move, modalarrow_pink; }

#c_modal.runway a.close:hover, #c_modal.runway button.close:hover, #c_modal.baby a.close:hover, #c_modal.baby button.close:hover { animation-name: modalclose_pink; }

#c_modal.baby { background-color: #ffbbbe; }

#c_modal.safecracker a.prev:hover, #c_modal.safecracker button.prev:hover { animation-name: prev_move, modalarrow_halfpink; }

#c_modal.liardice a.next:hover, #c_modal.liardice button.next:hover { animation-name: next_move, modalarrow_halfpink; }

#c_modal.soda a.close:hover, #c_modal.soda button.close:hover, #c_modal.liardice a.close:hover, #c_modal.liardice button.close:hover { animation-name: modalclose_purple; }

#c_modal.swordfight { background-color: #8caaf0; }

#c_modal.wizard a.prev:hover, #c_modal.wizard button.prev:hover { animation-name: prev_move, modalarrow_blue; }

#c_modal.telephone a.next:hover, #c_modal.telephone button.next:hover { animation-name: next_move, modalarrow_blue; }

#c_modal.shaver, #c_modal.beachflag { background-color: #8cebff; }

#c_modal.telephone a.prev:hover, #c_modal.telephone button.prev:hover, #c_modal.shaver a.prev:hover, #c_modal.shaver button.prev:hover { animation-name: prev_move, modalarrow_skyblue; }

#c_modal.countball a.next:hover, #c_modal.countball button.next:hover, #c_modal.beachflag a.next:hover, #c_modal.beachflag button.next:hover { animation-name: next_move, modalarrow_skyblue; }

#c_modal.telephone, #c_modal.soda { background-color: #82e1d2; }

#c_modal.countball a.prev:hover, #c_modal.countball button.prev:hover, #c_modal.swordfight a.prev:hover, #c_modal.swordfight button.prev:hover { animation-name: prev_move, modalarrow_mossgreen; }

#c_modal.eatingcontest a.next:hover, #c_modal.eatingcontest button.next:hover, #c_modal.shaver a.next:hover, #c_modal.shaver button.next:hover { animation-name: next_move, modalarrow_mossgreen; }

#c_modal.beachflag a.close:hover, #c_modal.beachflag button.close:hover { animation-name: modalclose_mossgreen; }

#c_modal.eatingcontest a.close:hover, #c_modal.eatingcontest button.close:hover, #c_modal.countball a.close:hover, #c_modal.countball button.close:hover { animation-name: modalclose_lightgreen; }

#c_modal.countball, #c_modal.joyconrotation, #c_modal.liardice { background-color: #cdaa82; }

#c_modal.shiraha a.prev:hover, #c_modal.shiraha button.prev:hover, #c_modal.baby a.prev:hover, #c_modal.baby button.prev:hover, #c_modal.beachflag a.prev:hover, #c_modal.beachflag button.prev:hover { animation-name: prev_move, modalarrow_brown; }

#c_modal.pingpong a.next:hover, #c_modal.pingpong button.next:hover, #c_modal.wizard a.next:hover, #c_modal.wizard button.next:hover, #c_modal.soda a.next:hover, #c_modal.soda button.next:hover { animation-name: next_move, modalarrow_brown; }

#c_modal.milk a.close:hover, #c_modal.milk button.close:hover, #c_modal.telephone a.close:hover, #c_modal.telephone button.close:hover { animation-name: modalclose_brown; }

#c_modal.safecracker { background-color: #a5a5a5; }

#c_modal.copydance a.prev:hover, #c_modal.copydance button.prev:hover { animation-name: prev_move, modalarrow_gray; }

#c_modal.baby a.next:hover, #c_modal.baby button.next:hover { animation-name: next_move, modalarrow_gray; }

#c_modal.shaver a.close:hover, #c_modal.shaver button.close:hover, #c_modal.joyconrotation a.close:hover, #c_modal.joyconrotation button.close:hover { animation-name: modalclose_gray; }

#c_modal.shiraha, #c_modal.andmore { background-color: #87c3f0; }

#c_modal.quickdraw a.prev:hover, #c_modal.quickdraw button.prev:hover, #c_modal.pingpong a.prev:hover, #c_modal.pingpong button.prev:hover { animation-name: prev_move, modalarrow_chanbarablue; }

#c_modal.copydance a.next:hover, #c_modal.copydance button.next:hover, #c_modal.joyconrotation a.next:hover, #c_modal.joyconrotation button.next:hover { animation-name: next_move, modalarrow_chanbarablue; }

#c_modal.copydance a.close:hover, #c_modal.copydance button.close:hover { animation-name: modalclose_chanbarablue; }

#c_modal.copydance { background-color: #ffe128; }

#c_modal.andmore a.prev:hover, #c_modal.andmore button.prev:hover { animation-name: prev_move, modalarrow_dancingyellow; }

#c_modal.safecracker a.next:hover, #c_modal.safecracker button.next:hover { animation-name: next_move, modalarrow_dancingyellow; }

#c_modal.shiraha a.close:hover, #c_modal.shiraha button.close:hover, #c_modal.andmore a.close:hover, #c_modal.andmore button.close:hover { animation-name: modalclose_dancingyellow; }

#c_modal.milk, #c_modal.pingpong { background-color: #82dc5a; }

#c_modal.runway a.prev:hover, #c_modal.runway button.prev:hover, #c_modal.joyconrotation a.prev:hover, #c_modal.joyconrotation button.prev:hover { animation-name: prev_move, modalarrow_tablegreen; }

#c_modal.quickdraw a.next:hover, #c_modal.quickdraw button.next:hover, #c_modal.andmore a.next:hover, #c_modal.andmore button.next:hover { animation-name: next_move, modalarrow_tablegreen; }

#c_modal.wizard { background-color: #9b73c8; }

#c_modal.liardice a.prev:hover, #c_modal.liardice button.prev:hover { animation-name: prev_move, modalarrow_magicalpurple; }

#c_modal.swordfight a.next:hover, #c_modal.swordfight button.next:hover { animation-name: next_move, modalarrow_magicalpurple; }

#c_modal.quickdraw a.close:hover, #c_modal.quickdraw button.close:hover { animation-name: modalclose_magicalpurple; }

#c_modal.pingpong a.close:hover, #c_modal.pingpong button.close:hover { animation-name: modalclose_milkypink; }

#c_modal.eatingcontest div.modalArea, #c_modal.copydance div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #f3f38a 10%, #ffdf28 50%, #b7d028 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #f3f38a 10%, #ffdf28 50%, #b7d028 100%); }

#c_modal.eatingcontest dt, #c_modal.copydance dt { background-color: #b7d028; }

#c_modal.quickdraw div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #f8d55a 10%, #ff8028 50%, #ff5a46 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #f8d55a 10%, #ff8028 50%, #ff5a46 100%); }

#c_modal.quickdraw dt { background-color: #fd752c; }

#c_modal.runway div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #ffb9bc 10%, #ff787d 50%, #da3c3c 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #ffb9bc 10%, #ff787d 50%, #da3c3c 100%); }

#c_modal.runway dt { background-color: #f26165; }

#c_modal.wizard div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #d0b4df 10%, #a36ec1 50%, #5f28bc 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #d0b4df 10%, #a36ec1 50%, #5f28bc 100%); }

#c_modal.wizard dt { background-color: #8954bc; }

#c_modal.shiraha div.modalArea, #c_modal.swordfight div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #c3d3f5 10%, #8aa8ee 50%, #5064ee 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #c3d3f5 10%, #8aa8ee 50%, #5064ee 100%); }

#c_modal.shiraha dt, #c_modal.swordfight dt { background-color: #748fec; }

#c_modal.shaver div.modalArea, #c_modal.beachflag div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #bceeff 10%, #8ad5f3 50%, #32a8c6 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #bceeff 10%, #8ad5f3 50%, #32a8c6 100%); }

#c_modal.shaver dt, #c_modal.beachflag dt { background-color: #53b8d7; }

#c_modal.telephone div.modalArea, #c_modal.soda div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #bceed0 10%, #80dfc6 50%, #329eb2 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #bceed0 10%, #80dfc6 50%, #329eb2 100%); }

#c_modal.telephone dt, #c_modal.soda dt { background-color: #66cabf; }

#c_modal.milk div.modalArea, #c_modal.pingpong div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #eef298 10%, #a3df46 50%, #3cc68a 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #eef298 10%, #a3df46 50%, #3cc68a 100%); }

#c_modal.milk dt, #c_modal.pingpong dt { background-color: #81d657; }

#c_modal.countball div.modalArea, #c_modal.joyconrotation div.modalArea, #c_modal.liardice div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #dfd5a8 10%, #d09e64 50%, #a35f46 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #dfd5a8 10%, #d09e64 50%, #a35f46 100%); }

#c_modal.countball dt, #c_modal.joyconrotation dt, #c_modal.liardice dt { background-color: #c08657; }

#c_modal.safecracker div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #d5e4da 10%, #a1a1a1 50%, #6e7378 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #d5e4da 10%, #a1a1a1 50%, #6e7378 100%); }

#c_modal.safecracker dt { background-color: #8e8e90; }

#c_modal.baby div.modalArea { background-image: url(../img/common/texture.png), -webkit-linear-gradient(225deg, #ffdcdd 10%, #ffbbbe 50%, #ec9d9d 100%); background-image: url(../img/common/texture.png), linear-gradient(225deg, #ffdcdd 10%, #ffbbbe 50%, #ec9d9d 100%); }

#c_modal.baby dt { background-color: #ff787d; }

#c_modal.quickdraw h3 span { width: 284px; background-position: 50% -80px; }
#c_modal.quickdraw p { height: 64px; background-position: 50% -92px; }
#c_modal.quickdraw dl { width: 474px; }
#c_modal.quickdraw dd { background-position: 50% 0px; }
#c_modal.milk h3 span { width: 226px; background-position: 50% -160px; }
#c_modal.milk p { height: 64px; background-position: 50% -156px; }
#c_modal.milk dl { width: 714px; }
#c_modal.milk dd { background-position: 50% -68px; }
#c_modal.eatingcontest h3 span { width: 484px; background-position: 50% -240px; }
#c_modal.eatingcontest p { height: 92px; background-position: 50% -220px; margin-bottom: 34px; }
#c_modal.eatingcontest dl { width: 530px; }
#c_modal.eatingcontest dd { background-position: 50% -136px; }
#c_modal.countball h3 span { width: 430px; background-position: 50% -320px; }
#c_modal.countball p { height: 64px; background-position: 50% -312px; }
#c_modal.countball dl { width: 588px; }
#c_modal.countball dd { background-position: 50% -204px; }
#c_modal.shiraha h3 span { width: 384px; background-position: 50% -400px; }
#c_modal.shiraha p { height: 64px; background-position: 50% -376px; }
#c_modal.shiraha dl { width: 540px; }
#c_modal.shiraha dd { background-position: 50% -272px; }
#c_modal.pingpong h3 span { width: 280px; background-position: 50% -480px; }
#c_modal.pingpong p { height: 64px; background-position: 50% -440px; }
#c_modal.pingpong dl { width: 690px; }
#c_modal.pingpong dd { background-position: 50% -340px; }
#c_modal.safecracker h3 span { width: 282px; background-position: 50% -560px; }
#c_modal.safecracker p { height: 64px; background-position: 50% -504px; }
#c_modal.safecracker dl { width: 676px; }
#c_modal.safecracker dd { background-position: 50% -408px; }
#c_modal.copydance h3 span { width: 376px; background-position: 50% -640px; }
#c_modal.copydance p { height: 64px; background-position: 50% -568px; }
#c_modal.copydance dl { width: 608px; }
#c_modal.copydance dd { background-position: 50% -476px; }
#c_modal.swordfight h3 span { width: 408px; background-position: 50% -720px; }
#c_modal.swordfight p { height: 64px; background-position: 50% -632px; }
#c_modal.swordfight dl { width: 522px; }
#c_modal.swordfight dd { background-position: 50% -544px; }
#c_modal.wizard h3 span { width: 300px; background-position: 50% -800px; }
#c_modal.wizard p { height: 64px; background-position: 50% -696px; }
#c_modal.wizard dl { width: 456px; }
#c_modal.wizard dd { background-position: 50% -612px; }
#c_modal.telephone h3 span { width: 240px; background-position: 50% -880px; }
#c_modal.telephone p { height: 64px; background-position: 50% -760px; }
#c_modal.telephone dl { width: 630px; }
#c_modal.telephone dd { background-position: 50% -680px; }
#c_modal.shaver h3 span { width: 280px; background-position: 50% -960px; }
#c_modal.shaver p { height: 64px; background-position: 50% -824px; }
#c_modal.shaver dl { width: 740px; }
#c_modal.shaver dd { background-position: 50% -748px; }
#c_modal.runway h3 span { width: 432px; background-position: 50% -1040px; }
#c_modal.runway p { height: 64px; background-position: 50% -888px; }
#c_modal.runway dl { width: 476px; }
#c_modal.runway dd { background-position: 50% -816px; }
#c_modal.soda h3 span { width: 232px; background-position: 50% -1120px; }
#c_modal.soda p { height: 64px; background-position: 50% -952px; }
#c_modal.soda dl { width: 734px; }
#c_modal.soda dd { background-position: 50% -884px; }
#c_modal.baby h3 span { width: 280px; background-position: 50% -1200px; }
#c_modal.baby p { height: 92px; background-position: 50% -1016px; margin-bottom: 34px; }
#c_modal.baby dl { width: 496px; }
#c_modal.baby dd { background-position: 50% -952px; }
#c_modal.joyconrotation h3 span { width: 424px; background-position: 50% -1280px; }
#c_modal.joyconrotation p { height: 64px; background-position: 50% -1108px; }
#c_modal.joyconrotation dl { width: 680px; }
#c_modal.joyconrotation dd { background-position: 50% -1020px; }
#c_modal.liardice h3 span { width: 430px; background-position: 50% -1360px; }
#c_modal.liardice p { height: 64px; background-position: 50% -1172px; }
#c_modal.liardice dl { width: 656px; }
#c_modal.liardice dd { background-position: 50% -1088px; }
#c_modal.beachflag h3 span { width: 432px; background-position: 50% -1440px; }
#c_modal.beachflag p { height: 64px; background-position: 50% -1236px; }
#c_modal.beachflag dl { width: 560px; }
#c_modal.beachflag dd { background-position: 50% -1156px; }
#c_modal.andmore h3 span { width: 360px; background-position: 50% 0; }
#c_modal.andmore p { height: 92px; background-position: 50% 0; }
#c_modal.andmore #c_youtubeIframe { background: url(../img/main/movie_thumb_0.jpg) no-repeat 0 0; background-size: 100% 100%; }

@keyframes modalclose_def { 0% { background-position: -80px 0, -320px 0; }
  100% { background-position: -80px 0, -320px 100%; } }
#c_productModal { width: 100%; height: 100%; min-width: 960px; min-height: 994px; position: fixed; top: 0; left: -100%; background: rgba(0, 0, 0, 0.8); z-index: 10200; transition: left 0s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
@media (max-width: 960px) { #c_productModal { left: -960px; } }
#c_productModal div.container { width: 100%; max-width: 1280px; height: 100%; position: relative; margin: 0 auto; }
#c_productModal.open { left: 0; transition-duration: 0.4s; }
#c_productModal a.close, #c_productModal button.close { width: 80px; height: 80px; overflow: hidden; position: absolute; top: 0; right: 0; background: url(../img/main/sp/modal_close.svg) no-repeat 0 0, url(../img/main/pc/modal_close.png) no-repeat 80px 0; text-indent: 80px; white-space: nowrap; }
#c_productModal a.close:hover, #c_productModal button.close:hover { animation: modalclose_def 0.45s steps(10) 1 forwards; }
#c_productModal button.close { top: -80px; transition: top 0.2s 0.4s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_productModal.open button.close { top: 0; }

#c_productYoutube { width: 100%; height: 100%; padding: 120px 0 308px; box-sizing: border-box; overflow: hidden; text-align: center; position: relative; }
#c_productYoutube section.video { width: 896px; height: 504px; position: absolute; top: 50%; left: 50%; margin: -346px 0 0 -448px; }
#c_productYoutube h3 { width: 956px; height: 80px; position: absolute; top: -120px; left: 50%; margin-left: -478px; }
#c_productYoutube h3 span { display: block; width: 262px; height: 80px; border-radius: 40px; overflow: hidden; margin: 0 auto; background: url(../img/main/modal_product_title.png) no-repeat 0 0; text-indent: 100%; white-space: nowrap; }
#c_productYoutube ul { width: 910px; height: 290px; position: absolute; bottom: -308px; left: 81%; margin-left: -455px; }
#c_productYoutube ul li { position: relative; float: left; margin: 12px 7px 0; }
#c_productYoutube ul strong { display: block; width: 38px; height: 38px; overflow: hidden; position: absolute; top: 0; right: 0; background: url(../img/common/icon_new.svg) no-repeat 0 0; background-size: 100% 100%; text-indent: 38px; white-space: nowrap; }
#c_productYoutube ul button { width: 168px; height: 30px; padding-top: 103px; box-sizing: content-box; overflow: hidden; position: relative; background: url(../img/main/pc/modal_product_thumb.jpg) no-repeat 0 0; }
#c_productYoutube ul button::after { content: ""; display: block; width: 168px; height: 95px; border: 0px solid #9b73c8; box-sizing: border-box; position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.6); transition: border-width 0.2s 0s cubic-bezier(0.215, 0.61, 0.355, 1), background-color 0.2s 0s cubic-bezier(0.215, 0.61, 0.355, 1); }
#c_productYoutube ul button span { display: block; width: 168px; height: 30px; overflow: hidden; background: url(../img/main/pc/modal_product_thumb_title.png) no-repeat 0 0; text-indent: 168px; white-space: nowrap; }
#c_productYoutube ul button:hover::after { border-width: 6px; background-color: transparent; }
#c_productYoutube ul button.current { cursor: auto; }
#c_productYoutube ul button.current::after { border-width: 0; background-color: transparent; }
#c_productYoutube ul li.movie_1 button { background-position: 0px 0; }
#c_productYoutube ul li.movie_1 button span { background-position: 0px 0; }
#c_productYoutube ul li.movie_1 button:hover span { background-position: 0px -60px; }
#c_productYoutube ul li.movie_1 button.current span { background-position: 0px -30px; }
#c_productYoutube ul li.movie_2 button { background-position: -168px 0; }
#c_productYoutube ul li.movie_2 button span { background-position: -168px 0; }
#c_productYoutube ul li.movie_2 button:hover span { background-position: -168px -60px; }
#c_productYoutube ul li.movie_2 button.current span { background-position: -168px -30px; }
#c_productYoutube ul li.movie_3 button { background-position: -336px 0; }
#c_productYoutube ul li.movie_3 button span { background-position: -336px 0; }
#c_productYoutube ul li.movie_3 button:hover span { background-position: -336px -60px; }
#c_productYoutube ul li.movie_3 button.current span { background-position: -336px -30px; }
#c_productYoutube ul li.movie_4 button { background-position: -504px 0; }
#c_productYoutube ul li.movie_4 button span { background-position: -504px 0; }
#c_productYoutube ul li.movie_4 button:hover span { background-position: -504px -60px; }
#c_productYoutube ul li.movie_4 button.current span { background-position: -504px -30px; }
#c_productYoutube ul li.movie_5 button { background-position: -672px 0; }
#c_productYoutube ul li.movie_5 button span { background-position: -672px 0; }
#c_productYoutube ul li.movie_5 button:hover span { background-position: -672px -60px; }
#c_productYoutube ul li.movie_5 button.current span { background-position: -672px -30px; }
#c_productYoutube ul li.movie_6 button { background-position: -840px 0; }
#c_productYoutube ul li.movie_6 button span { background-position: -840px 0; }
#c_productYoutube ul li.movie_6 button:hover span { background-position: -840px -60px; }
#c_productYoutube ul li.movie_6 button.current span { background-position: -840px -30px; }
#c_productYoutube ul li.movie_7 button { background-position: -1008px 0; }
#c_productYoutube ul li.movie_7 button span { background-position: -1008px 0; }
#c_productYoutube ul li.movie_7 button:hover span { background-position: -1008px -60px; }
#c_productYoutube ul li.movie_7 button.current span { background-position: -1008px -30px; }
#c_productYoutube ul li.movie_8 button { background-position: -1176px 0; }
#c_productYoutube ul li.movie_8 button span { background-position: -1176px 0; }
#c_productYoutube ul li.movie_8 button:hover span { background-position: -1176px -60px; }
#c_productYoutube ul li.movie_8 button.current span { background-position: -1176px -30px; }
#c_productYoutube ul li.movie_9 button { background-position: -1343px 0; }
#c_productYoutube ul li.movie_9 button span { background-position: -1351px 0; }
#c_productYoutube ul li.movie_9 button:hover span { background-position: -1351px -60px; }
#c_productYoutube ul li.movie_9 button.current span { background-position: -1351px -30px; }

#c_productIframe { width: 100%; height: 100%; overflow: hidden; position: absolute; top: 0; right: 0; background: #000000; }
#c_productIframe div, #c_productIframe p { width: 100%; height: 100%; overflow: hidden; text-align: left; text-indent: 100%; white-space: nowrap; }
#c_productIframe p { background: url(../img/main/pc/js_off.png) no-repeat 50% 50%; }

#c_modal, #c_productModal { position: absolute; }