@charset "UTF-8";
/* ### reset.scss ### */
/*
YUI 3.14.1 (build 63049cb)
Copyright 2013 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
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; vertical-align: top; }

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; *font-size: 100%; }

legend { color: #000; }

#yui3-css-stamp.cssreset { display: none; }

figure { margin: 0; }

/* ### mixin.scss ### */
/* ### setting.scss ### */
/* ### adjust.scss ### */
.center { text-align: center !important; }

.right { text-align: right !important; }

.left { text-align: left !important; }

.mt0 { margin-top: 0px !important; }

.mt1 { margin-top: 1px !important; }

.mt2 { margin-top: 2px !important; }

.mt3 { margin-top: 3px !important; }

.mt4 { margin-top: 4px !important; }

.mt5 { margin-top: 5px !important; }

.mt6 { margin-top: 6px !important; }

.mt7 { margin-top: 7px !important; }

.mt8 { margin-top: 8px !important; }

.mt9 { margin-top: 9px !important; }

.mt10 { margin-top: 10px !important; }

.mt15 { margin-top: 15px !important; }

.mt20 { margin-top: 20px !important; }

.mt25 { margin-top: 25px !important; }

.mt30 { margin-top: 30px !important; }

.mt35 { margin-top: 35px !important; }

.mt40 { margin-top: 40px !important; }

.mt45 { margin-top: 45px !important; }

.mt50 { margin-top: 50px !important; }

.ml0 { margin-left: 0px !important; }

.ml1 { margin-left: 1px !important; }

.ml2 { margin-left: 2px !important; }

.ml3 { margin-left: 3px !important; }

.ml4 { margin-left: 4px !important; }

.ml5 { margin-left: 5px !important; }

.ml6 { margin-left: 6px !important; }

.ml7 { margin-left: 7px !important; }

.ml8 { margin-left: 8px !important; }

.ml9 { margin-left: 9px !important; }

.ml10 { margin-left: 10px !important; }

.ml5 { margin-left: 5px !important; }

.ml10 { margin-left: 10px !important; }

.ml15 { margin-left: 15px !important; }

.ml20 { margin-left: 20px !important; }

.ml25 { margin-left: 25px !important; }

.ml30 { margin-left: 30px !important; }

.ml35 { margin-left: 35px !important; }

.ml40 { margin-left: 40px !important; }

.ml45 { margin-left: 45px !important; }

.ml50 { margin-left: 50px !important; }

.mb0 { margin-bottom: 0px !important; }

.mb1 { margin-bottom: 1px !important; }

.mb2 { margin-bottom: 2px !important; }

.mb3 { margin-bottom: 3px !important; }

.mb4 { margin-bottom: 4px !important; }

.mb5 { margin-bottom: 5px !important; }

.mb6 { margin-bottom: 6px !important; }

.mb7 { margin-bottom: 7px !important; }

.mb8 { margin-bottom: 8px !important; }

.mb9 { margin-bottom: 9px !important; }

.mb10 { margin-bottom: 10px !important; }

.mb15 { margin-bottom: 15px !important; }

.mb20 { margin-bottom: 20px !important; }

.mb25 { margin-bottom: 25px !important; }

.mb30 { margin-bottom: 30px !important; }

.mb35 { margin-bottom: 35px !important; }

.mb40 { margin-bottom: 40px !important; }

.mb45 { margin-bottom: 45px !important; }

.mb50 { margin-bottom: 50px !important; }

.mr0 { margin-right: 0px !important; }

.mr1 { margin-right: 1px !important; }

.mr2 { margin-right: 2px !important; }

.mr3 { margin-right: 3px !important; }

.mr4 { margin-right: 4px !important; }

.mr5 { margin-right: 5px !important; }

.mr6 { margin-right: 6px !important; }

.mr7 { margin-right: 7px !important; }

.mr8 { margin-right: 8px !important; }

.mr9 { margin-right: 9px !important; }

.mr10 { margin-right: 10px !important; }

.mr15 { margin-right: 15px !important; }

.mr20 { margin-right: 20px !important; }

.mr25 { margin-right: 25px !important; }

.mr30 { margin-right: 30px !important; }

.mr35 { margin-right: 35px !important; }

