@charset "utf-8";

@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//use.fontawesome.com/releases/v5.0.6/css/all.css);
@import url('https://fonts.googleapis.com/css2?family=Source+Serif+Pro:wght@400;600&display=swap');

/*
	font-family:"FontAwesome";
	font-family:"Font Awesome 5 Free";
*/


/*========================================
 Base
========================================*/
html {font-size:62.5%;}
body {font-size:1.2rem;}

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    background:url(../images/bg.jpg) center top repeat-x fixed;
	margin-bottom:0;
	font-size:1.3rem;
	color:#15141e;
    line-height:1.5;
}
.ColorRed {color:#c498b1;}
.ColorBrown {color:#b21f7e;}
li {list-style:none;}
#ContentWrap a {color:#232a63;}


/* PC */
@media screen and (min-width: 1001px) {

.spOnly {display:none;}

#ContentWrap{
    background:#cdcff7;
    width:1080px;
    margin:0 auto;
	font-size:1.4rem;
    color:#232a63;
}

header{
    display:block;
    width:1080px;
    margin:0 auto 60px;
    text-align:center;
}
header h1 {padding:0 0 20px;}


/* nav */
nav ul{
    display:flex;
    flex-wrap:wrap;
    width:100%;
    margin:0 auto 40px;
}
nav li{
    width:calc(100% / 4 - 20px);
    font-family:"Source Serif Pro", serif;
    margin:0 10px;
    font-size:3.4rem;
    text-align:center;
}
nav li a{
    display:block;
    padding:8px 0;
    color:#232a63;
    border:2px solid #232a63;
    text-decoration:none;
    line-height:1;
    transition:0.4s;
}
nav li a:hover{
    background:#232a63;
    color:#fff !important;
}


/* section */
section .Title{
    position:relative;
    font-family:"Source Serif Pro", serif;
    background:linear-gradient(#fff 0%, #fff 50%, #eee 50%, #eee 100%);
    width:1040px;
    margin:0 auto 20px;
    padding:8px 0 4px;
    font-size:4.6rem;
    color:#232a63;
    text-align:center;
    line-height:1;
    border-radius:5px;
    box-shadow:inset 1px 1px 0 rgba(0,0,0,1);
}
section .SubTitle{
    background:#c498b1;
    width:1040px;
    margin:0 auto 20px;
    padding:8px 0;
    font-size:2.4rem;
    color:#fff;
    text-align:center;
}


/* 結果発表 */
#result {margin-top:60px;}
#resultTit{
	background:#70da57;
	width:96%;
	margin:0 auto 18px;
	padding:2px 1em 0;
	font-size:2.6rem;
	color:#fff;
	text-align:center;
	border:1px solid #232a63;
	box-sizing:border-box;
}
.ranking{
	display:block !important;
	background:#232a63;
	margin-right:1em;
	padding:4px 1em;
	color:#fff;
	line-height:1;
}
.resultWrap{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    width:1056px;
    margin:0 auto;
}
.resultWrap:last-of-type {border-bottom:1px dotted #fff;}

.resultBox, .resultBox2, .resultBox3{
	background:#fff;
    width:calc(80% / 2 - 60px);
	margin:0 10px 20px;
	padding:0 10px 20px;
    color:#004496;
	box-sizing:border-box;
}
.resultBox2{
    width:580px;
	margin:0 auto 20px;
    padding:0 100px 20px 100px;
}
.resultBox3{
    width:600px;
	margin:0 auto 20px;
}
.resultBox h3, .resultBox2 h3, .resultBox3 h3{
	width:100%;
    padding:20px 0 10px;
    font-size:1.8rem;
    text-align:center;
	box-sizing:border-box;
}
.resultBox .sceneBox li, .resultBox2 .sceneBox li, .resultBox3 .sceneBox li {background:#fff;}


/* campaign */
.detailBox{
	width:1000px;
	margin:0 auto 30px;
	font-size:1.4rem;
}
#camCatch{
	margin:50px 0;
	font-size:2.6rem;
	text-align:center;
	line-height:1.3;
}
#camCatch p{
    padding-top:8px;
    font-size:3rem;
}
#camCatch span{
    color:#b21f7e;
    font-weight:bold;
}
#camTit{
	margin-bottom:16px;
	font-size:3rem;
	font-weight:bold;
	color:#32343d;
	text-align:center;
	line-height:1.2;
	border-bottom:3px solid #32343d;
}
.detailBox p, .detailBox div, .detailBox dl{
	width:980px;
	margin:0 auto 1em;
}
#Campaign .attention{
	width:980px;
	margin:0 auto 1px;
}
#Campaign .attention li {margin-bottom:4px;}
.detailBox dl{
	overflow:hidden;
	line-height:1;
}
.detailBox dt{
	float:left;
	clear:left;
	margin-bottom:6px;
	padding:6px 1em;
	color:#232a63;
    line-height:1;
    border:1px solid #232a63;
}
.detailBox dd{
	float:left;
	margin:0 0 6px 1em;
	padding:6px 0;
    line-height:1;
}
.detailBox dl + p {text-align:center;}


