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, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body {line-height:1.8}
article, aside, dialog, figure, footer, header,
hgroup, nav, section {display:block}
ul, ol, li {list-style:none}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {content:'';content:none;}
a {margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent}
ins {background-color:#ff9;color:#000;text-decoration:none}
mark {background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del {text-decoration: line-through}
abbr[title], dfn[title] {border-bottom:1px dotted #000;cursor:help}
table {border-collapse:collapse;border-spacing:0}
hr {display:block;height:1px;border:0;border-top:2px solid #cccccc;margin:4em 0;padding:0}
input, select {vertical-align:middle}
/* responsive view */
.spView{display:none;}
@media screen and (max-width: 767px) {
.pcView{display:none;}
.spView{display:block;}
}
/* other */
.clearfix:after{content: "."; display: block; height: 0; font-size:0; clear: both; visibility:hidden}
.clearfix{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix{display:block;}
/*========================================
BASIC
=======================================*/
html{-webkit-text-size-adjust:100%}
body{max-width: 1920px; margin: 0 auto;overflow-x: hidden;width: 100%;color:#0B0B0B;font-family: 'Noto Sans JP', sans-serif;line-height:1.4;font-size: 18px;font-weight: 700;background:#00151c url("../img/bg.png") no-repeat; background-position: top center;background-size:1920px auto;position: relative;}
figure {line-height: 0}
img{line-height: 1;width: 100%;height: auto;}
h1,h2,h3,dt,th {font-weight: 600}
@media screen and (max-width: 1366px) {
body{background:#00151c url("../img/bg2.png") no-repeat;background-position: top center;background-size:1366px auto;}
}
@media screen and (max-width: 767px) {
body{background:#00151c url("../img/bg_sp.png") no-repeat;background-position: top center;background-size:100% auto;}
}
p {margin-bottom: 3%;}
.Hv {transition: .4s;}
.Hv:hover {transition: .4s; opacity: 0.7;}
/*========================================
MENU
=======================================*/
/**SCROLLBAR STYLE FOR IE**/
body {scrollbar-base-color: #138a72; scrollbar-3dlight-color: #fff; scrollbar-highlight-color: #1abc9c; scrollbar-track-color: #fff; scrollbar-arrow-color: #1abc9c; scrollbar-shadow-color: #1abc9c; scrollbar-dark-shadow-color: #1abc9c; -ms-overflow-style: -ms-autohiding-scrollbar;}
/*========================================
TEXT & TEXTAREA
=======================================*/
input, textarea, select {font-family:'Noto Sans JP', "游ゴシック体","Yu Gothic",YuGothic,"ヒラギノ角ゴシック Pro","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;}
input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], textarea {width:100%;border:1px solid #ECE1E1;background:#FFF;margin:0 0 2%;padding:2%;border-radius:4px;box-sizing: border-box;}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus{border: 2px solid #F85E8E;outline: none;}
/*========================================
COMMON STYLE
=======================================*/
a{color:#674F52;text-decoration:none;}
a:hover{color:#674F52;}
/* フォントカラー */
.red, .color-red {color:#dd3f00;}
/* フォント位置 */
.txt-l {text-align: left;}
.txt-r {text-align: right;}
.txt-c {text-align: center !important;}
.midNote {margin-bottom: 30px;}
/* フォントサイズ */
.fs-80 {font-size:80%;}
.fs-90 {font-size:90%;}
.fs-120 {font-size:120%;}
.fs-140 {font-size:140%;}
.fs-160 {font-size:160%;}
.fs-180 {font-size:180%;}
.fs-200 {font-size:200%;}
.quoteNote {text-align: right;font-size: 8px;padding-right: 5px;}
.effect-fade-ready {opacity : 0;}
.effect-fade {opacity : 0;transform : translate(0, 60px);transition : all 1000ms;}
.effect-fade.effect-scroll {opacity : 1;transform : translate(0, 0);}
.effect-zoom {opacity : 0.1;transform : scale(1.2,1.2);transition : all 500ms;}
.effect-zoom.effect-scroll {opacity : 1;transform : scale(1,1);}
/* margin */
.mt-0 {margin-top: 0!important;}
.mt-2 {margin-top: 2%!important;}
.mt-4 {margin-top: 4%!important;}
.mt-5 {margin-top: 5%!important;}
.mt-6 {margin-top: 6%!important;}
.mt-8 {margin-top: 8%!important;}
.mt-10 {margin-top: 10%!important;}
.mt-20px {margin-top: 20px!important;}
.mb-0 {margin-bottom: 0!important;}
.mb-2 {margin-bottom: 2%!important;}
.mb-4 {margin-bottom: 4%!important;}
.mb-5 {margin-bottom: 5%!important;}
.mb-6 {margin-bottom: 6%!important;}
.mb-8 {margin-bottom: 8%!important;}
.mb-10 {margin-bottom: 10%!important;}
.mb-12px {margin-bottom: 12px!important;}
.mb-15px {margin-bottom: 15px!important;}
@media screen and (max-width: 767px) {
.mt-20px {margin-top: 0px!important;}
}
/* フォントデコレーション */
.u-l { text-decoration:underline;}
.bold, .Bold {font-weight: 700;}
/* section */
section{}
/*========================================
CONTENTS
=======================================*/
section {width: 100%;position: relative;margin: 0 auto;box-sizing: border-box;}
@media screen and (max-width: 767px) {
section {max-width: 100%;width: 100%; display: block;overflow: hidden;}
}
/*====
header
=====*/
header {position: absolute; top: 10px; left: 10px; width: 191px; height: 55px;}
header .logo{}
@media screen and (max-width: 767px) {
header {position: absolute; top: 10px; left: 10px; width: 83.35px; height: 24px;}
}
/*====
hero
=====*/
.hero {width: 100%;position: relative;padding: 20px 0 20px;}
.hero .Cnt {margin: 0 auto;width: 100%;width: 1025px;overflow: hidden;}
#hero-default {display: none;}
.hero .Cnt h1 {width: 543px;margin: 0 auto 15px;}
.hero .Cnt h2 {width: 1020px;margin: 0 auto 10px;}
.hero .Cnt p {text-align: center;font-size: 20px;line-height: 1.7;margin-bottom: 15px;}
.hero .Cnt .start {width: 692px;margin: 0 auto 5px;}
.hero .Cnt .endMessage {border-radius: 16px;background: #fff;padding: 20px;margin: 25px auto 25px;box-sizing: border-box; max-width: 920px;width: 90%}
.hero .Cnt .endMessage h3 {text-align: center;font-size: 26px;margin-bottom: 20px;font-weight: 900}
.hero .Cnt .endMessage p {text-align: left;}
.hero .Cnt p .red {background: #fff;padding: 5px 10px;font-size: 90%}
.hero .Cnt--joined {display: none;align-items: center;justify-content: space-between;width: 1132px;}
.hero .Cnt--joined.is-active {display: flex;}
.hero .Cnt--joined > img:first-child {width: 500px;height: auto;}
.hero .Cnt--joined > .dataPanel {flex: 1;}
/*== dataPanel ==*/
.dataPanel {background: rgba(0, 29, 59, .7);border-radius: 12px;padding: 16px 20px;color: #fff;font-size: 13px;box-sizing: border-box; border: 4px solid #fff; height: 520px; }
.dataPanel-header {display: flex;justify-content: center;align-items: center;gap: 8px;margin-bottom: 10px;padding-bottom: 8px;border-bottom: 1px solid rgba(255,255,255,0.15);}
.dataPanel-nickname {font-size: 14px;font-weight: 700;}
.dataPanel-logout {font-size: 11px;color: rgba(255,255,255,0.6);cursor: pointer;}
.dataPanel-points {display: flex;align-items: center;gap: 10px;margin-bottom: 12px; background: rgba(0,0,0,0.25);border-radius: 8px; padding: 12px 14px;}
.dataPanel-points-label {background: #fff;color: #000;font-size: 13px;font-weight: 900;padding: 3px 20px;border-radius: 4px;white-space: nowrap; margin-right: 15px;}
.dataPanel-points-value {font-family: "Yantramanav", sans-serif;font-size: 40px;font-weight: 900;color: #FFF100;line-height: 1; margin-right: 15px;}
.dataPanel-points-unit {font-size: 18px;font-weight: 700;}
.dataPanel-points-badge {background: #cc0000;color: #fff;font-size: 13px;font-weight: 900;padding: 3px 15px 5px;border-radius: 4px;white-space: nowrap;}
.dataPanel-progress {margin-bottom: 14px;padding-bottom: 14px;border-bottom: 1px solid rgba(255,255,255,0.15);}
.dataPanel-progress-top {display: flex;align-items: baseline;gap: 8px;margin-bottom: 6px;}
.dataPanel-progress-label {font-size: 11px;color: rgba(255,255,255,0.7);}
.dataPanel-progress-value {font-family: "Yantramanav", sans-serif;font-size: 22px;font-weight: 700;color: #FFF100;line-height: 1;}
.dataPanel-progress-unit {font-size: 13px;}
.dataPanel-progress-bar {height: 10px;background: #3a3d50;border-radius: 5px;overflow: hidden;margin-bottom: 4px;position: relative;}
.dataPanel-progress-bar::after {content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: linear-gradient(90deg, rgba(0,0,0,0.5) 0.5px, transparent 0.5px, transparent calc(100% - 0.5px), rgba(0,0,0,0.5) calc(100% - 0.5px));background-size: 10% 100%;pointer-events: none;z-index: 1;}
.dataPanel-progress-fill {height: 100%;background: linear-gradient(90deg, #FFF100 0%, #ffda00 100%);border-radius: 5px;}
.dataPanel-progress-scale {display: flex;justify-content: space-between;font-size: 9px;color: rgba(255,255,255,0.45);font-family: "Yantramanav", sans-serif;}
.dataPanel-history {padding: 0;}
.dataPanel-history-inner {background: rgba(0,0,0,0.25);border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; }
.dataPanel-history-header {display: flex;justify-content: space-between;align-items: center;margin-bottom: 8px;}
.dataPanel-history-title {font-size: 13px;font-weight: 900;padding: 3px 20px;background: #fff;color: #001433;border-left: 3px solid #FFF100; border-radius: 4px;}
.dataPanel-history-total {font-size: 11px;color: rgba(255,255,255,0.7);}
.dataPanel-history-total strong {font-family: "Yantramanav", sans-serif;font-size: 15px;color: #fff100;font-weight: 700;}
.dataPanel-history-row {display: flex;align-items: center;justify-content: space-between;}
.dataPanel-history-months {display: flex;gap: 4px;}
.dataPanel-history-months span {font-size: 11px;padding: 3px 8px;border-radius: 4px;background: rgba(255,255,255,0.1);cursor: pointer;white-space: nowrap;}
.dataPanel-history-months span.is-active {background: #FFF100;color: #000;font-weight: 700;}
.dataPanel-chart-wrapper {display: flex;gap: 4px;align-items: stretch; margin-top:20px;}
.dataPanel-chart-yaxis {display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end;padding-bottom: 0;width: 22px;flex-shrink: 0;}
.dataPanel-chart-yaxis span {font-size: 10px;color: rgba(255,255,255,0.4);font-family: "Yantramanav", sans-serif;line-height: 0;transform: translateY(-0.5em);}
.dataPanel-chart-area {flex: 1;position: relative;min-width: 0;}
.dataPanel-chart-grid {position: absolute;top: 0;left: 0;right: 0;bottom: 0;display: flex;flex-direction: column;justify-content: space-between;pointer-events: none;z-index: 0;}
.dataPanel-chart-grid-line {border-bottom: 1px dashed rgba(255,255,255,0.5);width: 100%;}
.dataPanel-chart {display: flex;align-items: flex-end;justify-content: space-between;height: 160px;position: relative;z-index: 1;}
.dataPanel-chart-bar {flex: 1;max-width: 6px;background: #FFF100;border-radius: 1px 1px 0 0;min-height: 0;transition: height 0.3s;margin: 0 auto;}
.dataPanel-chart-bar--sp {background: #FFF100;position: relative;}
.dataPanel-chart-bar--sp::before {content: '';position: absolute;top: -14px;left: 50%;transform: translateX(-50%);width: 24px;height: 24px;background: url(../img/icon-sp.svg) no-repeat center/contain;}
.dataPanel-chart-xaxis {display: flex;gap: 2px;margin-bottom: 2px;margin-left: 26px;}
.dataPanel-chart-xaxis span {flex: 1;text-align: center;font-size: 7px;color: rgba(255,255,255,0.4);font-family: "Yantramanav", sans-serif;}
.dataPanel-history-stats {display: flex;align-items: baseline;gap: 16px;}
.dataPanel-history-statsValue {font-family: "Yantramanav", sans-serif;font-size: 28px;font-weight: 900;color: #FFF100;line-height: 1; border-right: 2px solid #4C6075; padding-right: 12px; }
.dataPanel-history-statsUnit {font-size: 14px;font-weight: 700;}
.dataPanel-history-statsRate {font-size: 13px;color: rgba(255,255,255,0.8);}
.dataPanel-history-statsRate strong {font-family: "Yantramanav", sans-serif;font-size: 22px;font-weight: 700;color: #FFF100;}
.dataPanel-history-statsPercent {font-size: 13px;}
.dataPanel-history-legend {text-align: right;font-size: 10px;color: rgba(255,255,255,0.5);}
.dataPanel-history-legend img {width: 12px;height: auto;vertical-align: middle;}
@keyframes gradient {
0% {background-position: 0% 50%;}
50% {background-position: 100% 50%;}
100% {background-position: 0% 50%;}
}
@media screen and (max-width: 767px) {
.hero {padding: 20px 0 12px;}
.hero .Cnt {width: 96%}
.hero .Cnt h1 {width: 240px;margin: 10px auto 10px;}
.hero .Cnt h2 {width: 90%;margin: 0 auto 6px;}
.hero .Cnt p {font-size: 15px;line-height: 1.2}
.hero .Cnt .start {width: 96%;margin: 0 auto 5px;}
.hero .Cnt .endMessage {padding: 15px;margin: 20px auto;width: 96%;}
.hero .Cnt .endMessage h3 {font-size: 16px;margin-bottom: 10px;letter-spacing: -1px;}
.hero .Cnt .endMessage p {font-weight:400:}
.hero .Cnt p .red {padding: 2px 5px;font-size: 14px}
.hero .Cnt--joined {flex-direction: column;gap: 10px;}
.hero .Cnt--joined.is-active {display: flex;}
.hero .Cnt--joined > img:first-child {width: 90%;}
.hero .Cnt--joined > .dataPanel {flex: none;width: 98%;}
.dataPanel {padding: 12px 14px;font-size: 12px; height:auto; }
.dataPanel-nickname {font-size: 12px;}
.dataPanel-points {flex-wrap: wrap;justify-content: space-between;}
.dataPanel-points-label {order: 1;margin-right: 0; padding:2px 4px;}
.dataPanel-points-badge {order: 2;}
.dataPanel-points-value {order: 3;width: 100%;text-align: right;margin-right: 0;font-size: 30px;}
.dataPanel-points-unit {font-size: 14px;}
.dataPanel-progress-value {font-size: 18px;}
.dataPanel-history-inner {padding: 12px 4px; }
.dataPanel-history-title {padding:2px 4px;}
.dataPanel-history-row {flex-wrap: wrap;}
.dataPanel-history-months {flex-wrap: wrap;gap: 3px; margin:auto;}
.dataPanel-history-months span {font-size: 12px;padding: 2px 6px;}
.dataPanel-chart {height: 140px;}
.dataPanel-chart-yaxis {width: 18px;}
.dataPanel-chart-xaxis {margin-left: 22px;}
.dataPanel-history-stats {margin:10px auto 0;}
.dataPanel-history-statsValue {font-size: 22px;}
.dataPanel-history-statsRate strong {font-size: 18px;}
.dataPanel-history-statsPercent {font-size: 11px;color: #FFF100;}
}
/*====
descSec
=====*/
section.descSec {width: 1132px;margin: 0 auto 30px;}
section.descSec .Cnt{display: block;}
section.descSec .Cnt ul{width: 100%;display: inline-block;}
section.descSec .Cnt li{width: 24%; float: left; margin-right: 1.333333%;}
section.descSec .Cnt li:last-child {margin-right: 0;float: right;}
section.descSec .Cnt .icon{background:#fff;width: 144px; height: 72px; border-radius: 50% / 100% 100% 0 0;position: relative;margin: 0 auto;}
section.descSec .Cnt .icon .ico{position: absolute;margin: auto;top: 40px;left: 0; right: 0 ;bottom: 0;}
.ico-radio{width: 72.08px;height: 72px;}
.ico-predict{width: 63.58px;height: 72px;}
.ico-point{width: 55.77px;height: 72px;}
.ico-prize{width: 49.5px;height: 72px;}
section.descSec .Cnt .desc{background: #fff; border-radius: 16px;box-sizing: border-box;min-height: 257px;padding: 30px 25px 10px;}
section.descSec .Cnt h3{width: 224px; margin: 0 auto 10px;}
section.descSec .Cnt p{font-size: 18px;margin-bottom: 0;font-weight: 500;}
@media screen and (max-width: 767px) {
section.descSec {width: 92%;margin: 0 auto 0px;overflow: visible;}
section.descSec .Cnt li{width: 100%; margin-right:0;position: relative;margin-bottom: 10px;}
section.descSec .Cnt li:last-child {float: left;}
section.descSec .Cnt .icon{background:#fff;width: 40px; height: 80px; border-radius: 100% 0 0 100% / 50%;position: absolute; top: calc(50% - 40px);float: left;}
section.descSec .Cnt .icon .ico{top: 2px; left: 21px;}
.ico-radio{width: 40px;height: 39.6px;}
.ico-predict{width: 38.55px;height: 43.66px;}
.ico-point{width: 33.82px;height: 43.66px;}
.ico-prize{width: 30.29px;height: 43.68px;}
section.descSec .Cnt .desc{width: calc(100% - 40px); min-height: auto;padding: 20px 15px 15px 25px;float: right;}
section.descSec .Cnt h3{width: 256px; margin: 0 0 8px;}
section.descSec .Cnt p{font-size: 15px; margin-bottom: 0}
}
/*====
bnrSec
=====*/
section.bnrSec {width: 1132px;margin: 0 auto 40px;}
section.bnrSec .Cnt{}
.shadow {filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.1));}
@media screen and (max-width: 767px) {
section.bnrSec {width: 100%;margin: 0 auto 0;}
section.bnrSec .bnrs {width: 94%; margin: 0 auto;}
section.bnrSec .bnrs img {width: 100%;height: auto;}
section.bnrSec .bnrs a {margin-bottom: 15px;display: block;}
}
/*====
presentSec
=====*/
section.presentSec {width: 1132px;margin: 50px auto 20px;padding-bottom: 30px;}
section.presentSec .Cnt {position: relative;}
section.presentSec .Cnt h2 {width: 98%;max-width: 1084px; margin: 0 auto;position: relative;z-index: 100}
section.presentSec .Cnt .box {background: #FAF9C4;margin-top: -120px;border-radius: 16px;position: relative;z-index: 50;padding: 86px 20px 30px}
section.presentSec .Cnt ul{width: 100%;display: inline-block;margin-bottom: 15px;}
section.presentSec .Cnt ul li {box-sizing: border-box;padding: 10px 20px 10px;position: relative;background: #fff; border-radius: 16px;float: left;}
section.presentSec .Cnt ul li .mask {width: 100%;height: 100%;background:rgba(0, 0, 0, .5);position: absolute;border-radius: 16px;left: 0 ;top: 0;z-index: 1}
section.presentSec .Cnt ul li .mask .mes{ color: #fff;text-align: center;font-weight: 900;font-size: 28px;line-height: 100%;width: 100%;height: 28px;margin: auto;top: 0;bottom: 0;position: absolute}
section.presentSec .Cnt ul.column3 li{width: 32%; margin-right: 2%;margin-bottom: 15px;font-weight: 900}
section.presentSec .Cnt ul.column3 li:nth-child(3n),
section.presentSec .Cnt ul.column3 li:last-child{margin-right: 0;float: left;}
@media screen and (max-width: 767px) {
section.presentSec .Cnt ul.column3 li:nth-child(3n),
section.presentSec .Cnt ul.column3 li:last-child{margin-right: 2%;float: none;}
}
section.presentSec .Cnt ul.column4 li{width: 24%; margin-right: 1.333333%;margin-bottom: 15px;}
section.presentSec .Cnt ul.column4 li:nth-child(4n),
section.presentSec .Cnt ul.column4 li:last-child{margin-right: 0;}
section.presentSec .Cnt ul li .limited {position: absolute;width: 72px; height: 72px;left: 10%}
section.presentSec .Cnt ul.column3 li figure {margin: 0 auto 10px; width: 70%; max-width: 240px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; overflow: hidden;}
section.presentSec .Cnt ul.column4 li figure {margin: 0 auto 10px; width: 70%;max-width: 160px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; overflow: hidden;}
section.presentSec .Cnt ul li figure img {width: 100%;height: 100%;object-fit: contain;display: block;}
section.presentSec .Cnt ul li .tit {text-align: center;font-size: 18px;line-height: 1.2;}
section.presentSec .Cnt ul.column3 li .tit {min-height: 48px;}
section.presentSec .Cnt ul li .point {text-align: center;font-size: 32px;margin-bottom: 0;font-family: "Yantramanav", sans-serif;}
section.presentSec .Cnt ul li .point span {font-size:18px; }
section.presentSec .Cnt .notion {width: 70%;max-width: 721px;margin: 0 auto 30px}
section.presentSec .Cnt .notion h3 {font-weight: 900;font-size: 18px;margin-bottom: 4px;}
section.presentSec .Cnt .notion p {margin-bottom: 15px;font-weight: 500;font-size: 14px;}
section.presentSec .Cnt .exBtn {position: absolute;bottom: -40px;left: 0;right: 0;margin: auto;max-width: 748px;max-height: 80px;width: 70%;}
/* 期間バッジ */
section.presentSec .Cnt .box .period-badge {display: block;background: #2a2a2a;color: #FFF100;font-size: 22px;font-weight: 900;padding: 8px 0;border-radius: 25px;letter-spacing: 3px;margin: 0 auto 24px;width: 100%;box-sizing: border-box;}
section.presentSec .Cnt .box {text-align: center;}
section.presentSec .Cnt ul {text-align: left;}
section.presentSec .Cnt ul .coming-soon {text-align: center;font-size: 24px;font-weight: 900;padding: 40px 0;color: #666; margin:0;}
/* アイテム情報（テキスト＋バッジ横並び） */
section.presentSec .Cnt ul li .item-info {display: flex;align-items: flex-end;gap: 8px;margin-top: 5px;}
section.presentSec .Cnt ul li .item-info .tit {flex: 1;text-align: left;font-size: 14px;line-height: 1.3;min-height: auto;}
section.presentSec .Cnt ul.column3 li .item-info .tit {font-size: 14px;}
section.presentSec .Cnt ul.column4 li .item-info .tit {font-size: 12px;}
/* 数量バッジ（黄色丸） */
section.presentSec .Cnt ul li .badge-qty {flex-shrink: 0;width: 60px;height: 60px;background: #FFF100;border-radius: 50%;display: flex;flex-direction: column;align-items: center;justify-content: center;font-weight: 900;line-height: 1;box-shadow: 0 2px 4px rgba(0,0,0,0.15);}
section.presentSec .Cnt ul.column4 li .badge-qty {width: 50px;height: 50px;}
section.presentSec .Cnt ul li .badge-qty .badge-qty-sub {font-size: 11px;line-height: 1.2;}
section.presentSec .Cnt ul li .badge-qty .badge-qty-num {font-size: 20px;line-height: 1.1;}
section.presentSec .Cnt ul li .badge-qty .badge-qty-unit {font-size: 14px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-sub {font-size: 10px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-num {font-size: 17px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-unit {font-size: 12px;}
/* 赤バナーテキスト */
section.presentSec .Cnt .present-banner {color: #cc0000;font-size: 26px;font-weight: 900;text-align: center;margin: 20px 0 20px;line-height: 1.4;background: #fff;padding: 20px 20px;border-radius: 38px;}
/* 注意事項リデザイン */
section.presentSec .Cnt .notion.notion-redesign {display: flex;align-items: flex-start;width: 100%;max-width: none;margin: 0;text-align: left;background: #f0f0f0;border-radius: 12px;padding: 20px 24px;box-sizing: border-box;}
section.presentSec .Cnt .notion-redesign .notion-label {flex-shrink: 0;padding: 4px 14px;font-size: 14px;font-weight: 900;margin-right: 20px;white-space: nowrap;line-height: 1.4;}
section.presentSec .Cnt .notion-redesign .notion-text {flex: 1;border-left: 2px solid #999;padding-left: 20px;}
section.presentSec .Cnt .notion-redesign .notion-text p {font-size: 13px;font-weight: 500;margin-bottom: 2px;line-height: 1.6;}
@media screen and (max-width: 767px) {
section.presentSec {width: 100%;margin: 0px auto 0px;padding-bottom: 30px;}
section.presentSec .Cnt h2 {width: 100%;position: relative;top: 0px;z-index: 100}
section.presentSec .Cnt .box {margin: -50px auto 0;border-radius: 16px;position: relative;z-index: 50;padding: 70px 16px 24px;width: 92%;box-sizing: border-box;}
/* 期間バッジ SP */
section.presentSec .Cnt .box .period-badge {font-size: 16px;padding: 6px 30px;letter-spacing: 2px;margin: 0 auto 16px;}
/* column3 SP: 1カラム縦並び */
section.presentSec .Cnt ul.column3 {margin-bottom: 10px;}
section.presentSec .Cnt ul.column3 li {width: 100%;float: none;margin-right: 0;margin-bottom: 10px;}
section.presentSec .Cnt ul.column3 li:last-child {float: none;margin-right: 0;margin-bottom: 10px;}
section.presentSec .Cnt ul.column3 li figure {width: 55%;max-width: 200px;}
/* column4 SP: 2x2グリッド */
section.presentSec .Cnt ul.column4 {display: flex;flex-wrap: wrap;gap: 10px;}
section.presentSec .Cnt ul.column4 li {width: calc(50% - 5px);float: none;margin-right: 0;margin-bottom: 0;}
section.presentSec .Cnt ul.column4 li:last-child {float: none;margin-right: 0;}
section.presentSec .Cnt ul.column4 li figure {width: 75%;max-width: 140px;}
/* バッジ SP */
section.presentSec .Cnt ul.column3 li .badge-qty {width: 50px;height: 50px;}
section.presentSec .Cnt ul.column3 li .badge-qty .badge-qty-num {font-size: 17px;}
section.presentSec .Cnt ul.column3 li .badge-qty .badge-qty-sub {font-size: 10px;}
section.presentSec .Cnt ul.column3 li .badge-qty .badge-qty-unit {font-size: 12px;}
section.presentSec .Cnt ul.column4 li .badge-qty {width: 42px;height: 42px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-num {font-size: 14px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-sub {font-size: 9px;}
section.presentSec .Cnt ul.column4 li .badge-qty .badge-qty-unit {font-size: 10px;}
/* テキスト SP */
section.presentSec .Cnt ul li .item-info .tit {font-size: 12px;}
section.presentSec .Cnt ul.column4 li .item-info .tit {font-size: 10px;}
/* マスク SP */
section.presentSec .Cnt ul li .mask .mes {font-size: 18px;height: 18px;}
/* 赤バナー SP */
section.presentSec .Cnt .present-banner {font-size: 18px;margin: 16px 0 20px;line-height: 1.5;}
/* 注意事項 SP: 縦配置 */
section.presentSec .Cnt .notion.notion-redesign {flex-direction: column;width: 100%;margin: 0 auto 10px;}
section.presentSec .Cnt .notion-redesign .notion-label {margin-right: 0;display: inline-block;font-size: 12px;padding: 3px 0 10px;}
section.presentSec .Cnt .notion-redesign .notion-text {border-left: none;padding-top: 8px;padding-left: 0; border-top: 1px solid #ccc;}
section.presentSec .Cnt .notion-redesign .notion-text p {font-size: 11px;line-height: 1.5;}
}
/*====
slider
=====*/
/*====
howtoSec
=====*/
section.howtoSec {width: 1132px;margin: 70px auto 20px;}
section.howtoSec .Cnt {position: relative;}
section.howtoSec .Cnt h2 {background: #18464C;height: 40px;border-radius: 20px;margin-bottom: 30px; text-align: center; box-sizing: border-box; padding: 1px 0;font-family: "Mochiy Pop P One", sans-serif;font-weight: 400;font-size: 28px;color: #fff;}
section.howtoSec .Cnt ul{width: 100%;display: inline-block;margin-bottom: 15px;}
section.howtoSec .Cnt li{width: 32%; margin-right: 2%;float: left;background: #fff;position: relative;box-sizing: border-box;padding: 8px;border-radius: 16px;}
section.howtoSec .Cnt li:last-child {margin-right: 0;float: right;}
section.howtoSec .Cnt li .box {}
section.howtoSec .Cnt li .num {width: 70px; height: 70px; position: absolute;margin: auto;left: 0;right: 0;top: -20px;}
section.howtoSec .Cnt li .heading {background: #FAF9C4;height: 118px;box-sizing: border-box;border-top-right-radius: 12px;border-top-left-radius: 12px;}
section.howtoSec .Cnt li h3 {font-weight: 700;font-size: 23px;line-height: 120%;text-align: center;color: #18464C;padding-top: 48px;}
section.howtoSec .Cnt li .mid {box-sizing: border-box;min-height: 118px;padding: 12px 15px;font-weight: 500;font-size: 18px;line-height: 1.4;}
section.howtoSec .Cnt li:last-child .mid {min-height:auto;padding: 15px 15px 0px;line-height: 1.2}
section.howtoSec .Cnt li .bottom {background: #EDE2CC;height: 150px;box-sizing: border-box;border-bottom-right-radius: 12px;border-bottom-left-radius: 12px;padding: 15px 0;position: relative;bottom: 0}
section.howtoSec .Cnt li .bottom .logged {background: #FFFFFF; border-radius: 14px; text-align: center; color: #231F20; width: 90%; /*position: absolute; top: 0; bottom: 0; left: 0; right: 0;*/ height: 29px; margin: auto; box-sizing: border-box; line-height: 29px;}
section.howtoSec .Cnt li .bottom .joined {background: #FFFFFF; border-radius: 14px;font-size: 18px; text-align: center; color: #231F20; width: 90%; height: 22px; margin: 0 auto; box-sizing: border-box; line-height: 22px;}
section.howtoSec .Cnt li:last-child .bottom {background: #fff;height: auto;padding: 0;width: 100%;margin: 0 auto; bottom: -7px;}
section.howtoSec .Cnt li .btn {position: relative;display: block;width: 90%;height: 56px;box-sizing: border-box; margin: 0 auto;border-radius: 16px;color:#231F20;}
section.howtoSec .Cnt li .btn.yellow {background: #FFF100;}
section.howtoSec .Cnt li .btn.yellow:before {position: absolute; top: 5px; left: 5px; width: calc(100% - 16px); height: calc(100% - 16px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.howtoSec .Cnt li .btn.black,
section.howtoSec .Cnt li .btn.black2
{background: #000;color: #fff}
section.howtoSec .Cnt li .btn.black:before,
section.howtoSec .Cnt li .btn.black2:before
{position: absolute; top: 5px; left: 5px; width: calc(100% - 16px); height: calc(100% - 16px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(255,255,255,.20); border-radius: 12px;}
section.howtoSec .Cnt li .btn.gray {background: #EBEBEB;color: #C3C2C2;}
section.howtoSec .Cnt li .btn.gray:before {position: absolute; top: 5px; left: 5px; width: calc(100% - 16px); height: calc(100% - 16px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.howtoSec .Cnt li .btn .tx {text-align: center;position: relative;font-size: 24px;line-height: 56px;}
section.howtoSec .Cnt li .btn .tx.reg:before {content: "";display: inline-block; background-image: url("../img/icon_member.svg");width: 34.67px; height: 32px;background-repeat: none; vertical-align: -5px; margin-right: 8px;}
section.howtoSec .Cnt li .btn .tx.join:before {content: "";display: inline-block; background-image: url("../img/icon_check.svg");width: 35px; height: 32px;background-repeat: none;vertical-align: -5px; margin-right: 8px;}
section.howtoSec .Cnt li .btn .tx.twitter:before {content: "";display: inline-block; background-image: url("../img/icon_move.svg");width: 35px; height: 32px;background-repeat: none;vertical-align: -5px; margin-right: 8px;}
section.howtoSec .Cnt li .btn.gray .tx.join:before,
section.howtoSec .Cnt li .btn.gray .tx.twitter:before {content: "";display: inline-block; background-image: url("../img/icon_check_transparent.svg");width: 0px; height: 0px;background-repeat: none;vertical-align: -5px; margin-right: 8px;}
section.howtoSec .Cnt li .arrow {position: absolute; top: calc(50% - 28px); right: -39px; height: 56px; width: 56px; z-index: 10;}
section.howtoSec .Cnt li .x-input {background:#EDE2CC;background-image: url("../img/icon-tw.svg");background-repeat: no-repeat;background-position: 3% 50%;background-size: 43px auto; border-bottom: 1px solid #000;margin: 0 auto 15px; width: 90%;overflow: hidden;padding-bottom: 14px;}
section.howtoSec .Cnt li .x-input input {background-color: #EDE2CC; font-size: 16px; width: calc(100% - 55px); float: right; padding: 5px 5px; box-sizing: border-box; margin: 0;position: relative; top: 6px;}
section.howtoSec .Cnt li .accountName {text-align: center;display: flex;width: 100%;height: 45px;box-sizing: border-box; margin: 0 auto;border-radius: 16px; justify-content: center; align-items: center;}
section.howtoSec .Cnt li .accountName .icon {background-image: url("../img/icon-tw.svg");background-repeat: no-repeat;background-size: 36px auto; width: 40px; height: 25px; background-position: 0px 3px;}
section.howtoSec .Cnt li .accountName .txt {font-size:24px; font-weight: 700 }
section.howtoSec .Cnt li .x-input.mrgNone {margin-bottom: 4px;padding-bottom: 5px;background-position: 3% 12px;}
section.howtoSec .Cnt li .x-input input ::placeholder {color: #231F20;}
section.howtoSec .Cnt li .join-ai-trial-img {position:absolute; top:-30px; margin-bottom:30px; z-index:10;}
section.howtoSec .Cnt li [ui="join-enable"] .btn {position:relative; top: 35px;}
@media screen and (max-width: 767px) {
section.howtoSec {width: 94%;margin: 0px auto 20px;}
section.howtoSec .Cnt {position: relative;}
section.howtoSec .Cnt h2 {height: 40px;margin-bottom: 20px;padding: 6px 0;font-size: 21px;}
section.howtoSec .Cnt ul{width: 100%;display: inline-block;margin-bottom: 0;}
section.howtoSec .Cnt li{width: 100%; margin-right: 0;padding: 8px;margin-bottom: 15px;}
section.howtoSec .Cnt li:last-child {margin-right: 0;margin-bottom: 0}
section.howtoSec .Cnt li .box {}
section.howtoSec .Cnt li .num {width: 48px; height: 48px; position: absolute;margin: auto;left: 8px;right: auto;top:16px;}
section.howtoSec .Cnt li .heading {height: 65px;box-sizing: border-box;padding: 10px 10px 10px 52px;}
section.howtoSec .Cnt li h3 {font-size: 18px;text-align: left;padding: 0 5px;}
section.howtoSec .Cnt li .mid {min-height: 80px;padding: 15px 15px;font-size: 14px;line-height: 120%;}
section.howtoSec .Cnt li:last-child .mid {min-height:auto;padding: 15px 15px 11px;}
section.howtoSec .Cnt li .bottom {height: auto;min-height: 72px; padding: 12px 15px;position: relative;}
section.howtoSec .Cnt li:last-child .bottom {background: #fff;height: auto;padding: 0;width: 96%;margin: 0 auto;}
section.howtoSec .Cnt li .btn {position: relative;display: block;width: 100%;height: 48px;}
section.howtoSec .Cnt li .btn.flL {float: left; width: 48%;}
section.howtoSec .Cnt li .btn.flR {float: right; width: 48%;}
section.howtoSec .Cnt li .btn.mb-12px {/*margin-bottom: 0!important*/}
section.howtoSec .Cnt li .btn.yellow:before {top: 4px; left: 4px; width: calc(100% - 14px); height: calc(100% - 14px); content: ''; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.howtoSec .Cnt li .btn.black:before {top: 4px; left: 4px; width: calc(100% - 14px); height: calc(100% - 14px); content: '';border: 2px dotted rgba(255,241,0,.50); border-radius: 12px;}
section.howtoSec .Cnt li .btn .tx {font-size: 18px;line-height: 48px;}
section.howtoSec .Cnt li .btn .tx.reg:before {width: 26px; height: 24px;vertical-align: -5px; margin-right: 6px;background-size: 26px auto;}
section.howtoSec .Cnt li .btn .tx.join:before {width: 26px; height: 24px;vertical-align: -5px; margin-right: 6px;background-size: 26px auto;}
section.howtoSec .Cnt li .btn .tx.twitter:before {width: 26px; height: 24px;vertical-align: -4px; margin-right: 6px;background-size: 26px auto;}
section.howtoSec .Cnt li .arrow {position: absolute; left: calc(50% - 18px); bottom: -24px; top:auto; right:0; height: 36px; width: 36px;}
section.howtoSec .Cnt li .x-input {background-position: 3% 50%;background-size: 40px auto; border-bottom: 1px solid #000;margin: 0 auto 15px; width: 100%;}
section.howtoSec .Cnt li .x-input input {font-size: 12px;}
section.howtoSec .Cnt li .bottom .logged { position: relative; margin: 0 auto; line-height: 17px; font-size: 14px; width: 100%; height: 17px}
section.howtoSec .Cnt li .bottom .joined {font-size: 14px; width: 100%; height: 17px; margin: 0 auto; line-height: 17px;}
section.howtoSec .Cnt li .x-input.mrgNone {background-position: 3% 50%;background-size: 40px auto; border-bottom: 1px solid #000;margin: 10px auto 10px; padding-bottom: 12px; width: 100%;}
section.howtoSec .Cnt li .accountName {text-align: center;display: flex;width: 100%;height: 55px;box-sizing: border-box; margin: 0 auto;border-radius: 16px; justify-content: center; align-items: center;}
section.howtoSec .Cnt li .join-ai-trial-img {position:absolute; top:-40px; margin-bottom:30px; z-index:10; width:60%; transform: translateX(35%);}
section.howtoSec .Cnt li [ui="join-enable"] .btn {position:relative; top: 0;}
}
/*====
socialSec
=====*/
section.socialSec {width: 1132px;margin: 0 auto 0px;background-image: url("../img/border-social.png"); background-repeat: repeat-x;background-size: 12px 2px;padding-top: 40px;}
section.socialSec .Cnt {position: relative;overflow: hidden;}
section.socialSec .Cnt .lefter {float: left;max-width: 748px;width: 66%}
section.socialSec .Cnt .righter {float: right;max-width: 364px;width: 32%}
section.socialSec .Cnt .bnrs {overflow: hidden;margin-bottom: 20px;width: 364px;float: left;}
section.socialSec .Cnt .bnrs.horizontal {width: 100%;}
section.socialSec .Cnt .bnrs li {width: 100%;float: left;box-sizing: border-box;border: 8px solid #FFFFFF;border-radius: 16px;text-align: center;height: 100px;position: relative;margin-bottom: 12px;}
section.socialSec .Cnt .bnrs.horizontal li {width: 32%;margin-right: 2%;}
section.socialSec .Cnt .bnrs.horizontal li:last-child {margin-right: 0}
section.socialSec .Cnt .bnrs li.bbp {background:#B0D137}
section.socialSec .Cnt .bnrs li.radiko {background:#0099DD}
section.socialSec .Cnt .bnrs li.tw {background:#0F1419}
section.socialSec .Cnt .bnrs li .bnr {display: block;vertical-align: middle;width: 100%;}
section.socialSec .Cnt .bnrs li img {width: 186px; height: 72px;position: absolute;margin: auto;top: 0;bottom: 0;left: 0;right: 0}
section.socialSec .Cnt .bnrs li:last-child {margin-bottom: 0;}
section.socialSec .Cnt .commentary {border-radius: 16px; background: #fff;box-sizing: border-box;padding: 16px 20px;position: relative;width: 748px;float: right;}
section.socialSec .Cnt .commentary .Cnt {}
section.socialSec .Cnt .commentary .Cnt h2 {position: relative;font-family: "Mochiy Pop P One", sans-serif;font-size: 28px;font-weight: 400; padding: 5px 0 0 50px;margin-bottom: 0px;}
section.socialSec .Cnt .commentary .Cnt h2:before {content: "";background: url("../img/icon-mic.svg") no-repeat;background-size:48px auto;width: 48px; height: 48px;position: absolute;left: 0;top: 0;}
section.socialSec .Cnt .commentary .Cnt table {width: 540px;margin: 16px auto 40px;}
section.socialSec .Cnt .commentary .Cnt .lSide {width: 100%;position: relative;margin: 0 auto 10px;}
section.socialSec .Cnt .commentary .Cnt .rSide {width: 100%;/* margin: 0 auto; */}
section.socialSec .Cnt .commentary .Cnt .lSide .playCancel,
section.socialSec .Cnt .commentary .Cnt .lSide .playCancel2
{position: absolute;left: 15%;top: 184px;margin: 0 auto;background: #D14931;width: 70%;height: 22px;line-height: 22px;color: #fff;text-align: center;}
section.socialSec .noBroadcastiong {min-height: 224px;}
section.socialSec .noBroadcastiong figure{width: 420px; height:130px;position: absolute;top: 0;left: 0;right: 0;bottom: 0; margin: auto;}
@media screen and (max-width: 767px) {
section.socialSec {width: 94%;margin: 0 auto 20px;background-image:none;padding-top: 0px;}
section.socialSec .Cnt {position: relative;overflow: hidden;}
section.socialSec .Cnt .lefter,
section.socialSec .Cnt .righter {width: 100%;}
section.socialSec .Cnt .bnrs {margin-bottom: 5px;width: 100%}
section.socialSec .Cnt .bnrs li {width: 100%;background: #B0D137;border: 4px solid #FFFFFF;height: 54px;}
section.socialSec .Cnt .bnrs li .bnr {}
section.socialSec .Cnt .bnrs li img {width: 100px; height: 41px;position: absolute;margin: auto;top: 0;bottom: 0;left: 0;right: 0}
section.socialSec .Cnt .bnrs li:last-child {background: #0099DD;float: right;}
section.socialSec .Cnt .commentary {width: 100%; padding: 15px;margin-bottom: 15px;}
section.socialSec .Cnt .commentary .Cnt {}
section.socialSec .Cnt .commentary .Cnt h2 {font-size: 21px;padding: 5px 0 0 40px;margin-bottom: 20px;}
section.socialSec .Cnt .commentary .Cnt h2:before {background-size:36px auto;width: 36px; height: 36px;}
section.socialSec .Cnt .commentary .Cnt table {width: 100%;margin: 0 auto;}
section.socialSec .Cnt .commentary .Cnt .lSide,
section.socialSec .Cnt .commentary .Cnt .rSide {float: none;width: 100%}
section.socialSec .Cnt .commentary .Cnt .lSide {min-height:auto;}
section.socialSec .Cnt .commentary .Cnt .lSide .playCancel,
section.socialSec .Cnt .commentary .Cnt .lSide .playCancel2{position: relative;left: 0;top: 8px;width: 100%;height: 17px;line-height: 17px;font-size: 14px;/* margin-bottom: 15px; */}
section.socialSec .noBroadcastiong {min-height: auto;}
section.socialSec .noBroadcastiong figure{width: 100%; height:auto;position: relative;}
}
section.socialSec .box {overflow: hidden;}
section.socialSec table {margin: 0 auto; width: 100%}
section.socialSec table td {vertical-align: middle;text-align: center;line-height: 1;}
section.socialSec table .time {background: #EBEBEB;font-weight: 700;font-size: 28px;height: 24px;}
section.socialSec table .teamName {font-weight: 700;font-size: 32px;line-height: 1;padding:20px 0 20px;width: 36%;}
section.socialSec table .nml {font-weight: 700;font-size: 16px;line-height: 100%;width: 28%}
section.socialSec table .teamLogo {}
section.socialSec table .teamLogo img {width: 40px; height: 40px;}
section.socialSec table .nml {font-weight: 700;font-size: 16px;}
section.socialSec table .nml.place {font-size: 14px;}
section.socialSec .personality {width: 100%;/* margin: 0 auto; */}
section.socialSec .personality ul {overflow: hidden;display: flex;justify-content: center;/* text-align: center; *//* margin: auto; *//* width: auto; */}
section.socialSec .personality li {position: relative;width: 25%;float: left;display: table;/* margin: 0 auto; */}
section.socialSec .personality li figure {display: table-cell;vertical-align: middle;border: 4px solid #EDE2CC;overflow: hidden;width: 70px;height: 70px;border-radius: 50%;margin-bottom: 6px;}
section.socialSec .personality li figure img {width: 100%;height: auto;}
section.socialSec .personality li .txt {display: table-cell;vertical-align: middle;width: 100px;box-sizing: border-box;padding-left: 4px;}
section.socialSec .personality li .label {background: #231F20; width: 48px; height: 25px; text-align: center; color: #fff; font-size: 14px; border-radius: 22px; box-sizing: border-box; padding: 4px 0;display: block;font-weight: 700;margin-bottom: 4px;}
section.socialSec .personality li .name {font-weight: 700;font-size: 16px;text-align: left;display: block;}
section.socialSec .twBlock {width: 100%; margin: 0 auto 20px;}
@media screen and (max-width: 767px) {
section.socialSec table {margin: 0 auto 10px;}
section.socialSec table .time {font-size: 28px;height: 24px;}
section.socialSec table .teamName {font-size: 20px;line-height: 1;padding:0px 0 8px;width: 40%;}
section.socialSec table .teamLogo img {width: 26px; height: 26px;}
section.socialSec table .nml {font-size: 11px;vertical-align: middle; padding-bottom: 3px;width: 20%}
section.socialSec .personality {width: 100%;}
section.socialSec .personality ul {display: table;width: 100%;}
section.socialSec .personality li {position: relative;width: 50%;display: table;float: left;margin-top: 8px;}
section.socialSec .personality li:last-child {/* float: right; */}
section.socialSec .personality li figure {vertical-align: middle;width: 72px;height: 72px; margin-bottom: 6px;float: none;display: table-cell}
section.socialSec .personality li .txt {width: calc(100% - 72px);padding-left: 8px}
section.socialSec .personality li .label {width: 42px; height: 21px; font-size: 11px;line-height: 21px; border-radius: 22px; padding: 0 0;margin-bottom: 2px;}
section.socialSec .personality li .name {text-align: left;font-size: 12px;}
section.socialSec .twBlock {display: none;}
}
/*====
predictSec
=====*/
section.predictSec {width: 1132px;margin: 0 auto;overflow: hidden;}
section.predictSec .Cnt {position: relative;}
section.predictSec .Cnt h2 {background: #337F99;height: 40px;border-radius: 20px;margin-bottom: 30px; text-align: center; box-sizing: border-box; padding: 1px 0;font-family: "Mochiy Pop P One", sans-serif;font-weight: 400;font-size: 28px;color: #fff;}
section.predictSec .Cnt ul {}
section.predictSec .Cnt ul li {float: left;width: 556px;border-radius: 16px;background: #fff;box-sizing: border-box;padding: 8px;margin-bottom: 15px;}
section.predictSec .Cnt ul li:nth-child(2n) {float: right;}
section.predictSec .Cnt ul li .heading {background: #EFEA3A4D;border-top-right-radius: 12px;border-top-left-radius: 12px;padding: 5px 0 8px;}
section.predictSec .Cnt ul li .heading table {width: 100%;margin-bottom: 5px;margin-top: 10px;}
section.predictSec .Cnt ul li .heading table td {vertical-align: middle;text-align: center;}
section.predictSec .Cnt ul li .heading table .teamName {font-weight: 700;font-size: 26px;line-height: 0;vertical-align: middle; width: 36%;}
section.predictSec .Cnt ul li .heading table .vs {font-weight: 900;font-size: 24px;width: 28%;font-family: "Yantramanav", sans-serif;height: 50px;top: 3px; position: relative;}
section.predictSec .Cnt ul li .heading table .vs .num {font-size: 72px; line-height: 0;position: relative; top: 10px;}
section.predictSec .Cnt ul li .heading table .vs .bar {padding: 0 20px 0px; position: relative; font-size: 36px;}
section.predictSec .Cnt ul li .heading table .teamLogo {vertical-align: middle;}
section.predictSec .Cnt ul li .heading table .teamLogo img {width: 37px; height: 37px;top: 4px; position: relative;}
section.predictSec .Cnt ul li .heading table .nml {font-weight: 500;font-size: 14px;line-height: 1;vertical-align: middle;}
section.predictSec .Cnt ul li .heading table .nml span {display: block;font-weight:700; position: relative;top: -4px;}
section.predictSec .Cnt ul li .heading .btns {margin: 0 auto;overflow: hidden;}
section.predictSec .Cnt ul li .heading .btns.one {width: 154px;}
section.predictSec .Cnt ul li .heading .btns.two {width: 290px;}
section.predictSec .Cnt ul li .heading .btns .btn-detail{width: 154px; height: auto;}
section.predictSec .Cnt ul li .heading .btns .btn-radiko{width: 116.75px; height: auto;float: right;}
section.predictSec .Cnt ul li .heading .btns.two .btn-detail {float: left;}
section.predictSec .Cnt ul li .heading .playCancel,
section.predictSec .Cnt ul li .heading .playCancel2
{background:#D14931;width: 94%;height: 22px;font-size: 18px;line-height: 22px; color: #fff;text-align: center;margin: 18px auto 10px;}
section.predictSec .Cnt .noPlay {text-align: center;color: #fff;font-weight: 900;font-size: 28px;margin: 50px auto;}
@media screen and (max-width: 767px) {
section.predictSec {width: 94%;}
section.predictSec .notify { font-size:13px;}
section.predictSec .Cnt h2 {height: 40px;margin-bottom: 20px;padding: 9px 0;font-size: 18px;}
section.predictSec .Cnt ul li {width: 100%;padding: 8px;margin-bottom: 15px; position:relative;}
section.predictSec .Cnt ul li .heading {padding: 8px 0}
section.predictSec .Cnt ul li .heading table {width: 100%;margin-bottom: 30px;margin-top: 5px;}
section.predictSec .Cnt ul li .heading table .teamName {font-size: 20px;width: 40%;height: 27px;}
section.predictSec .Cnt ul li .heading table .vs {font-size: 24px; width: 40%; height: 50px; top: 38px; position: absolute; left: 0; right: 0; margin: auto; display: table;}
section.predictSec .Cnt ul li .heading table .vs .num {font-size: 54px;line-height: 1; display: table-cell;top: 0; width: 50%; text-align: right; padding: 0 30px 0 0;box-sizing: border-box;}
section.predictSec .Cnt ul li .heading table .vs .num.right{text-align: left; padding: 0 0 0 30px;}
section.predictSec .Cnt ul li .heading table .vs .bar {opacity: 0; padding:0 20px; font-size: 1px;display: table-cell; display: none;}
section.predictSec .Cnt ul li .heading table .teamLogo img {width: 26px; height: 26px;top: 4px; position: relative;}
section.predictSec .Cnt ul li .heading table .nml {font-size: 12px;line-height: 2; position: absolute; top: 56px; left: 0; right: 0; margin: auto;}
section.predictSec .Cnt ul li .heading table .nml span {display: block;font-weight:700; position: relative;top: -4px;}
section.predictSec .Cnt ul li .heading .btns {margin: 0 auto;overflow: hidden;}
section.predictSec .Cnt ul li .heading .btns img {width: 100%;height: auto}
section.predictSec .Cnt ul li .heading .btns.one {width: 125px;}
section.predictSec .Cnt ul li .heading .btns.two {width: 230px;}
section.predictSec .Cnt ul li .heading .btns .btn-detail{width: 125px; height: auto;}
section.predictSec .Cnt ul li .heading .btns .btn-radiko{width: 92px; height: auto;float: right;}
section.predictSec .Cnt ul li .heading .btns.two .btn-detail {float: left;}
section.predictSec .Cnt ul li .heading .playCancel {height: 17px;font-size: 14px;line-height: 17px; color: #fff;text-align: center;margin: 40px auto 14px;}
section.predictSec .Cnt .noPlay {font-size: 20px;margin: 40px auto;}
}
section.predictSec .Cnt ul li .mid {padding: 6px 0 8px;}
section.predictSec .Cnt ul li .mid table {width: 500px; margin: 0 auto 5px;}
section.predictSec .Cnt ul li .mid table td {vertical-align: middle;text-align: center;}
section.predictSec .Cnt ul li .mid table td.percent {font-family: "Yantramanav", sans-serif;font-weight: 900;font-size: 12px;vertical-align:bottom;text-align: left;line-height: 1;}
section.predictSec .Cnt ul li .mid table td.percent.rSide,
section.predictSec .Cnt ul li .mid table td.num.rSide
{text-align: right;}
section.predictSec .Cnt ul li .mid table td.num {font-family: "Yantramanav", sans-serif;font-weight: 900;font-size: 24px;line-height: 100%;width: 38px;text-align: left;}
section.predictSec .Cnt ul li .mid table td.graph {width: 180px;height: 46px;}
section.predictSec .Cnt ul li .mid table td .barBG {width: 180px;height: 32px;background: #EBEBEB;position: relative;border-top-left-radius: 3px;border-bottom-left-radius: 3px;}
section.predictSec .Cnt ul li .mid table td .bar {position: absolute;right: 0;height: 32px;border-top-left-radius: 3px;border-bottom-left-radius: 3px;}
section.predictSec .Cnt ul li .mid table td.graph.rSide .barBG {border-radius: 0;border-top-right-radius: 3px;border-bottom-right-radius: 3px;}
section.predictSec .Cnt ul li .mid table td.graph.rSide .bar {left: 0;border-radius: 0;border-top-right-radius: 3px;border-bottom-right-radius: 3px;}
section.predictSec .Cnt ul li .mid table td.centerLogo {border-right: 2px solid #EBEBEB;border-left: 2px solid #EBEBEB;width: 68px;box-sizing: border-box;}
section.predictSec .Cnt ul li .mid table td.centerLogo img {width: 48px; height: auto;}
section.predictSec .Cnt ul li .mid table td .bar.bar-yakuklt {background: #4CAF50;}
section.predictSec .Cnt ul li .mid table td .bar.bar-carp {background: #F44336;}
section.predictSec .Cnt ul li .mid table td .bar.bar-dragons {background: #1976D2;}
section.predictSec .Cnt ul li .mid table td .bar.bar-dena {background: #004A8F;}
section.predictSec .Cnt ul li .mid table td .bar.bar-tigers {background: #FFDF00;}
section.predictSec .Cnt ul li .mid table td .bar.bar-giants {background: #FF6F00;}
section.predictSec .Cnt ul li .mid table td .bar.bar-ham {background: #0277bd;}
section.predictSec .Cnt ul li .mid table td .bar.bar-softbank {background: #ffd740;}
section.predictSec .Cnt ul li .mid table td .bar.bar-rakuten {background: #d32f2f;}
section.predictSec .Cnt ul li .mid table td .bar.bar-lions {background: #00214b;}
section.predictSec .Cnt ul li .mid table td .bar.bar-lotte {background: #000000;}
section.predictSec .Cnt ul li .mid table td .bar.bar-orix {background: #B7A436;}
@media screen and (max-width: 767px) {
section.predictSec .Cnt ul li .mid table {width: 100%; margin: 0 auto;}
section.predictSec .Cnt ul li .mid table td.percent {font-size: 10px;}
section.predictSec .Cnt ul li .mid table td.num {font-size: 18px;width: 8%;text-align: left;}
section.predictSec .Cnt ul li .mid table td.graph {width: 34%;height: 34px;}
section.predictSec .Cnt ul li .mid table td .barBG {width: 100%;height: 18px;}
section.predictSec .Cnt ul li .mid table td .bar {position: absolute;right: 0;height: 18px;}
section.predictSec .Cnt ul li .mid table td.centerLogo {border-right: 1px solid #EBEBEB;border-left: 1px solid #EBEBEB;width: 16%;padding: 4px 0 0 0;}
section.predictSec .Cnt ul li .mid table td.centerLogo img {width: 36px; height: auto;}
}
section.predictSec .Cnt ul li .bottom {height: 70px; padding: 1px 0;background: #EBEBEB;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px}
section.predictSec .Cnt ul li .bottom .btns {width: 96%;margin: 0 auto;}
section.predictSec .Cnt ul li .bottom .btns li{width: 50%;background: none;margin-bottom: 0;}
section.predictSec .Cnt ul li .bottom .btns li:last-child {float: right;}
section.predictSec .Cnt ul li .bottom .btns li.short {width:36%;}
section.predictSec .Cnt ul li .bottom .btns li.long {width: 64%;}
section.predictSec .Cnt ul li .bottom .btn {text-align: center;display: flex;width: 100%;height: 52px;box-sizing: border-box; margin: 0 auto;border-radius: 16px; justify-content: center; align-items: center; }
section.predictSec .Cnt ul li .bottom .btn.shadow {filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.2));}
section.predictSec .Cnt ul li .bottom .btn .tx {line-height: 1.2;font-size: 20px;padding-left: 5px;}
section.predictSec .Cnt ul li .bottom .btn.gray .tx {padding-left: 0px;}
section.predictSec .Cnt ul li .bottom .btn .icon {width: 33px;}
section.predictSec .Cnt ul li .bottom .btn.yellow {background: #FFF100;}
section.predictSec .Cnt ul li .bottom [vote_active="0"] .btn.yellow {cursor: pointer;}
section.predictSec .Cnt ul li .bottom .btn.gray {background: #EBEBEB;color: #C3C2C2;}
section.predictSec .Cnt ul li[allow_vote="1"] .bottom .btn.gray { cursor: pointer;}
section.predictSec .Cnt ul li .bottom .btn.black {background: #231f20;color: #fff; cursor: pointer;}
section.predictSec .Cnt ul li .bottom .btn.yellow .icon {background-image: url("../img/icon_check.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 33px; height: 31px;}
section.predictSec .Cnt ul li .bottom .btn.yellow.twitter .icon {background-image: url("../img/icon_move.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 33px; height: 31px;}
section.predictSec .Cnt ul li .bottom .btn.gray .icon { width: 0px; height: 0;}
section.predictSec .Cnt ul li .bottom .btn.black .icon {background-image: url("../img/icon_check2.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 33px; height: 31px;}
section.predictSec .Cnt ul li .bottom .btn.yellow:before {position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.predictSec .Cnt ul li .bottom .btn.gray:before {position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.predictSec .Cnt ul li .bottom .btn.black:before {position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted #4f4c4d; border-radius: 12px;}
section.predictSec .Cnt ul li .bottom a .btn {transition: .4s;}
section.predictSec .Cnt ul li .bottom a .btn:hover {transition: .4s; opacity: 0.7;}
@media screen and (max-width: 767px) {
section.predictSec .Cnt ul li .bottom {height: 68px;bpadding: 8px 0;}
section.predictSec .Cnt ul li .bottom .btns {width: 100%;margin: 0 auto;}
section.predictSec .Cnt ul li .bottom .btns li,
section.predictSec .Cnt ul li .bottom .btns li.short,
section.predictSec .Cnt ul li .bottom .btns li.long
{width: 50%;}
section.predictSec .Cnt ul li .bottom .btns li:last-child {float: right;}
section.predictSec .Cnt ul li .bottom .btn {text-align: center;display: flex;width: 100%;height: 52px;box-sizing: border-box; margin: 0 auto;border-radius: 16px; justify-content: center; align-items: center; }
section.predictSec .Cnt ul li .bottom .btn .tx {line-height: 1.2;font-size: 14px;padding-left: 5px;}
section.predictSec .Cnt ul li .bottom .btn.yellow .icon,
section.predictSec .Cnt ul li .bottom .btn.yellow.twitter .icon,
section.predictSec .Cnt ul li .bottom .btn.black .icon
{width: 26px; height: 24px;}
section.predictSec .Cnt ul li .bottom .btn.gray .icon { width: 0px; height: 0;}
section.predictSec .Cnt ul li .bottom .btn.gray:before {position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px;}
section.predictSec .Cnt ul li .bottom .btn.black:before {position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; -webkit-transition: all .3s; transition: all .3s; border: 2px dotted #4f4c4d; border-radius: 12px;}
section.predictSec .Cnt ul li .bottom .btn.yellow.join .tx {font-size:18px;}
section.predictSec .Cnt ul li .bottom .btn.yellow.twitter .tx {font-size:14px; line-height: 1.1;}
}
/*====
campBnrSec
=====*/
section.campBnrSec {width: 1132px;margin: 0 auto 20px;}
section.campBnrSec .Cnt {position: relative;}
@media screen and (max-width: 767px) {
section.campBnrSec {width: 94%;margin: 0 auto 20px;}
}
/*====
campBnrSec2
=====*/
section.campBnrSec2 {width: 1132px;margin: 0 auto 20px;}
section.campBnrSec2 .Cnt {position: relative;}
@media screen and (max-width: 767px) {
section.campBnrSec2 {width: 94%;margin: 0 auto 20px;}
}
/*====
rankingSec
=====*/
section.rankingSec {width: 1132px;margin: 0 auto;}
section.rankingSec .Cnt {position: relative;}
section.rankingSec h2 {width: 832px;margin: 0 auto 15px;}
section.rankingSec h2 img {width: 100%;height: auto;}
section.rankingSec .prof {width: 940px; height: 108px; border: 4px solid #FFF100;background: #231F20; box-sizing: border-box;padding: 10px;margin: 0 auto 15px;}
section.rankingSec h3 {font-weight: 900;font-size: 20px;line-height: 100%;color: #fff;text-align: center;margin-bottom: 5px;}
section.rankingSec .points {text-align: center;font-weight: 900;font-size: 20px;display: flex;width: 100%; justify-content: center; align-items: center;}
section.rankingSec .points .set{}
section.rankingSec .label {background: #fff;border-radius: 4px;color: #231F20;line-height: 1; margin-right: 12px;padding: 0px 8px;position: relative;top: -9px;}
section.rankingSec .point {color: #FFF100;font-family: "Yantramanav", sans-serif;font-size: 25px;margin-right: 12px;line-height: 1;}
section.rankingSec .point span {font-size:56px;padding-right: 4px;}
section.rankingSec .point.last {margin-right: 0}
@media screen and (max-width: 767px) {
section.rankingSec {width: 94%;margin: 0 auto 30px;}
section.rankingSec h2 {width: 100%;margin: 0 auto 15px;}
section.rankingSec .prof {width: 100%; height: auto; margin: 0 auto 15px;}
section.rankingSec h3 {font-size: 14px; margin-bottom: 10px;}
section.rankingSec .points {font-size: 15px;display: block;}
section.rankingSec .points .set{display: table; width: 80%;margin: 0 auto 5px;border-bottom: 1px solid rgba(255,255,255,.3)}
section.rankingSec .label {background: none; margin-right: 0;padding: 0px ;top:auto;display: table-cell;vertical-align: middle;text-align: left}
section.rankingSec .label .deco {background: #fff;border-radius: 4px;color: #231F20;padding: 5px 0;width: 60px;display: inline-block;text-align: center;}
section.rankingSec .point {font-size: 18px;margin-right: 0px;text-align: right;display: table-cell;}
section.rankingSec .point span {font-size:36px;padding-right: 2px;}
section.rankingSec .point.last {margin-right: 0}
}
section.rankingSec .seasons {background: #001C3A;width: 876px;height: 58px;margin: 0 auto 15px;box-sizing: border-box;padding: 8px;}
section.rankingSec .seasons ul {}
section.rankingSec .seasons li {width: 80px; height: 42px;text-align: center;border-radius: 12px;float: left;line-height: 42px;color: #fff;}
section.rankingSec .seasons li a {display: block;width: 100%}
section.rankingSec .seasons li.sum {width: 140px;}
section.rankingSec .seasons li.active {background: #FFF100;}
section.rankingSec .seasons li a {transition: .4s;color: #fff}
section.rankingSec .seasons li.active a {color:#231F20}
section.rankingSec .seasons li a:hover {transition: .4s; opacity: 0.7;}
section.rankingSec .seasons li a.disabled {opacity: 0.5; }
@media screen and (max-width: 767px) {
section.rankingSec .seasons {width: 100%;height: 58px;margin: 0 auto 15px;padding: 0; background: none;}
.selectbox {display: inline-flex; align-items: center; position: relative;width: 100%}
.selectbox::after {position: absolute; right: 15px; width: 10px; height: 7px; background-color: #fff; clip-path: polygon(0 0, 100% 0, 50% 100%); content: '';pointer-events: none;}
.selectbox select { appearance: none;width: 100%; height: 2.8em; padding: .4em calc(.8em + 30px) .4em .8em; border: 1px solid rgba(255,255,255,.3); border-radius: 6px; background-color: #001730; color: #ffffff; font-size: 1em; cursor: pointer;}
}
section.rankingSec .ranking {width: 1132px;margin: 0 auto;overflow: hidden;}
section.rankingSec .ranking .lefter {float: left;width: 565px;border-right: 1px solid #004E68}
section.rankingSec .ranking .righter {float: right;width: 565px;border-left: 1px solid #004E68}
section.rankingSec table {width: 100%;overflow: hidden;}
section.rankingSec table.head {border-top-left-radius: 8px;border-top-right-radius: 8px;}
section.rankingSec .lefter table {border-bottom-left-radius: 8px;}
section.rankingSec .righter table{border-bottom-right-radius: 8px}
section.rankingSec tr {background:#001730}
section.rankingSec tr:nth-child(2n) {background: #001c3b;}
section.rankingSec th {text-align: center;vertical-align: middle; font-weight: 900;font-size: 16px;background: #113154; color: #5C8D9E;height: 40px;}
section.rankingSec td {vertical-align: middle;color: #fff;font-size: 20px;padding: 0 15px;height: 64px;}
section.rankingSec th.rank {width: 96px;}
section.rankingSec th.name {width: 320px;}
section.rankingSec th.pt {width: 114px;}
section.rankingSec td.rank {text-align: center;font-family: "Yantramanav", sans-serif;font-size: 32px;}
section.rankingSec td.name {text-align: left;}
section.rankingSec td.pt {text-align: right;font-family: "Yantramanav", sans-serif;font-size: 32px;}
section.rankingSec td.name .abbr {text-overflow: ellipsis; overflow: hidden; white-space: nowrap;max-width:290px; }
@media screen and (max-width: 767px) {
section.rankingSec .ranking {width: 100%;}
section.rankingSec .ranking .lefter,
section.rankingSec .ranking .righter
{width: 100%;border:none;float: none;}
section.rankingSec th {font-size: 12px;}
section.rankingSec th.rank {width: 45px!important;}
section.rankingSec th.name {width: calc(100% - 145px);}
section.rankingSec th.pt {width: 100px!important;}
section.rankingSec td {height: 30px;box-sizing: border-box;padding: 0 10px;}
section.rankingSec td.rank {font-size: 22px;width: 45px!important;}
section.rankingSec td.name {font-size: 15px;width: calc(100% - 145px);}
section.rankingSec td.pt {font-size: 22px;width: 100px!important;}
}
section.contactSec {width: 100%;overflow: hidden;}
section.contactSec .btn.contact {width: 160px;height: 40px;line-height: 36px; text-align: center; position: relative;box-sizing: border-box; margin: 20px auto;border-radius: 8px;color:#fff;border:1px solid #fff;background: url("../img/icon-btnarrow.png") 94% 50% no-repeat;font-size: 16px;}
footer {width: 100%;text-align: center;font-size: 14px;color: #fff;padding: 25px 0;}
footer p {margin-bottom: 0;font-weight: 500}
@media screen and (max-width: 767px) {
footer {padding: 0px 20px 25px;font-size: 12px;box-sizing: border-box}
}
/* ========================================
entrySec - スペシャルゲーム回答フォーム
======================================== */
section.entrySec { display: none; width: 1132px; overflow: hidden; padding: 0; box-sizing: border-box; }
.entry-inner { max-width: 1132px; margin: 0 auto; background: #001C3A; border-radius: 16px; padding: 30px 40px 25px; position: relative; box-sizing: border-box; overflow: hidden; }
.entry-inner::before, .entry-inner::after { content: ''; position: absolute; left: 0; right: 0; height: 8px; background: url("../img/entry-border.png") repeat-x; background-size: auto 100%; }
.entry-inner::before { top: 0; }
.entry-inner::after { bottom: 0; }
/* ヘッダー: ロゴ + ボーナス + キャラクター */
.entry-header { display: flex; align-items: center; justify-content: center; gap: 20px; margin-bottom: 16px; }
.entry-logo { display: flex; align-items: center; gap: 8px; }
.entry-logo img { width: 100%; height: auto; }
.entry-char.pcView { position: absolute; right: -30px; top: -130px; }
.entry-char.pcView img { width: auto; }
/* 説明テキスト */
.entry-description { text-align: center; color: #fff; font-size: 15px; line-height: 1.8; margin-bottom: 20px; }
.entry-description p { margin: 0; }
.entry-description .entry-highlight { font-size: 22px; font-weight: 900; color: #FFF500; margin: 4px 0; }
/* フォーム */
.entry-form { position: relative; max-width: 1000px; margin: 0 auto 12px; background: #403F00; border: 3px solid #FFFD00; padding: 20px 100px; border-radius: 12px; }
.entry-form-inner { display: flex; align-items: center; gap: 0; overflow: hidden; height: 56px; }
.entry-form-label { background: #FAF9C4; color: #333; font-weight: 700; font-size: 16px; padding: 0 20px; height: 100%; display: flex; align-items: center; white-space: nowrap; border-right: 1px solid #ddd; border-radius: 5px; }
.entry-form-input { flex: 1; height: 100%; }
.entry-form-input input { width: 100%; height: 100%; border: none; outline: none; font-size: 16px; padding: 0 16px; box-sizing: border-box; background: #fff; margin: 0 10px; border-radius: 5px; }
.entry-form-submit { background: #FFF100; color: #231F20; border: none; cursor: pointer; height: 52px; padding: 0 24px; white-space: nowrap; display: flex; align-items: center; justify-content: center; border-radius: 16px; position: relative; filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.2)); transition: opacity 0.3s; margin-left: 20px; }
.entry-form-submit:hover { opacity: 0.7; }
.entry-form-submit::before { position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px; box-sizing: border-box; }
.entry-form-submit .icon { background-image: url("../img/icon_check.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 33px; height: 31px; }
.entry-form-submit .tx { font-size: 20px; font-weight: 700; line-height: 1.2; padding-left: 5px; }
/* エラーメッセージ */
.entry-form-error { background: #c0392b; color: #fff; text-align: center; font-size: 14px; padding: 8px; border-radius: 16px; margin: 8px auto 0; width: 70%; }
/* 注記 */
.entry-note { text-align: center; color: #ccc; font-size: 13px; margin-top: 12px; margin-bottom: 0; }
/* レスポンシブ */
@media screen and (max-width: 767px) {
section.entrySec { width: 94%; margin: 0 auto; }
.entry-inner { padding: 20px 16px 20px; }
.entry-header { flex-wrap: wrap; gap: 8px; padding-right: 0; }
.entry-char.spView { position: absolute; right: 0; top: -190px; bottom: auto; }
.entry-char.spView img { width: 92px; }
.entry-description { font-size: 13px; text-align: left; width: calc(95% - 92px); min-height: 190px; }
.entry-description .entry-highlight { font-size: 17px; }
.entry-form { padding: 16px; }
.entry-form-inner { flex-direction: column; height: auto; }
.entry-form-label { width: 100%; justify-content: center; border-right: none; border-bottom: 1px solid #ddd; box-sizing: border-box; }
.entry-form-input { width: 100%; height: 44px; }
.entry-form-input input { height: 44px; margin: 10px 0; }
.entry-form-submit { width: 100%; height: 48px; justify-content: center; border-radius: 12px; margin: 0; padding: 0; }
.entry-form-submit .tx { font-size: 16px; }
.entry-form-submit .icon { width: 26px; height: 24px; }
.entry-form-error { width: auto; }
.entry-note { font-size: 11px; }
}
/* ========================================
プレゼント応募フォーム
======================================== */
.applyForm { display:none; background: #fff; border-radius: 12px; padding: 12px 16px; margin: 0 auto; }
/* ポイント表示ヘッダー */
.applyForm-header { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 16px; background: #EDE2CC; border-radius: 12px; padding: 16px 0; }
.applyForm-header-label { background: #333; color: #fff; font-size: 13px; font-weight: 700; padding: 4px 14px; border-radius: 4px; }
.applyForm-header-value { font-family: 'Yantramanav', sans-serif; font-size: 42px; font-weight: 900; color: #cc0000; line-height: 1; }
.applyForm-header-unit { font-size: 24px; font-weight: 700; }
.applyForm-header-badge { background: #D14931; color: #fff; font-size: 14px; font-weight: 700; padding: 3px 10px; border-radius: 4px; }
/* 説明テキスト */
.applyForm-desc { text-align: center; font-size: 24px; font-weight: 700; margin-bottom: 16px; }
/* チェックボックスリスト */
section.presentSec .applyForm .applyForm-list { list-style: none; padding: 0; margin: 0 auto 20px; display: block; overflow: hidden; width: 790px; }
section.presentSec .applyForm .applyForm-list li { border-bottom: 1px solid #e0dbd3; float: none; width: 100%; padding: 0; border-radius: 0; position: static; box-sizing: border-box; margin: 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px dashed #ccc; }
section.presentSec .applyForm .applyForm-list li:first-child { border-top: 1px dashed #ccc; }
section.presentSec .applyForm .applyForm-list li:last-child { border-bottom: none; }
.applyForm-list label { display: flex; align-items: center; padding: 14px 0; cursor: pointer; font-size: 14px; font-weight: 500; flex: 1; min-width: 0; }
/* 口数カウンター */
.applyForm-qty { display: flex; align-items: center; gap: 0; flex-shrink: 0; margin-right: 16px; }
.applyForm-qty-btn { width: 32px; height: 32px; border: 1px solid #ccc; background: #fff; font-size: 16px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; color: #333; padding: 0; font-family: 'Noto Sans JP', sans-serif; }
.applyForm-qty-minus { border-radius: 4px 0 0 4px; }
.applyForm-qty-plus { border-radius: 0 4px 4px 0; }
.applyForm-qty-btn:hover { background: #f0f0f0; }
.applyForm-qty-value { width: 36px; height: 32px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; border-left: none; border-right: none; background: #fff; font-size: 16px; font-weight: 700; text-align: center; line-height: 30px; display: inline-block; box-sizing: border-box; }
.applyForm-qty-unit { width: 28px; height: 32px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; border-left: none; border-right: none; background: #fff; font-size: 12px; text-align: center; line-height: 30px; display: inline-block; color: #666; box-sizing: border-box; }
/* カスタムチェックボックス */
.applyForm-list input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 22px; height: 22px; border: 2px solid #ccc; border-radius: 4px; margin: 0; margin-right: 12px; flex-shrink: 0; cursor: pointer; position: relative; background: #fff; }
.applyForm-list input[type="checkbox"]:checked { background: #FFF100; border-color: #e6d900; }
.applyForm-list input[type="checkbox"]:checked::after { content: ''; position: absolute; left: 6px; top: 2px; width: 6px; height: 12px; border: solid #333; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
/* 応募ボタン */
.applyForm-submit { text-align: center; margin-bottom: 12px; }
.applyForm-submit-btn { background: #D14931; color: #FFF100; border: none; cursor: pointer; height: 52px; padding: 0 24px; white-space: nowrap; display: flex; align-items: center; justify-content: center; border-radius: 16px; position: relative; filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.2)); transition: opacity 0.3s; margin: auto; width:760px; }
.applyForm-submit-btn:hover { opacity: 0.7; }
.applyForm-submit-btn.disabled { opacity: 0.4; pointer-events: none; cursor: default; }
.applyForm-submit-btn::before { position: absolute; top: 4px; left: 4px; width: calc(100% - 8px); height: calc(100% - 8px); content: ''; border: 2px dotted #ECAC15; border-radius: 12px; box-sizing: border-box; }
.applyForm-submit-btn .icon { background-image: url("../img/icon_move.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 33px; height: 31px; }
.applyForm-submit-btn .tx { font-size: 20px; font-weight: 700; line-height: 1.2; padding-left: 5px; }
.applyForm-error { background: #D14931; color: #fff; text-align: center; font-size: 14px; padding: 8px; border-radius: 16px; margin: 8px auto 0; width: 70%; }
/* 同意チェックボックス */
.applyForm-term { width: 700px; margin: 0 auto 20px; }
.applyForm-term-check { display: flex; align-items: center; cursor: pointer; padding: 0 14px 16px; }
.applyForm-term-check input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 22px; height: 22px; min-width: 22px; border: 2px solid #ccc; border-radius: 4px; margin: 0; margin-right: 12px; flex-shrink: 0; cursor: pointer; position: relative; background: #fff; }
.applyForm-term-check input[type="checkbox"]:checked { background: #FFF100; border-color: #e6d900; }
.applyForm-term-check input[type="checkbox"]:checked::after { content: ''; position: absolute; left: 6px; top: 2px; width: 6px; height: 12px; border: solid #333; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.applyForm-term-check-text { font-size: 13px; font-weight: 500; line-height: 1.6; color: #333; text-align: left; }
.applyForm-term-note { font-size: 12px; color: #888; margin-top: 8px; padding-left: 16px; }
.applyForm-term-note a { color: #333; text-decoration: underline; }
.applyForm-term-note a:hover { opacity: 0.7; }
@media screen and (max-width: 767px) {
.applyForm-header { flex-wrap: wrap; justify-content: space-between; padding: 16px; }
.applyForm-header-value { flex-basis: 100%; text-align: right; font-size: 48px; }
.applyForm-header-badge { position: relative; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25); border-radius: 10px;}
.applyForm-header-badge::after { content: ''; position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%); border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #D14931; filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.2)); }
.applyForm-desc { text-align: left; font-size: 18px;}
section.presentSec .applyForm .applyForm-list { width: 100%; }
section.presentSec .applyForm .applyForm-list li { display: block; padding-bottom: 14px;}
.applyForm-qty { justify-content: flex-end; }
.applyForm-submit-btn { width: 100%; padding: 0; }
.applyForm-term-check {padding: 0;}
.applyForm-term-note {padding: 0; text-align:left;}
.applyForm-term { width: 100%; }
}
/* ============================================
menuSec - セクションナビゲーション
============================================ */
.menuSec { background: #1a1a1a; padding: 10px 0; width: 1132px; margin: 15px auto; border-radius: 8px; }
.menuSec ul { display: flex; justify-content: space-around; align-items: center; gap: 8px; padding: 0 16px; box-sizing: border-box; }
.menuSec li { display: flex; align-items: center; justify-content: center; gap: 6px; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; padding: 8px 16px; white-space: nowrap; transition: opacity 0.2s; flex: 1; text-align: center; }
.menuSec li:hover { opacity: 0.7; }
.menuSec li[data-active] { background: #ffe600; color: #1a1a1a; border-radius: 8px; padding: 8px 20px; }
.menuSec li[data-active]:hover { opacity: 0.8; }
.menuSec-icon { width: 22px; height: 20px; flex-shrink: 0; }
@media screen and (max-width: 767px) {
.menuSec { width: 94%; border-radius: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none; }
#hero-joined > .menuSec { width:97%; }
.menuSec::-webkit-scrollbar { display: none; }
.menuSec ul { gap: 4px; padding: 0 12px; flex-wrap: nowrap; justify-content: space-around; align-items: stretch; }
.menuSec li { font-size: 11px; padding: 6px 0; gap: 2px; flex-direction: column; align-items: center; flex: 1; justify-content: flex-start; text-align: center; white-space: normal; min-width: 0; }
.menuSec li[data-active] { padding: 6px 12px; }
.menuSec-icon { order: 1; margin-top: auto; }
.menuSec-icon { width: 16px; height: 15px; }
}
/* ============================================
applyConfirmModal - 応募確認ポップアップ
============================================ */
.applyConfirmModal { width: 640px; border-radius: 16px; padding: 24px 20px; border: 8px solid #fff; box-sizing: border-box; background: #fff; margin: auto; }
.applyConfirmModal-inner { position: relative; z-index: 12; }
.applyConfirmModal-desc { font-size: 14px; font-weight: 500; text-align: center; line-height: 1.8; margin-bottom: 16px; color: #333; }
.applyConfirmModal-list { list-style: none; padding: 0; margin: 0 0 16px; }
.applyConfirmModal-list li { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #d5d0c6; font-size: 14px; font-weight: 500; color: #333; }
.applyConfirmModal-list li:last-child { border-bottom: none; }
.applyConfirmModal-list .name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.applyConfirmModal-list .qty { flex-shrink: 0; margin-left: 16px; white-space: nowrap; }
.applyConfirmModal-list .qty .num { font-size:150%; }
.applyConfirmModal-point { background: #EDE2CC; border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; text-align: center; }
.applyConfirmModal-point-header { display: flex; align-items: center; justify-content: center; gap: 12px; }
.applyConfirmModal-point-header .label { font-size: 14px; font-weight: 700; background: #333; color: #fff; padding: 4px 14px; border-radius: 4px; }
.applyConfirmModal-point-header .value { font-family: 'Yantramanav', sans-serif; font-size: 42px; font-weight: 900; color: #D14931; line-height: 1; }
.applyConfirmModal-point-header .unit { font-size: 22px; font-weight: 700; }
.applyConfirmModal-point-detail { font-size: 13px; color: #555; margin-top: 4px; }
.applyConfirmModal-point-detail span { padding: 0 8px; }
.applyConfirmModal-point-detail span.current { border-right: 1px solid #ccc; }
.applyConfirmModal-point-detail strong { font-family: 'Yantramanav', sans-serif; font-size: 16px; font-weight: 700; }
.applyConfirmModal-point-detail small { font-size: 11px; }
.applyConfirmModal-submit { display: flex; align-items: center; justify-content: center; width: 100%; height: 52px; box-sizing: border-box; border-radius: 16px; background: #D14931; color: #FFF100; cursor: pointer; position: relative; margin: 0 auto 12px; filter: drop-shadow(0px 4px 15px rgba(0, 0, 0, 0.2)); }
.applyConfirmModal-submit::before { position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; border: 2px dotted rgba(0, 0, 0, .10); border-radius: 12px; }
.applyConfirmModal-submit .icon { background-image: url("../img/icon_check.svg"); background-repeat: no-repeat; background-size: 100% auto; width: 28px; height: 26px; }
.applyConfirmModal-submit .tx { font-size: 18px; font-weight: 700; line-height: 1.2; padding-left: 5px; }
.applyConfirmModal-submit:hover { opacity: 0.7; transition: opacity 0.3s; }
.applyConfirmModal-submit.disabled { opacity: 0.4; pointer-events: none; cursor: default; }
.applyConfirmModal-cancel { display: block; position: relative; text-align: center; font-size: 16px; font-weight: 700; color: #fff; background: #231F20; border: 2px solid #ccc; border-radius: 16px; padding: 12px 0; text-decoration: none; cursor: pointer; width: 200px; margin: auto; }
.applyConfirmModal-cancel::before { position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; border: 2px dotted rgba(255, 255, 255, .3); border-radius: 12px; }
.applyConfirmModal-cancel:hover { opacity: 0.7; transition: opacity 0.3s; }
@media screen and (max-width: 767px) {
.applyConfirmModal { width: 94%; padding: 16px; }
.applyConfirmModal-desc { font-size: 13px; text-align: left; }
.applyConfirmModal-list li { padding: 10px 12px; font-size: 13px; }
.applyConfirmModal-point-header .value { font-size: 36px; }
.applyConfirmModal-submit .tx { font-size: 16px; }
}
/* ============================================
applyDoneModal - 応募完了ポップアップ
============================================ */
.applyDoneModal { width: 640px; border-radius: 16px; padding: 24px 20px; border: 8px solid #fff; box-sizing: border-box; background: #fff; margin: auto; }
.applyDoneModal-inner { position: relative; z-index: 12; }
.applyDoneModal-title { font-size: 22px; font-weight: 900; text-align: center; color: #333; margin: 0 0 8px; }
.applyDoneModal-subtitle { font-size: 14px; font-weight: 500; text-align: center; color: #333; margin: 0 0 16px; }
.applyDoneModal-label { font-size: 14px; font-weight: 700; text-align: center; color: #333; padding: 5px 0; border: 1px solid #d5d0c6; }
.applyDoneModal-list { list-style: none; padding: 0; margin: 0; }
.applyDoneModal-list li { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #d5d0c6; font-size: 14px; font-weight: 500; color: #333; }
.applyDoneModal-list li:last-child { border-bottom: none; }
.applyDoneModal-list .name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.applyDoneModal-list .qty { flex-shrink: 0; margin-left: 16px; white-space: nowrap; }
.applyDoneModal-list .qty .num { font-size:150%; }
.applyDoneModal-info { display: flex; justify-content: space-between; align-items: center; font-size: 12px; color: #666; padding: 8px 16px; border-top: 1px solid #d5d0c6; margin-bottom: 12px; }
.applyDoneModal-info-item { display: flex; align-items: baseline; gap: 4px; }
.applyDoneModal-info-label { font-size: 12px; }
.applyDoneModal-info-value strong { font-family: 'Yantramanav', sans-serif; font-size: 24px; font-weight: 700; }
.applyDoneModal-info-value small { font-size: 11px; }
.applyDoneModal-point { background: #EDE2CC; border-radius: 12px; padding: 12px 16px; margin-bottom: 16px; text-align: center; display: flex; align-items: center; justify-content: center; gap: 12px; }
.applyDoneModal-point .label { font-size: 14px; font-weight: 700; background: #333; color: #fff; padding: 4px; border-radius: 4px; }
.applyDoneModal-point .value { font-family: 'Yantramanav', sans-serif; font-size: 42px; font-weight: 900; color: #D14931; line-height: 1; }
.applyDoneModal-point .unit { font-size: 22px; font-weight: 700; }
.applyDoneModal-close { display: block; position: relative; text-align: center; font-size: 16px; font-weight: 700; color: #fff; background: #231F20; border: 2px solid #ccc; border-radius: 16px; padding: 12px 0; text-decoration: none; cursor: pointer; width: 200px; margin: auto; }
.applyDoneModal-close::before { position: absolute; top: 4px; left: 4px; width: calc(100% - 12px); height: calc(100% - 12px); content: ''; border: 2px dotted rgba(255, 255, 255, .3); border-radius: 12px; }
.applyDoneModal-close:hover { opacity: 0.7; transition: opacity 0.3s; }
.applyDoneModal button.mfp-close { display: none; }
@media screen and (max-width: 767px) {
.applyDoneModal { width: 94%; padding: 16px; }
.applyDoneModal-title { font-size: 18px; }
.applyDoneModal-subtitle { font-size: 13px; }
.applyDoneModal-list li { padding: 10px 12px; font-size: 13px; }
.applyDoneModal-info { flex-direction: row; gap: 0; }
.applyDoneModal-info-item { flex: 1; flex-direction: column; align-items: flex-start; gap: 2px; }
.applyDoneModal-info-item:last-child { align-items: flex-end; text-align: right; }
.applyDoneModal-info-label { font-size: 14px; font-weight: 700; color: #333; }
.applyDoneModal-info-value { font-size: 14px; color: #333; }
.applyDoneModal-info-value strong { font-size: 32px; font-weight: 900; color: #333; }
.applyDoneModal-info-value small { font-size: 14px; }
.applyDoneModal-point .value { font-size: 36px; }
}
/* ============================================
entryModal - 回答受付ポップアップ
============================================ */
.entryModal { max-width: 480px; border-radius: 16px; padding: 24px 32px; border: 2px solid #d5d0c6; box-sizing: border-box; background: #fff; margin: auto; }
.entryModal .mfp-close { display: none; }
.entryModal-text { font-size: 18px; font-weight: 700; text-align: center; color: #333; margin: 0; }
@media screen and (max-width: 767px) {
.entryModal { max-width: 94%; padding: 20px 16px; }
.entryModal-text { font-size: 16px; }
}