@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body { line-height: 1; }

ul, ol { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }

hr { display: block; height: 1px; border: 0; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

* { box-sizing: border-box; }

.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; }

.fnt10 { font-size: 1.0rem !important; }

.fnt12 { font-size: 1.2rem !important; }

.fnt14 { font-size: 1.4rem !important; }

.fnt16 { font-size: 1.6rem !important; }

.fnt18 { font-size: 1.8rem !important; }

.fnt20 { font-size: 2.0rem !important; }

.fnt22 { font-size: 2.2rem !important; }

.fnt24 { font-size: 2.4rem !important; }

.fnt26 { font-size: 2.6rem !important; }

.fnt28 { font-size: 2.8rem !important; }

.fnt30 { font-size: 3.0rem !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; }

img.spHide, .spHide { display: none; }

.pcHide { display: block; }

img.pcHide { display: inline-block; }

@media screen and (max-width: 767px) { img.pcHide, .pcHide { display: none; }
  .spHide { display: block; }
  img.spHide { display: inline-block; } }
html { font-size: 62.5%; }

body { min-width: 1280px; color: #333; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Kaku Gothic ProN", Verdana, Meiryo, sans-serif; font-size: 1.6rem; background: url(../img/bgMain.jpg); line-height: 1.5; -webkit-text-size-adjust: 100%; }
@media screen and (max-width: 767px) { body { min-width: 320px; font-size: 1.3rem; background-size: auto 21px; } }

a { color: #6e0047; }
@media screen and (min-width: 768px) { a { text-decoration: none; }
  a:hover { text-decoration: underline; } }

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

/*------------------------------------------------------------------
	パーツ
-----------------------------------------------------------------*/
.inner { margin: 0 auto; width: 960px; }
@media screen and (max-width: 767px) { .inner { width: 100%; } }

.title { line-height: 0; text-align: center; }

#wrapper { width: 100%; position: relative; overflow: hidden; }

/*------------------------------------------------------------------
	fv
-----------------------------------------------------------------*/
#loader { position: absolute; top: calc(50% - 23px); left: calc(50% - 23px); }
@media screen and (max-width: 767px) { #loader { width: 40px; top: calc(50% - 20px); left: calc(50% - 20px); } }

.mainVisual { text-align: center; }
.mainVisual .inner { margin: 0 auto; padding: 35px 0 40px; position: relative; }
@media screen and (min-width: 768px) { .mainVisual .inner { width: 1280px; background: url(../img/pc/bgFv.png) no-repeat 0 100px; } }
@media screen and (max-width: 767px) { .mainVisual .inner { padding-top: 35px; background: url(../img/sp/bgFv.png) no-repeat 0 0; background-size: cover; } }

.logo { position: absolute; top: 20px; left: 160px; }
@media screen and (max-width: 767px) { .logo { top: 20px; left: 20px; }
  .logo img { width: 31px; } }

@-webkit-keyframes rubberBand { 0% { transform: scaleX(1); }
  30% { transform: scale3d(1.25, 0.75, 1); }
  40% { transform: scale3d(0.75, 1.25, 1); }
  50% { transform: scale3d(1.15, 0.85, 1); }
  65% { transform: scale3d(0.95, 1.05, 1); }
  75% { transform: scale3d(1.05, 0.95, 1); }
  to { transform: scaleX(1); } }
@keyframes rubberBand { 0% { transform: scaleX(1); }
  30% { transform: scale3d(1.25, 0.75, 1); }
  40% { transform: scale3d(0.75, 1.25, 1); }
  50% { transform: scale3d(1.15, 0.85, 1); }
  65% { transform: scale3d(0.95, 1.05, 1); }
  75% { transform: scale3d(1.05, 0.95, 1); }
  to { transform: scaleX(1); } }
.rubberBand { -webkit-animation: rubberBand 1s ease-in-out; animation: rubberBand 1s ease-in-out; }

@media screen and (max-width: 767px) { .titleMainVisual img { width: 80%; } }
.mainVisualImage { margin-top: 20px; position: relative; line-height: 0; }

.mainVisualPeriod { margin-top: 15px; }
@media screen and (max-width: 767px) { .mainVisualPeriod { margin-top: 25px; }
  .mainVisualPeriod img { width: 62%; } }

@media screen and (min-width: 768px) { .mainVisualImage { margin: 20px auto 0; min-height: 500px; } }
@media screen and (max-width: 767px) { .mainVisualImage { width: 100%; min-height: 160px; } }
/*------------------------------------------------------------------
	nav
-----------------------------------------------------------------*/
.nav { background: url(../img/bgNavi.jpg); position: relative; z-index: 100; }

.navList { margin: 0 auto; display: flex; justify-content: center; }
.navList li a, .navList li span { width: 100%; height: 100%; display: block; background-position: center center; background-repeat: no-repeat; text-indent: 100%; overflow: hidden; white-space: nowrap; }

.nav01 { background-image: url(../img/pc/nav01.png); }

.nav02 { background-image: url(../img/pc/nav02.png); }

.nav03 { background-image: url(../img/pc/nav03.png); }

.nav04 { background-image: url(../img/pc/nav04.png); }

.nav05 { background-image: url(../img/pc/nav05.png); }

@media screen and (min-width: 768px) { .navList { width: 960px; height: 60px; border-right: 1px solid #885c5d; }
  .navList li { width: 25%; height: 100%; border-left: 1px solid #885c5d; }
  .navList li:hover { background: url(../img/bgNavi_hover.jpg); } }
@media screen and (max-width: 767px) { .navList { flex-flow: column; }
  .navList li { border-bottom: 1px solid #885c5d; }
  .navList li a, .navList li span { padding: 15px 0; }
  .nav00 { background-image: url(../img/sp/nav00.png); background-size: auto 12px; }
  .nav01 { background-image: url(../img/sp/nav01.png); background-size: auto 14px; }
  .nav02 { background-image: url(../img/sp/nav02.png); background-size: 157px auto; }
  .nav03 { background-image: url(../img/sp/nav03.png); background-size: 284px auto; }
  .nav04 { background-image: url(../img/sp/nav04.png); background-size: 126px auto; }
  .nav05 { background-image: url(../img/sp/nav05.png); background-size: 124px auto; }
  .navMenuBtn { width: 100%; padding: 15px 0; display: block; background: url(../img/sp/navOpen.png) no-repeat center center; background-size: 50px auto; text-indent: 100%; overflow: hidden; white-space: nowrap; }
  .navMenuBtn.open { background: url(../img/sp/navClose.png) no-repeat center center; background-size: 88px auto; } }
/*------------------------------------------------------------------
	企画概要
-----------------------------------------------------------------*/
.about { position: relative; z-index: 5; }

.leadAbout { padding-right: 10px; position: relative; }

.aboutLeadImage01, .aboutLeadImage02 { position: absolute; }

@media screen and (min-width: 768px) { .about { margin-top: -60px; padding: 85px 0 70px; }
  .leadAbout { text-align: center; }
  .aboutLeadImage01 { width: 280px; top: 65px; left: calc(50% - 550px); }
  .aboutLeadImage02 { width: 129px; top: 60px; left: calc(50% - 400px); } }
@media screen and (max-width: 767px) { .about { margin-top: -40px; padding: 55px 15px 15px; }
  .leadAbout { padding-right: 0; text-align: center; }
  .aboutLeadImage01 { width: 70%; top: 43px; left: 20%; }
  .aboutLeadImage02 { width: 30%; right: 10%; top: 50px; } }
.aboutInner { margin-top: 35px; padding: 30px 30px 40px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; background: url(../img/bgAbout.jpg); }
.aboutInner .title { width: 100%; }

.aboutInnerText { width: 509px; }

.aboutInnerImage { position: relative; text-align: center; }

.aboutInnerImage02 { position: absolute; left: -35px; top: 10px; }

@media screen and (min-width: 768px) { .aboutInnerImage { width: 340px; }
  .aboutInnerImage02 { width: 156px; } }
@media screen and (max-width: 767px) { .aboutInner { padding: 18px 15px; }
  .aboutInnerText { margin-top: 15px; }
  .aboutInnerImage { width: 100%; }
  .aboutInnerImage01 { margin-top: 50px; width: 46%; }
  .aboutInnerImage02 { width: 44%; left: 0; top: 10px; } }
/*------------------------------------------------------------------
	キャンペーン
-----------------------------------------------------------------*/
.vote { padding: 70px 0; background: url(../img/bgVote.jpg); }
@media screen and (max-width: 767px) { .vote { padding: 25px 15px; background-size: 100% auto, 500px auto; } }

.titleVote { padding-top: 65px; position: relative; }

.iconVoteTitle { position: absolute; right: calc(50% - 265px); top: 135px; }
@media screen and (max-width: 767px) { .iconVoteTitle { width: 23%; right: 5px; top: 39%; } }

@media screen and (max-width: 400px) { .iconVoteTitle { right: 4px; top: 42%; } }
.leadVote { margin-top: 30px; text-align: center; }
@media screen and (max-width: 767px) { .leadVote { margin-top: 70px; } }

.voteImage { margin-top: 35px; position: relative; text-align: center; }

.voteImage02 { position: absolute; }

@media screen and (min-width: 768px) { .voteImage02 { width: 156px; left: 200px; top: -20px; } }
@media screen and (max-width: 767px) { .voteImage { margin-top: 60px; }
  .voteImage01 { margin-right: -30px; }
  .voteImage02 { width: 38%; left: 0; top: -60px; } }
/*------------------------------------------------------------------
	写真館
-----------------------------------------------------------------*/
.photo { margin-top: 35px; }
.photo .inner { padding: 40px 30px 30px; background: url(../img/bgPhotoInner.jpg); }
@media screen and (max-width: 767px) { .photo { margin-top: 20px; }
  .photo .inner { padding: 0 15px 15px; } }

.leadPhoto { margin-top: -60px; padding-top: 70px; text-align: center; }
@media screen and (max-width: 767px) { .leadPhoto { margin-top: 0; padding-top: 15px; } }

.photoTitle { margin-top: 30px; }
@media screen and (max-width: 767px) { .photoTitle { margin-top: 5px; } }

.archivesList { margin-top: 60px; display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; }
.archivesList li { padding: 10px; width: 430px; position: relative; }
.archivesList li img { width: 100%; }
.archivesList li figcaption { margin-top: 10px; position: relative; color: #fff; text-align: right; line-height: 1; }
@media screen and (min-width: 768px) { .archivesList li:not(.coming):hover { cursor: pointer; } }
.archivesList .thumbFuki { width: 150px; position: absolute; left: -20px; top: -20px; }

@media screen and (max-width: 767px) { .archivesList { margin-top: 0; }
  .archivesList > li { margin-top: 15px; padding: 5px 5px 10px; width: 100%; }
  .archivesList > li figcaption { margin-top: 5px; font-size: 1.0rem; }
  .archivesList .thumbFuki { width: 95px; left: -12px; top: -12px; } }
.comingImage { display: none; }

.coming .comingImage { display: block; }
.coming figure img { display: none; }
.coming figcaption::before { content: "coming soon..."; position: absolute; left: 0; bottom: 5px; font-weight: bold; }
@media screen and (max-width: 767px) { .coming figcaption::before { bottom: 0; } }

.new figcaption::before { padding: 5px; content: "NEW!"; position: absolute; left: 0; bottom: -2px; color: #92000f; font-weight: bold; background: #fff; }
@media screen and (max-width: 767px) { .new figcaption::before { bottom: -4px; } }

/*------------------------------------------------------------------
	アイス
-----------------------------------------------------------------*/
.ice { padding-top: 130px; margin-top: -60px; background: url(../img/pc/bgIce01.jpg) no-repeat 50% 420px, url(../img/pc/bgIce02.png) no-repeat 50% 703px; text-align: center; }
@media screen and (max-width: 767px) { .ice { margin-top: 0; padding: 30px 15px 0; background: url(../img/sp/bgIce01.png) no-repeat 50% 280px; background-size: contain; } }

.leadIce { margin-top: 50px; line-height: 0; }
@media screen and (max-width: 767px) { .leadIce { margin-top: 20px; }
  .leadIce img { width: 84%; } }

.leadIce02 { margin-top: 35px; }
@media screen and (max-width: 767px) { .leadIce02 { margin-top: 20px; } }

.iceFeature { margin-top: 320px; display: flex; justify-content: space-between; }

.iceFeatureCont { padding: 5px; width: 450px; min-height: 480px; background: rgba(255, 255, 255, 0.9); }

.iceFeatureInner { padding: 25px 15px 0; height: 100%; border: 2px solid #c8b0ae; }
.iceFeatureInner figcaption { margin-top: 20px; display: block; text-align: left; line-height: 1.9; }

@media screen and (max-width: 767px) { .iceFeature { margin-top: 215px; flex-flow: column; justify-content: center; align-items: center; }
  .iceFeatureCont { width: 100%; min-height: 0; }
  .iceFeatureCont ~ .iceFeatureCont { margin-top: 10px; }
  .iceFeatureInner { padding: 15px; } }
.lineUpIce { margin-top: 65px; }

.lineUpList { margin-top: 10px; padding: 0 20px; display: flex; flex-flow: row wrap; justify-content: space-between; }
.lineUpList li { margin-top: 20px; padding-top: 5px; width: 450px; line-height: 0; }
.lineUpList figcaption { padding: 25px 20px; color: #fff; line-height: 1.5; }
.lineUpList figcaption p { margin-top: 15px; text-align: left; }

.lineupNew { position: relative; display: block; }
.lineupNew::before { width: 4em; height: 30px; position: absolute; left: 5px; top: calc(50% - 12px); color: #92000f; background: #fff; text-align: center; line-height: 30px; content: "NEW!"; }
@media screen and (max-width: 767px) { .lineupNew::before { padding: 5px 0; height: auto; left: -50%; top: calc(50% - 10px); font-size: 1.0rem; line-height: 1; } }

@media screen and (max-width: 767px) { .lineUpIce { margin-top: 20px; }
  .lineUpIce .title img { width: 80%; }
  .lineUpList { margin-top: 5px; padding: 0; }
  .lineUpList li { margin-top: 10px; padding: 3px 3px 25px; width: 100%; }
  .lineUpList figcaption { padding: 15px 12px 0; }
  .lineUpList figcaption strong { margin: auto; display: block; width: 60%; }
  .lineUpList figcaption p { margin-top: 8px; }
  .lineUpList .annoimo strong { width: 40%; } }
.annoimo { background: url(../img/bgIceColor01.jpg); }

.milk { background: url(../img/bgIceColor02.jpg); }

.greentea { background: url(../img/bgIceColor03.jpg); }

.kinako { background: url(../img/bgIceColor04.jpg); }

.warabimochi { background: url(../img/bgIceColor05.jpg); }

/*------------------------------------------------------------------
	関連情報
-----------------------------------------------------------------*/
.info { margin-top: 90px; padding-bottom: 70px; text-align: center; line-height: 1; }
.info .inner { border-bottom: 1px solid #b7ad81; }

.productForm { margin-top: 20px; }

.rt { margin-top: 70px; padding-bottom: 10px; font-size: 1.3rem; text-align: right; }

.bnrOfficial { margin-top: 55px; }

@media screen and (max-width: 767px) { .info { margin-top: 30px; padding: 0 15px; }
  .rt { font-size: 1.0rem; }
  .bnrOfficial { margin-top: 30px; }
  .bnrOfficial img { width: 250px; } }
/*------------------------------------------------------------------
	pagetop
-----------------------------------------------------------------*/
@media screen and (min-width: 768px) { .pagetop { margin-left: 320px; position: absolute; bottom: 20px; left: 50%; }
  .pagetop:hover { -webkit-animation: pagetop 1s ease infinite; animation: pagetop 1s ease infinite; }
  @-webkit-keyframes pagetop { 0% { bottom: 20px; }
    50% { bottom: 40px; }
    60% { -webkit-transform: rotate(10deg); transform: rotate(10deg); }
    100% { bottom: 20px; } }
  @keyframes pagetop { 0% { bottom: 20px; }
    50% { bottom: 40px; }
    60% { -webkit-transform: rotate(10deg); transform: rotate(10deg); }
    100% { bottom: 20px; } } }
@media screen and (max-width: 767px) { .pagetop { margin-top: 25px; padding-bottom: 15px; text-align: center; }
  .pagetop img { width: 120px; } }
/*------------------------------------------------------------------
	footer
-----------------------------------------------------------------*/
.footer { padding: 20px 0; background: url(../img/bgFooter.jpg); text-align: center; line-height: 0; }
@media screen and (max-width: 767px) { .footer { padding: 20px 10px; } }

/*------------------------------------------------------------------
	social
-----------------------------------------------------------------*/
.social { width: 100%; }
.social ul { display: flex; justify-content: center; line-height: 0; }
.social .tw { margin-left: 10px; }
@media screen and (max-width: 767px) { .social { margin-top: 10px; } }

/*------------------------------------------------------------------
	modal
-----------------------------------------------------------------*/
#overlay { width: 100%; height: 100%; display: none; position: fixed; top: 0; left: 0; background: rgba(0, 0, 0, 0.5); z-index: 1000; }

.modalClose { position: fixed; top: 20px; right: 20px; }
@media screen and (min-width: 768px) { .modalClose:hover { cursor: pointer; } }
@media screen and (max-width: 767px) { .modalClose { top: 10px; right: 10px; } }

.modal { display: none; position: fixed; z-index: 1001; }
@media screen and (min-width: 768px) { .modal { width: 1000px; height: 524px; top: calc(50% - 262px); left: calc(50% - 500px); } }
@media screen and (max-width: 767px) { .modal { width: 600px; height: 314px; top: calc(50% - 157px); left: calc(50% - 300px); } }

@media screen and (orientation: landscape) and (max-width: 800px) { .modalClose { width: 26px; top: 5px; right: 5px; } }
@media screen and (max-width: 599px) { .modal { width: 500px; height: 262px; top: calc(50% - 131px); left: calc(50% - 250px); } }
@media screen and (max-width: 499px) { .modal { width: 400px; height: 210px; top: calc(50% - 105px); left: calc(50% - 200px); } }
@media screen and (max-width: 399px) { .modal { width: 320px; height: 168px; top: calc(50% - 84px); left: calc(50% - 160px); } }
/*------------------------------------------------------------------
	開催中
-----------------------------------------------------------------*/
@media screen and (min-width: 768px) { .present { margin: 60px auto 0; width: 960px; } }
@media screen and (max-width: 767px) { .present { margin-top: 20px; } }

.presentList { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: baseline; }
.presentList li { position: relative; text-align: center; line-height: 0; }
.presentList li figcaption { margin-top: 10px; display: block; }
.presentList li .attention { margin-top: 15px; font-size: 1.2rem; line-height: 1.2; }
@media screen and (max-width: 767px) { .presentList li .attention { font-size: 1.1rem; } }
.presentList .pre04 { margin-top: 40px; width: 100%; font-size: 1.2rem; line-height: 1.5; }
@media screen and (max-width: 767px) { .presentList .pre04 { margin-top: 15px; font-size: 1.1rem; } }
.presentList [class$=img02] { position: absolute; right: 0; top: 0; }
@media screen and (max-width: 767px) { .presentList { flex-flow: column; justify-content: center; align-items: center; } }

@media screen and (min-width: 768px) { .presentList .pre01img01 { width: 287px; }
  .presentList .pre02img01 { width: 354px; }
  .presentList .pre03img01 { width: 245px; }
  .presentList [class$=img02] { width: 126px; }
  .presentList .pre02img02 { top: 86px; right: -30px; }
  .presentList .pre03img02 { right: -45px; }
  .presentList .pre01 { order: 1; }
  .presentList .pre01 figcaption img { width: 245px; }
  .presentList .pre02 { order: 2; }
  .presentList .pre02 figcaption img { width: 279px; }
  .presentList .pre03 { order: 3; }
  .presentList .pre03 figcaption img { width: 233px; }
  .presentList .pre04 { order: 4; } }
@media screen and (max-width: 767px) { .presentList .pre02img01 { width: 78%; }
  .presentList li ~ li { margin-top: 30px; }
  .presentList .pre01img01, .presentList .pre03img01 { width: 62%; }
  .presentList figcaption img { width: 60%; }
  .presentList .pre01img02 { width: 30%; right: calc(50% - 100px); }
  .presentList .pre02img02 { width: 30%; top: 5%; right: calc(50% - 130px); }
  .presentList .pre03img02 { width: 30%; top: -3%; right: calc(50% - 115px); }
  .pre01 { order: 2; }
  .pre02 { order: 1; }
  .pre03 { order: 4; }
  .pre04 { order: 3; } }
.leadJoin { margin-top: 40px; text-align: center; }
@media screen and (max-width: 767px) { .leadJoin { margin-top: 15px; }
  .leadJoin img { width: 195px; } }

.btnJoin { margin-top: 50px; text-align: center; }
@media screen and (max-width: 767px) { .btnJoin { margin-top: 15px; } }

.photo.photo01 .photoTitle { margin-top: 0; }
@media screen and (max-width: 767px) { .photo.photo01 .inner { padding-top: 15px; } }
.photo.photo01 .archivesList > li { line-height: 0; }
@media screen and (max-width: 767px) { .photo.photo01 .archivesList > li { padding: 5px; }
  .photo.photo01 .archives:nth-of-type(n+2) { display: none; } }
.photo.photo02 { margin-top: 0; padding: 70px 0; background: url(../img/bgPhotoMain.jpg); }
@media screen and (max-width: 767px) { .photo.photo02 { padding: 15px; background-size: auto 21px; } }
.photo.photo02 .archives:nth-of-type(n+2) { display: none; }

.openArchives { margin-top: 30px; display: block; text-align: center; }
@media screen and (min-width: 768px) { .openArchives:hover { cursor: pointer; } }
@media screen and (max-width: 767px) { .openArchives { margin-top: 15px; }
  .openArchives img { width: 68%; } }

/*------------------------------------------------------------------
	終了後
-----------------------------------------------------------------*/
.mainVisualImage.is-close { position: relative; }

.titleCloseMain { position: absolute; left: calc(50% - 288px); top: -50px; }

.leadVoteClose { margin-top: 60px; text-align: center; }

@media screen and (max-width: 767px) { .mainVisualPeriod.is-close img { width: 80%; }
  .titleCloseMain { width: 81%; left: 10%; top: -60px; }
  .leadVoteClose { margin-top: 30px; }
  .leadVoteClose img { width: 80%; } }
/*------------------------------------------------------------------
	結果発表
-----------------------------------------------------------------*/
.mainVisualPeriod.is-result { margin: 25px 0 -5px; }
@media screen and (max-width: 767px) { .mainVisualPeriod.is-result { margin: 15px 0 -20px; }
  .mainVisualPeriod.is-result img { width: 86%; } }

.leadVoteClose.is-result { margin-top: 20px; }
@media screen and (max-width: 767px) { .leadVoteClose.is-result { margin-top: 30%; } }

.photo.is-result { margin-top: 50px; }
@media screen and (max-width: 767px) { .photo.is-result { margin-top: 15px; } }

.result { position: relative; }
@media screen and (min-width: 768px) { .result { padding: 45px 0 40px; display: flex; justify-content: center; align-items: center; }
  .result .archivesList { z-index: 1; }
  .result .bgResult { display: block; position: absolute; top: 0; left: calc(50% - 361px); } }
@media screen and (max-width: 767px) { .result { padding-top: 25px; }
  .result + .archives { display: block !important; } }
.result .crown { position: absolute; }
@media screen and (min-width: 768px) { .result .crown { top: 1px; left: calc(50% - 37px); }
  .result .crown img { width: 74px; } }
@media screen and (max-width: 767px) { .result .crown { width: 17%; display: block; left: 41.5%; text-align: center; line-height: 0; } }

@media screen and (min-width: 412px) and (max-width: 767px) { .result .crown { top: 9px; } }
@media screen and (min-width: 321px) and (max-width: 411px) { .result .crown { top: 13px; } }
@media screen and (max-width: 320px) { .result .crown { top: 18px; } }
@media screen and (orientation: landscape) and (max-width: 800px) { .result { padding-top: 30px; }
  .result .crown { top: -4px; } }
.winnerIcon { width: 100%; display: flex; justify-content: center; align-items: center; text-align: center; }
.winnerIcon li { padding: 10px 10px 0; }
@media screen and (min-width: 768px) { .winnerIcon li .star { width: 107px; } }
@media screen and (max-width: 767px) { .winnerIcon li { padding: 5px 5px 0; }
  .winnerIcon li img { width: 90%; } }

.present.is-result { margin-top: 100px; }
.present.is-result .leadVoteClose { margin-top: 40px; }
@media screen and (max-width: 767px) { .present.is-result { margin-top: 30px; }
  .present.is-result .leadVoteClose { margin-top: 25px; } }
.present.is-result .presentList { margin-top: 45px; }
@media screen and (max-width: 767px) { .present.is-result .presentList { margin-top: 15px; } }

.flash { -webkit-animation: flash 1s ease-in-out; animation: flash 1s ease-in-out; }

@-webkit-keyframes flash { 0%,50%,to { opacity: 1; }
  25%,75% { opacity: 0; } }
@keyframes flash { 0%,50%,to { opacity: 1; }
  25%,75% { opacity: 0; } }

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