/* 投票 */
.votingTitle{
    background:#232a63;
    width:980px;
    margin:0 auto 22px;
    padding:6px;
    font-size:2rem;
    color:#fff;
    box-sizing:border-box;
}
.votingWrap{
    display:flex;
    flex-wrap:wrap;
	width:980px;
	margin:0 auto 30px;
}
.votingBox{
    width:calc(980px / 3 - 20px);
    margin:0 10px 60px;
}
.SceneTit{
    width:100%;
    margin-bottom:4px;
    padding:2px 0;
    font-size:1.7rem;
    color:#232a63;
    text-align:center;
    border:1px solid #232a63;
    box-sizing:border-box;
}
.SceneTit span {color:#b21f7e;}
.votingWrap .SceneImg{
	overflow:hidden;
	width:100%;
    margin-bottom:10px;
	padding:0;
	border:1px solid #232a63;
    box-sizing:border-box;
}
.SceneImg img{
    width:100%;
    vertical-align:bottom;
}
.voteBox form {text-align:center;}
.voteBox input{
	display:inline-block;
    background-color:#60659d;
	width:100%;
	margin:0 0 10px;
	padding:8px 0;
	font-size:1.6rem;
	font-weight:bold;
	color:#fff;
	text-align:center;
	text-decoration:none;
	line-height:1;
	border:2px solid #60659d;
	cursor:pointer;
	transition:0.4s;
}
.voteBox input:hover{
	background:#9e6e7f;
	outline:none;
	border:2px solid #fff;
}
.voteBox .ThemeTxt{
	width:100%;
	margin:0;
	padding:4px 8px;
	text-align:left;
	box-sizing:border-box;
}


/* event */
.eventBox{
	background:rgba(255, 255, 255, 0.4);
	width:1000px;
	margin:0 auto 40px;
	padding:20px;
}
.eventTit{
	background:#c498b1;
	margin:0 0 14px;
	padding:8px 1em 6px;
	font-size:1.9rem;
	font-weight:bold;
    color:#fff;
	line-height:1.2;
}
.eventBox dl{
	overflow:hidden;
	margin-bottom:0;
}
.eventBox dt{
	float:left;
	clear:left;
	background:#fff;
	width:6em;
	margin:0 1em 10px 0;
	padding:3px 0;
	color:#232a63;
	text-align:center;
    border:1px solid #232a63;
    box-sizing:border-box;
}
.eventBox dd{
	float:left;
	margin:0 0 10px 0;
	padding:3px 0;
}
.eventBox dd a {text-decoration:underline;}
.eventBox dd ul{
	margin:0;
	padding:0;
}
.eventBox dt:last-of-type, .eventBox dd:last-of-type {margin-bottom:0;}


/* item */
.itemWrap{
	overflow:hidden;
	width:1040px;
	margin:0 auto 40px;
}
.itemBox{
	float:left;
	width:calc(100% / 5 - 16px);
	margin:0 20px 20px 0;
	padding:10px;
	font-size:1.2rem;
	border:1px solid #232a63;
	box-sizing:border-box;
}
.itemBox:nth-of-type(5n) {margin-right:0;}
.itemImg, .itemTit, .itemPrice, .itemSale{
	margin-bottom:6px;
	line-height:1.4;
}
.itemImg{
	text-align:center;
	height:188px;
}
.itemImg img{
	max-width:100%;
	max-height:90%;
	margin-top:50%;
	transform:translateY(-50%);
}
a .itemPrice, a .itemSale {text-decoration:none;}


/* 特典情報 */
.tokutenWrap{
	width:1040px;
	margin:0 auto 40px;
}
.tokutenBox{
	background:rgba(255, 255, 255, 0.4);
	overflow:hidden;
	margin-bottom:30px;
	padding:20px;
}
.tokutenBox .tokutenName{
	margin:0 0 10px;
	padding:0;
	font-size:2.6rem;
	font-weight:bold;
	color:#b21f7e;
}
.tokutenImg{
	float:left;
	width:230px;
	margin-right:20px;
}
.tokutenImg img {max-width:100%;}
.tokutenDetail{
	float:left;
	width:750px;
}
.tokutenDetail ul{
	margin:0 0 16px;
	padding:0;
	font-size:1.3rem;
}
.tokutenDetail li {margin-bottom:4px;}


/* 特典注意文 */
.tokutenBoxAttention{
	width:1040px;
	margin:20px auto;
	padding:1em;
	border:1px solid #b21f7e;
	box-sizing:border-box;
}
.tokutenBoxAttention p {padding:0 12px;}
.tbaTit{
	display:inline-block;
	margin-bottom:3px;
	padding:0 6px;
	font-size:1.4rem;
	color:#b21f7e;
	border:1px solid #b21f7e;
}
.tbaTit::before{
	font-family:FontAwesome;
	content:"\f06a";
	margin-right:4px;
	font-size:1.6rem;
	color:#b21f7e;
}
.tokutenBoxAttention .AttLink{
	margin:12px 0 0;
	font-size:1.4rem;
}
.tokutenBoxAttention .AttLink a {color:#b21f7e;}
.tokutenBoxAttention .AttLink::before{
	font-family:FontAwesome;
	content:"\f061";
	margin-right:4px;
	font-size:1.6rem;
	color:#b21f7e;
}
.tokutenBoxAttention .AttLink a:hover{
	color:#444;
	text-decoration:none;
}


/* footer */
footer .copyright{
	margin:50px 0 0;
    padding-bottom:50px;
	font-size:1.4rem;
	text-align:center;
}
#footerGroup #totop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:0;
    z-index:800;
    display:none;
    cursor:pointer;
}
#footerGroup #totop a {display:block;}
#footerGroup #totop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}

}