.mr40 { margin-right: 40px !important; }

.mr45 { margin-right: 45px !important; }

.mr50 { margin-right: 50px !important; }

.pt0 { padding-top: 0px !important; }

.pt1 { padding-top: 1px !important; }

.pt2 { padding-top: 2px !important; }

.pt3 { padding-top: 3px !important; }

.pt4 { padding-top: 4px !important; }

.pt5 { padding-top: 5px !important; }

.pt6 { padding-top: 6px !important; }

.pt7 { padding-top: 7px !important; }

.pt8 { padding-top: 8px !important; }

.pt9 { padding-top: 9px !important; }

.pt10 { padding-top: 10px !important; }

.pt15 { padding-top: 15px !important; }

.pt20 { padding-top: 20px !important; }

.pt25 { padding-top: 25px !important; }

.pt30 { padding-top: 30px !important; }

.pt35 { padding-top: 35px !important; }

.pt40 { padding-top: 40px !important; }

.pt45 { padding-top: 45px !important; }

.pt50 { padding-top: 50px !important; }

.pl0 { padding-left: 0px !important; }

.pl1 { padding-left: 1px !important; }

.pl2 { padding-left: 2px !important; }

.pl3 { padding-left: 3px !important; }

.pl4 { padding-left: 4px !important; }

.pl5 { padding-left: 5px !important; }

.pl6 { padding-left: 6px !important; }

.pl7 { padding-left: 7px !important; }

.pl8 { padding-left: 8px !important; }

.pl9 { padding-left: 9px !important; }

.pl10 { padding-left: 10px !important; }

.pl15 { padding-left: 15px !important; }

.pl20 { padding-left: 20px !important; }

.pl25 { padding-left: 25px !important; }

.pl30 { padding-left: 30px !important; }

.pl35 { padding-left: 35px !important; }

.pl40 { padding-left: 40px !important; }

.pl45 { padding-left: 45px !important; }

.pl50 { padding-left: 50px !important; }

.pb0 { padding-bottom: 0px !important; }

.pb1 { padding-bottom: 1px !important; }

.pb2 { padding-bottom: 2px !important; }

.pb3 { padding-bottom: 3px !important; }

.pb4 { padding-bottom: 4px !important; }

.pb5 { padding-bottom: 5px !important; }

.pb6 { padding-bottom: 6px !important; }

.pb7 { padding-bottom: 7px !important; }

.pb8 { padding-bottom: 8px !important; }

.pb9 { padding-bottom: 9px !important; }

.pb10 { padding-bottom: 10px !important; }

.pb15 { padding-bottom: 15px !important; }

.pb20 { padding-bottom: 20px !important; }

.pb25 { padding-bottom: 25px !important; }

.pb30 { padding-bottom: 30px !important; }

.pb35 { padding-bottom: 35px !important; }

.pb40 { padding-bottom: 40px !important; }

.pb45 { padding-bottom: 45px !important; }

.pb50 { padding-bottom: 50px !important; }

.pr0 { padding-right: 0px !important; }

.pr1 { padding-right: 1px !important; }

.pr2 { padding-right: 2px !important; }

.pr3 { padding-right: 3px !important; }

.pr4 { padding-right: 4px !important; }

.pr5 { padding-right: 5px !important; }

.pr6 { padding-right: 6px !important; }

.pr7 { padding-right: 7px !important; }

.pr8 { padding-right: 8px !important; }

.pr9 { padding-right: 9px !important; }

.pr10 { padding-right: 10px !important; }

.pr15 { padding-right: 15px !important; }

.pr20 { padding-right: 20px !important; }

.pr25 { padding-right: 25px !important; }

.pr30 { padding-right: 30px !important; }

.pr35 { padding-right: 35px !important; }

.pr40 { padding-right: 40px !important; }

.pr45 { padding-right: 45px !important; }

.pr50 { padding-right: 50px !important; }

.w10 { width: 10px !important; }

.w20 { width: 20px !important; }

.w30 { width: 30px !important; }

.w40 { width: 40px !important; }

.w50 { width: 50px !important; }

.w60 { width: 60px !important; }

.w70 { width: 70px !important; }

.w80 { width: 80px !important; }

.w90 { width: 90px !important; }