/* スマホ */
@media screen and (max-width: 1000px) {

body{
    background:none;
	padding-bottom:0;
}

.pcOnly {display:none;}

main {
	width:100%;
	margin:0 auto;
	font-size:1.3rem;
	line-height:1.5;
	box-sizing:border-box;
}
p{
	margin-block-start:0;
	margin-block-end:0;
}
dd {margin-inline-start:0;}
ul{
	margin-block-start:0;
	margin-block-end:0;
	padding-inline-start:0;
}


/* header */
#ContentWrap{
    background:#cdcff7;
    margin:0;
	font-size:1.4rem;
}

header{
	position:relative;
	width:100%;
	margin:0;
}
header h1 img {width:100%;}


/* nav */
nav ul{
    display:flex;
    flex-wrap:wrap;
    width:100%;
    margin:8px auto 0;
}
nav li{
    font-family:"Source Serif Pro", serif;
    width:calc(100% / 2 - 20px);
    margin:0 10px 12px;
    font-size:1.5rem;
    text-align:center;
}
nav li a{
    display:block;
    padding:6px 0 4px;
    line-height:1;
    border:2px solid #232a63;
    text-decoration:none;
}


/* section */
section .Title{
    position:relative;
    font-family:"Source Serif Pro", serif;
    background:linear-gradient(#fff 0%, #fff 50%, #eee 50%, #eee 100%);
    width:94%;
    margin:0 auto 10px;
    padding:8px 0 4px;
    font-size:2.4rem;
    color:#232a63;
    text-align:center;
    line-height:1;
    border-radius:5px;
    box-shadow:inset 1px 1px 0 rgba(0,0,0,1);
}
section .SubTitle{
    background:#c498b1;
    width:94%;
    margin:0 auto 20px;
    padding:5px 0;
    color:#fff;
    text-align:center;
}


/* 結果発表 */
#resultTit{
	background:#70da57;
	width:94%;
	margin:0 auto 8px;
	padding:2px 1em 0;
	font-size:1.6rem;
	color:#fff;
	text-align:center;
	border:1px solid #232a63;
	box-sizing:border-box;
}
.ranking{
	display:block;
	background:#232a63;
	margin-bottom:0.4em;
	padding:4px;
	color:#fff;
	line-height:1;
}
.resultWrap{
    width:94%;
    margin:0 auto;
}
.resultWrap:last-of-type {border-bottom:1px dotted #fff;}

.resultBox, .resultBox2, .resultBox3{
	background:#fff;
    width:100%;
	margin-bottom:12px;
	padding:10px;
    color:#004496;
	box-sizing:border-box;
}
.resultBox h3, .resultBox2 h3, .resultBox3 h3{
    width:100%;
    text-align:center;
}


/* campaign */
.detailBox{
	width:94%;
	margin:0 auto 30px;
	font-size:1.3rem;
}
#camCatch{
	margin:20px auto;
	font-size:1.6rem;
    text-align:center;
	line-height:1.3;
}
#camCatch p{
    width:100%;
    margin:0;
    padding:8px 0 0;
	font-size:1.6rem;
    text-align:left;
    line-height:1.5;
}
#camCatch span{
    color:#b21f7e;
    font-weight:bold;
}
#camTit{
	margin-bottom:16px;
	font-size:1.5rem;
	font-weight:bold;
	color:#32343d;
	text-align:center;
	line-height:1.2;
	border-bottom:3px solid #32343d;
}
.detailBox p, .detailBox div, .detailBox dl{
	width:96%;
	margin:0 auto 1em;
}
#Campaign .attention{
	width:96%;
	margin:0 auto 1px;
}
#Campaign .attention li{
    margin:0 0 4px 1em;
    text-indent:-1em;
    line-height:1.4;
}
.detailBox dl{
	overflow:hidden;
	line-height:1.5;
}
.detailBox dt{
	padding:6px 1em 2px;
	color:#232a63;
    line-height:1;
    text-align:center;
    border:1px solid #232a63;
}
.detailBox dd{
	margin:0 0 14px;
	padding:4px 0;
}
.detailBox dl + p {text-align:center;}


/* 投票 */
.votingTitle{
    background:#232a63;
    width:100%;
    margin:0 0 14px;
    padding:6px;
    font-size:1.8rem;
    color:#fff;
    text-align:center;
    box-sizing:border-box;
}
.votingWrap{
	width:100%;
	margin:0 0 30px;
}
.votingBox{
    width:90%;
    margin:0 auto 20px;
}
.SceneTit{
    margin-bottom:6px;
    padding:2px 0;
    font-size:1.7rem;
    color:#232a63;
    text-align:center;
    border:1px solid #232a63;
}
.SceneTit span {color:#b21f7e;}
.votingWrap .SceneImg{
	overflow:hidden;
	width:100%;
    margin-bottom:10px;
	padding:0;
	border:1px solid #232a63;
    box-sizing:border-box;
}
.SceneImg img{
    width:100%;
    vertical-align:bottom;
}
.voteBox {margin-bottom:30px;}
.voteBox form {text-align:center;}
.voteBox input{
	display:inline-block;
    background-color:#60659d;
	width:100%;
	margin:0 0 10px;
	padding:8px 0;
	font-size:1.5rem;
	font-weight:bold;
	color:#fff;
	text-align:center;
	text-decoration:none;
	line-height:1;
	border:2px solid #60659d;
	cursor:pointer;
	transition:0.4s;
}
.voteBox .ThemeTxt{
	width:100%;
	margin:0;
	padding:4px 8px;
	text-align:left;
	box-sizing:border-box;
}


/* event */
.eventBox{
	background:rgba(255, 255, 255, 0.4);
	width:94%;
	margin:0 auto 40px;
	padding:10px;
    box-sizing:border-box;
}
.eventTit{
	background:#c498b1;
	margin:0 0 14px;
	padding:8px 1em 6px;
	font-size:1.4rem;
	font-weight:bold;
    color:#fff;
	line-height:1.2;
}
.eventBox dl{
	overflow:hidden;
	margin-bottom:0;
}
.eventBox dt{
	background:#fff;
	width:100%;
	margin:0 0 4px;
	padding:6px 0 3px;
	color:#232a63;
	text-align:center;
    border:1px solid #232a63;
    box-sizing:border-box;
}
.eventBox dd{
	margin:0 0 10px;
	padding:3px 0;
}
.eventBox dd a {text-decoration:underline;}
.eventBox dd ul{
	margin:0;
	padding:0;
}
.eventBox dd li {margin-bottom:8px;}
.eventBox dt:last-of-type, .eventBox dd:last-of-type {margin-bottom:0;}


/* item */
.itemWrap{
	overflow:hidden;
	width:96%;
	margin:0 auto 40px;
}
.itemBox{
	float:left;
	width:calc(100% / 2 - 12px);
	margin:0 6px 20px;
	padding:10px;
	font-size:1.2rem;
	border:1px solid #232a63;
	box-sizing:border-box;
}
.itemBox:nth-of-type(2n) {margin-right:0;}
.itemImg, .itemTit, .itemPrice, .itemSale{
	margin-bottom:6px;
	line-height:1.4;
}
.itemImg{
	text-align:center;
	height:140px;
}
.itemImg img{
	max-width:100%;
	max-height:90%;
	margin-top:50%;
	transform:translateY(-50%);
}
a .itemPrice, a .itemSale {text-decoration:none;}


/* 特典情報 */
.tokutenWrap{
	width:92%;
	margin:0 auto 40px;
}
.tokutenBox{
	background:rgba(255, 255, 255, 0.4);
	overflow:hidden;
	margin-bottom:30px;
	padding:10px;
}
.tokutenBox .tokutenName{
	background:#b21f7e;
	margin:0 0 10px;
	padding:4px 8px 2px;
	font-size:1.4rem;
	font-weight:bold;
	color:#fff;
    line-height:1.2;
	box-sizing:border-box;
}
.tokutenImg{
	width:230px;
	margin:0 auto 8px;
}
.tokutenImg img {max-width:100%;}
.tokutenDetail ul{
	margin:0 0 16px;
	padding:0;
	font-size:1.2rem;
}
.tokutenDetail li{
	margin-bottom:10px;
	line-height:1.3;
}
.tokutenDetail li::before {content:"・";}


/* 特典注意文 */
.tokutenBoxAttention{
	width:100%;
	margin:0 auto;
	padding:1rem;
	font-size:1.1rem;
	border:1px solid #b21f7e;
	box-sizing:border-box;
}
/*.tokutenBoxAttention p {padding:0 12px !important;}*/
.tbaTit{
	display:inline-block;
	margin-bottom:3px;
	padding:0 6px !important;
	font-size:1.3rem;
	color:#b21f7e;
	border:1px solid #b21f7e;
}
.tbaTit::before{
	font-family:FontAwesome;
	content:"\f06a";
	margin-right:4px;
	font-size:1.6rem;
	color:#b21f7e;
}
.tokutenBoxAttention .AttLink{
	margin:12px 0 0;
	font-size:1.3rem;
}
.tokutenBoxAttention .AttLink a {color:#c498b1;}
.tokutenBoxAttention .AttLink:before{
	font-family:FontAwesome;
	content:"\f061";
	margin-right:4px;
	color:#b21f7e;
}
.tokutenBoxAttention .AttLink a:active{
	color:#444;
	text-decoration:none;
}


/* footer */
footer .copyright{
	padding:0 0 30px;
	font-size:1.2rem;
	text-align:center;
}
#footerGroup #totop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:0;
    z-index:800;
    display:none;
    cursor:pointer;
}
#footerGroup #totop a {display:block;}
#footerGroup #totop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}


}