.w100 { width: 100px !important; }

.w110 { width: 110px !important; }

.w120 { width: 120px !important; }

.w130 { width: 130px !important; }

.w140 { width: 140px !important; }

.w150 { width: 150px !important; }

.w160 { width: 160px !important; }

.w170 { width: 170px !important; }

.w180 { width: 180px !important; }

.w190 { width: 190px !important; }

.w200 { width: 200px !important; }

.w210 { width: 210px !important; }

.w220 { width: 220px !important; }

.w230 { width: 230px !important; }

.w240 { width: 240px !important; }

.w250 { width: 250px !important; }

.w260 { width: 260px !important; }

.w270 { width: 270px !important; }

.w280 { width: 280px !important; }

.w290 { width: 290px !important; }

.w300 { width: 300px !important; }

.w310 { width: 310px !important; }

.w320 { width: 320px !important; }

.w330 { width: 330px !important; }

.w340 { width: 340px !important; }

.w350 { width: 350px !important; }

.w360 { width: 360px !important; }

.w370 { width: 370px !important; }

.w380 { width: 380px !important; }

.w390 { width: 390px !important; }

.w400 { width: 400px !important; }

.w410 { width: 410px !important; }

.w420 { width: 420px !important; }

.w430 { width: 430px !important; }

.w440 { width: 440px !important; }

.w450 { width: 450px !important; }

.w460 { width: 460px !important; }

.w470 { width: 470px !important; }

.w480 { width: 480px !important; }

.w490 { width: 490px !important; }

.w500 { width: 500px !important; }

.w510 { width: 510px !important; }

.w520 { width: 520px !important; }

.w530 { width: 530px !important; }

.w540 { width: 540px !important; }

.w550 { width: 550px !important; }

.w560 { width: 560px !important; }

.w570 { width: 570px !important; }

.w580 { width: 580px !important; }

.w590 { width: 590px !important; }

.w600 { width: 600px !important; }

.w610 { width: 610px !important; }

.w620 { width: 620px !important; }

.w630 { width: 630px !important; }

.w640 { width: 640px !important; }

.w650 { width: 650px !important; }

.w660 { width: 660px !important; }

.w670 { width: 670px !important; }

.w680 { width: 680px !important; }

.w690 { width: 690px !important; }

.w700 { width: 700px !important; }

.w710 { width: 710px !important; }

.w720 { width: 720px !important; }

.w730 { width: 730px !important; }

.w740 { width: 740px !important; }

.w750 { width: 750px !important; }

.w760 { width: 760px !important; }

.w770 { width: 770px !important; }

.w780 { width: 780px !important; }

.w790 { width: 790px !important; }

.w800 { width: 800px !important; }

.w810 { width: 810px !important; }

.w820 { width: 820px !important; }

.w830 { width: 830px !important; }

.w840 { width: 840px !important; }

.w850 { width: 850px !important; }

.w860 { width: 860px !important; }

.w870 { width: 870px !important; }

.w880 { width: 880px !important; }

.w890 { width: 890px !important; }

.w900 { width: 900px !important; }

.w910 { width: 910px !important; }

.w920 { width: 920px !important; }

.w930 { width: 930px !important; }

.w940 { width: 940px !important; }

.w950 { width: 950px !important; }

.bdrNone { border: none !important; }

.bgNone { background: none !important; }

.top { vertical-align: top !important; }

.middle { vertical-align: middle !important; }

.bottom { vertical-align: bottom !important; }

.bold { font-weight: bold !important; }

.fnt80 { font-size: 80% !important; }

.fnt85 { font-size: 85% !important; }

.fnt90 { font-size: 90% !important; }

.fnt95 { font-size: 95% !important; }

.fnt100 { font-size: 100% !important; }

.fnt110 { font-size: 110% !important; }

.fnt120 { font-size: 120% !important; }

.fnt130 { font-size: 130% !important; }

.fnt140 { font-size: 140% !important; }

.floR { float: right !important; }

.floL { float: left !important; }

.floNone { float: none !important; }

.block { display: block !important; }

.inline { display: inline !important; }

.colorRed { color: #cc0000 !important; }

.spHide { display: none; }

@media screen and (max-width: 640px) { .pcHide { display: none; }
  .spHide { display: block !important; } }
body { font: 13px 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',arial,helvetica,clean,sans-serif; color: #333; line-height: 1.5; -webkit-text-size-adjust: 100%; }

a { color: #e4008c; text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; height: auto; }

/*------------------------------------------------------------------
	HEADER
-----------------------------------------------------------------*/
.header { position: relative; }
.header nav { background: url(../img/dotGreen.jpg); background-size: 4px auto; position: fixed; bottom: 0; left: 0; right: 0; padding: 10px 30px; font-size: 0; z-index: 100; transform: translate(0, 0); opacity: 1; transition: translate, opacity .2s; }
.header nav.disabled { transform: translate(0, 120%); opacity: 0; }
.header nav ul { height: 0; overflow: hidden; opacity: 0; }
.header nav ul.active { transition: all .2s; height: auto; overflow: visible; opacity: 1; }
.header nav ul.active + button .close { display: inline; }
.header nav ul.active + button .open { display: none; }
.header nav li { box-sizing: border-box; font-size: 1rem; display: inline-block; width: 100%; border-bottom: 1px solid #80BCAD; margin: 0 0 10px; padding: 5px 8px 10px; }
.header nav li:nth-child(4) a { border-right: 1px solid #80BCAD; }
.header nav li:nth-child(4), .header nav li:nth-child(5) { border-bottom: 0; width: 50%; }
.header nav li a { display: block; }
.header nav button { display: block; background: none; border: 0; text-align: center; width: 100%; outline: none; }
.header nav button .close { display: none; }

.logo { position: absolute; top: 10px; right: 10px; }

.btnPlay { position: absolute; top: 35.7%; width: 43.7%; left: 28.1%; }

@media screen and (min-width: 641px) { .header { background: url(../img/bgMainVisualPC.jpg) 50% 0 no-repeat; }
  .header nav { background: url(../img/dotGreen.jpg); background-size: 8px auto; position: fixed; bottom: 0; left: 0; right: 0; }
  .header nav.disabled { transform: translate(0, 0); opacity: 1; }
  .header nav ul { text-align: center; height: 92px; overflow: hidden; opacity: 1; }
  .header nav ul.active { transition: all .2s; overflow: visible; opacity: 1; }
  .header nav ul.active + button { display: none; }
  .header nav li { width: 210px; border-bottom: 0; margin: 10px 4px 0; padding: 0; }
  .header nav li img { display: none; }
  .header nav li:nth-child(3) { width: 208px; }
  .header nav li:nth-child(4) a { border-right: 0; }
  .header nav li:nth-child(4), .header nav li:nth-child(5) { width: 150px; }
  .header nav li a { display: block; width: 210px; height: 72px; }
  .header nav li:nth-child(1) a { background: url(../img/btn1PC.png); }
  .header nav li:nth-child(2) a { background: url(../img/btn2PC.png); }
  .header nav li:nth-child(3) a { width: 208px; background: url(../img/btn3PC.png); }
  .header nav li:nth-child(4) a { width: 150px; background: url(../img/btn4PC.png); }
  .header nav li:nth-child(5) a { width: 150px; background: url(../img/btn5PC.png); }
  .header nav button { display: none; }
  .headerCont { position: relative; height: 720px; width: 1280px; margin: 0 auto; background: url(../img/bgMainVisualPC.jpg) 50% 0 no-repeat; }
  .mainVisual { background: url(../img/mainVisualPC.png) 50% 60px no-repeat; height: 720px; }
  .mainVisual img { display: none; }
  .logo { position: absolute; top: 30px; right: 30px; }
  .logo img { width: 102px; }
  .btnPlay { position: absolute; top: 258px; left: 50%; width: 228px; margin-left: -124px; } }
/*------------------------------------------------------------------
	INTRO
-----------------------------------------------------------------*/
.intro ul { display: flex; }
.intro ul li { width: 50%; }
@media screen and (min-width: 641px) { .intro { background: url(../img/intro/bg.gif); }
  .intro h2 { height: 370px; background: url(../img/intro/ttlPC.png) 50% 40px no-repeat; }
  .intro h2 img { display: none; }
  .intro .lead { display: none; }
  .intro ul { display: block; width: 960px; margin: 0 auto; font-size: 0rem; }
  .intro ul img { display: none; }
  .intro ul li { height: 534px; width: 478px; position: relative; display: inline-block; font-size: 1rem; }
  .intro ul li::before { content: ""; display: block; position: absolute; top: -37px; width: 191px; height: 138px; }
  .intro ul .btn a { display: block; width: 190px; height: 50px; position: absolute; top: 455px; left: 145px; }
  .intro ul li:nth-child(1) { margin-right: 4px; background: url(../img/intro/campaign1PC.png) 0 0 no-repeat; }
  .intro ul li:nth-child(1)::before { left: -41px; background: url(../img/intro/baloon1.png); }
  .intro ul li:nth-child(1) .btn a { background: url(../img/intro/btnCampaign1PC.png); }
  .intro ul li:nth-child(2) { background: url(../img/intro/campaign2PC.png) 0 0 no-repeat; }
  .intro ul li:nth-child(2)::before { right: -41px; background: url(../img/intro/baloon2.png); }
  .intro ul li:nth-child(2) .btn a { background: url(../img/intro/btnCampaign2PC.png); } }

/*------------------------------------------------------------------
	CAMPAIGN
-----------------------------------------------------------------*/
.campaign { background: url(../img/campaign/bg.jpg) 50% 0 no-repeat; background-size: 100% auto; padding: 10px 0; }
.campaign .camp, .campaign .guideline { margin: 0 10px 20px; padding-bottom: 10px; border-radius: 10px; background: #fff; box-shadow: 0 0 5px rgba(19, 59, 50, 0.3); }
.campaign .camp li.rule, .campaign .guideline li.rule { padding: 10px; border-bottom: 1px solid #CBCBCB; }
.campaign .camp li.rule:last-child, .campaign .guideline li.rule:last-child { border: 0; padding: 10px 10px 0; }
.campaign .camp li.rule .headline, .campaign .guideline li.rule .headline { padding: 10px 60px 10px 0; position: relative; font-size: 15px; font-weight: bold; }
.campaign .camp li.rule .headline::after, .campaign .guideline li.rule .headline::after { content: ""; display: block; width: 34px; height: 34px; position: absolute; right: 0; top: 50%; margin-top: -17px; background: #3e3e3e url(../img/campaign/guideline/iconPlus.png) 50% 50% no-repeat; background-size: 18px; border-radius: 5px; box-shadow: 0 3px 0 #000; }
.campaign .camp li.rule .headline.active::after, .campaign .guideline li.rule .headline.active::after { background: #3e3e3e url(../img/campaign/guideline/iconMinus.png) 50% 50% no-repeat; background-size: 18px; }
.campaign .camp li.rule .headline.active + .cont, .campaign .guideline li.rule .headline.active + .cont { transition: all .2s; opacity: 1; height: auto; overflow: visible; padding-top: 10px; }
.campaign .camp li.rule .cont, .campaign .guideline li.rule .cont { opacity: 0; height: 0; overflow: hidden; }
.campaign .camp li.rule .cont li, .campaign .guideline li.rule .cont li { padding-left: 1em; text-indent: -1em; }
.campaign .txt { padding: 15px; }
.campaign .plugin { margin: 0 10px; }
.campaign .prof { margin: 10px; padding: 20px 20px 20px 70px; background: #e4f8ae url(../img/campaign/charaProf.png) 20px 50% no-repeat; background-size: auto 80px; font-size: 13px; font-weight: bold; border-radius: 5px; }
.campaign .prof .btn { margin: 10px 0 0; width: 150px; }

@media screen and (min-width: 641px) { .campaign { background: url(../img/campaign/bg.png) 50% 0 no-repeat; background-size: cover; }
  .campaign img { display: none; }
  .campaign h2 { height: 232px; background: url(../img/campaign/ttlPC.png) 50% 24px no-repeat; }
  .campaign .camp { width: 1060px; margin: 0 auto 40px; border-radius: 10px; position: relative; }
  .campaign .camp#jsCamp1 h3 { height: 466px; background: url(../img/campaign/camp1PC.png) 50% 0 no-repeat; }
  .campaign .camp#jsCamp1 .txt { position: absolute; top: 275px; left: 60px; font-size: 18px; width: 484px; padding: 0; }
  .campaign .camp#jsCamp1 h4 { height: 143px; background: url(../img/campaign/ttlPluginPC.gif) 50% 0 no-repeat; }
  .campaign .camp#jsCamp2 h3 { height: 566px; background: url(../img/campaign/camp2PC.png) 50% 0 no-repeat; }
  .campaign .camp#jsCamp2 .txt { position: absolute; top: 275px; left: 490px; font-size: 18px; width: 484px; padding: 0; }
  .campaign .camp#jsCamp2 .comment { height: 195px; background: url(../img/campaign/commentPC.gif) 50% 0 no-repeat; }
  .campaign .camp#jsCamp2 h4 { height: 151px; background: url(../img/campaign/ttlPlugin2PC.gif) 50% 0 no-repeat; }
  .campaign .camp .prof { position: absolute; top: 446px; left: 480px; width: 438px; height: 64px; padding: 20px 0 0 70px; background: #e4f8ae; font-size: 16px; font-weight: bold; }
  .campaign .camp .prof::before { position: absolute; top: -15px; left: 15px; content: ""; display: block; width: 45px; height: 180px; background: url(../img/campaign/charaProf.png) 0 0 no-repeat; background-size: 45px auto; }
  .campaign .camp .prof .btn { position: absolute; right: 50px; top: 10px; }
  .campaign .camp .prof .btn a { display: block; width: 190px; height: 50px; background: url(../img/campaign/btnProfPC.png); }
  .campaign .guideline { width: 1060px; margin: 0 auto 40px; border-radius: 10px; position: relative; }
  .campaign .guideline h3 { height: 60px; background: url(../img/campaign/guideline/ttlPC.png); }
  .campaign .guideline li.rule { border: 0; }
  .campaign .guideline li.rule .headline { font-size: 18px; border-bottom: 2px solid #CBCBCB; padding: 5px 10px 5px 0; margin: 0 0 10px; }
  .campaign .guideline li.rule .headline::before { content: "●"; color: #127A5E; font-size: 16px; padding-right: 5px; }
  .campaign .guideline li.rule .headline::after { display: none; }
  .campaign .guideline li.rule .cont { height: auto; opacity: 1; font-size: 16px; }
  .campaign .guidelineCont { margin: 30px 50px; height: 240px; overflow: auto; }
  .campaign .guidelineCont::-webkit-scrollbar { width: 6px; }
  .campaign .guidelineCont::-webkit-scrollbar-track { background: #DCDCDC; }
  .campaign .guidelineCont::-webkit-scrollbar-thumb { background: #127A5E; }
  .campaign .plugin { width: 960px; margin: 0 auto; } }
/*------------------------------------------------------------------
	SPOT
-----------------------------------------------------------------*/
.spot { background: url(../img/spot/bg.gif) 50% 0; background-size: 320px auto; padding: 20px 10px; }
.spot h2 { margin: 0 0 10px; text-align: center; }
.spot .btnFB { margin: 10px 15px 0; }
.spot .caution { padding: 0 10px 10px; color: #fff; font-size: 12px; }

#vrview { text-align: center; }

.spotList { width: 280px; margin: 0 auto 10px; padding: 0 10px; display: flex; }
.spotList li iframe { vertical-align: top; }
.spotList .cont { display: none; }

body.iPadMode .spotList { width: auto; display: block; text-align: center; font-size: 0rem; }
body.iPadMode .spotList li { display: inline-block; font-size: 1rem; }

body.pcMode .spot { background: url(../img/spot/bg.gif) 50% 0; background-size: 640px auto; padding: 20px 10px; }
body.pcMode .spot h2 { height: 253px; background: url(../img/spot/ttlPC.png) 50% 64px no-repeat; }
body.pcMode .spot h2 img { display: none; }
body.pcMode .spot ul { text-align: center; }
body.pcMode .spot li { margin: 0; width: 532px; height: 401px; display: inline-block; }
body.pcMode .spot li img { vertical-align: top; }
body.pcMode .spot li h3 { margin: 0; }
body.pcMode .spot li h3 img { display: none; }
body.pcMode .spot li:nth-child(1) { background: url(../img/spot/spot1.png) 0 0 no-repeat; padding-left: 422px; padding-top: 0; }
body.pcMode .spot li:nth-child(2) { background: url(../img/spot/spot2.png) 100% 0 no-repeat; padding-right: 414px; padding-top: 42px; }
body.pcMode .spot li:nth-child(3) { background: url(../img/spot/spot3.png) 0 0 no-repeat; padding-left: 422px; }
body.pcMode .spot li:nth-child(4) { background: url(../img/spot/spot4.png) 100% 0 no-repeat; padding-right: 414px; padding-top: 32px; }
body.pcMode .spot .cont { border: 4px solid; width: 524px; height: 346px; }
body.pcMode .spotList { width: auto; display: block; }
body.pcMode .spotList .cont { display: block; }
body.pcMode .spotList li:nth-child(1) .cont { border-color: #F79C19; }
body.pcMode .spotList li:nth-child(2) .cont { border-color: #82D153; }
body.pcMode .spotList li:nth-child(3) .cont { border-color: #F79C19; }
body.pcMode .spotList li:nth-child(4) .cont { border-color: #82D153; }

@media screen and (min-width: 641px) { .spot .ttlFB { height: 150px; background: url(../img/spot/ttlFBPC.png) 50% 0 no-repeat; }
  .spot .ttlFB img { display: none; }
  .spot .btnFB { padding-bottom: 40px; }
  .spot .btnFB img { display: none; }
  .spot .btnFB a { display: block; width: 700px; height: 101px; background: url(../img/spot/btnFBPC.png) 0 0 no-repeat; margin: 0 auto; }
  .caution { max-width: 960px; margin: 0 auto 30px; } }
/*------------------------------------------------------------------
	MASKED GIRL
-----------------------------------------------------------------*/
.mask { background: url(../img/mask/dotOrange.jpg) 50% 0; background-size: 4px auto; padding: 20px 10px; }
.mask .cont { background: #fff; border-radius: 10px; padding: 10px 0 0; margin: 0 0 5px; position: relative; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
.mask .img { text-align: center; padding: 0 15px; }
.mask .desc { padding: 20px; }
.mask .member { padding: 0 30px 30px; }
.mask h2 { margin: 0 0 10px; }
.mask .btnFB { margin: 10px 15px 0; }
.mask .star1 { margin: 0 0 5px; }

.btnPagetop { text-align: right; padding: 0 10px 10px; margin-top: -20px; }

@media screen and (min-width: 641px) { .mask { background: url(../img/mask/dotOrange.jpg) 50% 0; background-size: 8px auto; padding: 70px 0 70px; }
  .mask .cont { width: 1060px; margin: 0 auto; box-sizing: border-box; padding: 120px 70px 255px 560px; background: #fff url(../img/mask/img2PC.png) 30px 100% no-repeat; border-bottom: 30px solid #fff; }
  .mask .img { position: absolute; left: 35px; top: 55px; }
  .mask .desc { padding: 20px 0 20px 20px; }
  .mask .member { display: none; }
  .mask h2 { position: absolute; top: 35px; left: 508px; }
  .mask .btnFB { margin: 10px 15px 0; }
  .mask .star1, .mask .star2 { display: none; }
  .btnPagetop { position: relative; text-align: right; width: 1164px; margin: -47px auto 0; }
  .btnPagetop img { width: 95px; }
  .footer { padding: 20px 0 140px; text-align: center; font-size: 16px; } }
@media screen and (max-width: 640px) { #jsMovieWrap { display: none; } }
@media screen and (min-width: 641px) { .headerCont { background: none; }
  #jsMovieWrap { height: 720px; overflow: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
  #jsMovieOverlay { position: absolute; display: block; background: url(../img/pattern.png); top: 0; left: 0; right: 0; bottom: 0; z-index: 100; }
  .headerCont { z-index: 150; }
  #iframe_player_api { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } }
#movieModalOverlay { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.7); z-index: 2000; }

#movieModal { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2001; }
#movieModal #btnCloseMovieModal { text-align: right; margin-bottom: 10px; }

body.movieModalActive #movieModalOverlay { display: block; }
body.movieModalActive #movieModal { display: block; }

/* ### contents.scss ### */

/*# sourceMappingURL=base.css.map */