@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
}

body {
 background-color: #e8fff1;
	color:#454545;
	text-align: center;
	font: 13px/1em -apple-system, BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    font-family: YakuHanJP, 'Noto Sans JP', sans-serif;
	word-break: break-all;
    word-wrap: break-word;
	background: url(../img/st.jpg) #e8fff1 repeat;
	background-size: 50px;
}

h1, h2, h3, h4, h5, h6, p {
	margin: 0;
	padding: 0;
}

img { 
	border: 0; 
}

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.title-picture {
	display: block;
}

a:link {
	color: #E95899;;
	text-decoration: none;
}
a:hover, a:active, a:focus {
	color: #EB3752;
	text-decoration: underline;
}
a:visited {
	color: #E95899;;
	text-decoration: none;
}

.sp,
.br-sp {
	display: none;
}

/* layout */

#wrapper{
	width:1024px;
	margin:0 auto;
	background: #fffddd;
}

.cont-wrap{
	width:1024px;
	/* background:#ffeff6; */
	margin:0 auto;
	position:relative;
	/* padding: 0 0 80px 0; */
}

.t2 {
    width: 160px;
}

@media screen and (max-width: 960px) {
	
.t2 {
    width: 320px;
}
	
}

@media screen and (max-width: 960px) {
body {
	/* background: #fffed2; */
}

#wrapper,.cont-wrap{
	width:100%;
	margin:0 auto;
	/* background:#fffed2; */
}	
	
.pc{
		display: none;
	}	
	
.sp,
.br-sp {
	display: block;
}	
	
}


.top-area {
	margin:0 auto;
	position:relative;
	text-align:center;
	padding-top:8px;
}

.top-area .title{
	margin-bottom:15px;
}

.title{
	width: 720px;
	margin: 0 auto 20px;
}

.top-area p{
	width: 96%;
	font-size:15px;
	letter-spacing: 2px;
	color:#111111;
	line-height:2em;
	margin:10px auto 30px;
}
	
#quiz{
	width: 430px;
  margin: 0 auto;
}


.top-area2 {
	margin:0 auto;
	position:relative;
	text-align:center;
	padding-top:8px;
}

.top-area2 p{
	font-size:14px;
	color:#111111;
	line-height:1.3em;
	margin:10px auto 20px;
}
	

#cb{
	clear:both;
}

.cont{
	margin:0 auto 25px;
	position:relative;
}

#cont1{
	width:780px;
	text-align:left;
	padding-top:40px;
	margin-top:20px;
}

.prize-ttl {
	margin: 0 auto 10px;
	width: 440px;
}

.prize-ttl img {
	display: block;
	width: 100%;
	height: auto;
}

#cont1 #r-box{
	background:#FFFFFF;
	border:solid 2px #f68cc1;
	border-radius:10px;
	/* padding:60px 0 10px; */
	text-align:left;
	positon:relative;
	text-align:center;
}



#cont1 #r-box #t1{
	position: absolute;
	left: -16px;
	top: 10px;
	width: 450px;
}

#cont1 #r-box ul{
	max-width:780px;
	height:auto;
	margin:0 auto 0;
	border-bottom:solid 2px #f68cc1;
	display: flex;
	background: #eefff5;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#cont1 #r-box ul li{
	list-style-type:none;
	/*float:left;*/
	/*margin-right:20px;*/
	/*width:150px;
	height:200px;*/
	width: 33.3%;
	margin: 15px auto;
}

#cont1 #r-box ul li img {
	max-width:200px;
}

img.pcimg{
	display:block;
}

img.spimg{
	display:none;
}

@media screen and (max-width: 960px) {

	#cont1 #r-box{
		padding: 0 0 20px 0 ;
	}

	.title{
		width: 98%;
		margin: 0 auto 50px;
	}
	
.top-area {
    margin: 0 auto;
	}

	.top-area p{
		font-size: 14px;
		line-height: 1.8;
		letter-spacing: 1px;
	}	
	
#quiz {
	width:85%;
	margin: 0 auto;
}
	
	#cont1{
		width: 90%;
		margin: 0 auto;
	}	
	
#cont1 #r-box #t1 {
    position: absolute;
    left: -16px;
    top: -30px;
    width: 95%;
}	

#cont1 #r-box ul{
	max-width:700px;
	height:auto;
	margin:0 auto 0;
	border-bottom:none;
	padding:20px 0 0 0;
}

#cont1 #r-box ul li{
	list-style-type:none;
	/* float:left; */
	margin:1em 0 0 15%;
	width:70%;
	height:auto;
}

#cont1 #r-box ul li.l1{
	width:75%;
	margin: 0 auto 10px;
	padding-bottom: 12px;
	border-bottom: solid 1px rgba(246, 140, 193, 0.5);
}

#cont1 #r-box ul:last-of-type li.l1:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

#cont1 #r-box ul li img{
	width:100%;
	max-width: 650px;
}

img.pcimg{
	display:none;
}

img.spimg{
	display:block;
}

#cont1 #r-box p{
	background:#FFFFFF;
	/*font-size: 12px;*/
	padding:70px 0;
	text-align: justify!important;
	border-top: solid 2px #e50113;
}


	#red{
	/* font-size: 18px;	 */
	}	

	.prize-ttl {
		width: 95%;
		margin: 0 auto 10px;
	}

}

/*個人情報の取扱いについて*/

#cont1 #p-box{
	background:#FFFFFF;
	border:solid 5px #E50012;
	border-radius:20px;
	padding:35px 0 10px;
	text-align:left;
	positon:relative;
	text-align:center;
}

#cont1 #p-box #caution{
	margin:0 20px 0 30px;
	text-align:left;
}

#cont1 #p-box #t3{
	position: absolute;
	left: -5px;
	top: 18px;
}

#cont1 #p-box h3{
	font-size:1.0em;
	margin-bottom:0.5em;
	background:#FFFFFF;
}

.ptxt{
	font-size:0.9em;
	margin-bottom:1.2em;
	background:#FFFFFF;
}

#next{
	margin:1em auto 3em;
	text-align:center;
}
/**/


#cont1 #r-box p{
	font-size: 13px;
	font-weight:bold;
	padding:0 ;
	margin:30px auto!important;
	width:700px;
	padding:5px 0;
	/*border-top:solid 2px #e50113;
	/* border-bottom:solid 2px #e50113; */
}

#cont1 #r-box p span{
	margin-top:10px;
	display:block;
	padding: 0 0 7px;
}

#cont1 #r-box p #num{
	margin-top:-40px;
	margin-bottom:5px;
}

#cont1 #r-box p #c1_txt3{
	margin:0 0 30px 15px;
}

#cont1 #c-box{
	margin-left:125px;
	margin-top:15px;
	text-align:left;
	positon:relative;	
}

#cont1 #c-box p{
	font-size:0.9em;
	text-align:1.5em;
	margin:0 0 0.3em;
	color:#E50012;
	font-weight:bold;
}

#cont1 #c-box img{
	margin:2px 0 8px;
}

#cont1 #c-box #bg_ringo{
	position:absolute;
	right:0px;
	bottom:0px;
}

#cont2 #cont2_top1{
	position:absolute;
	left:-30px;
	top:50px;
}

#cont2 #cont2_top2{
	position:absolute;
	right:-28px;
	top:5px;
}

#cont2 h3{
	margin:-25px auto 5px;
}

#copy{
	font-size:10px;
	line-height:1.5em;
	color:#006600;
	margin:50px auto 0;
	padding-bottom:30px;
}

#bg_pb{
	background-color:#D0EEFB;
}

#bg_db{
	background-color:#6FCBF2;
}

#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
}

#page-top a {
	text-decoration: none;
	width: 93px;
	height: 93px;
	background-image:url(../img/back.png);
	background-repeat:no-repeat;
	background-position:center top;
	display: block;
	background-size: 100%;
}
#page-top a:hover {
	opacity: .8;
	/* text-decoration: none;
	background-image:url(../img/b_top2.png); */
}

#oubo{
	height:220px;
	padding-top:50px;
	background:url(../img/top_chara2.png) no-repeat top center;
	margin: 0 0 30px;
	background-size: 700px;
	/* display: none; */
}

 #oubo a {
	pointer-events: none;
} 

#oubo a:hover{
	opacity: .8;
}

.oubo-txt {
	display: block;
	color: #02b3c5;
	font-weight: bold;
	font-size: 16px;
	line-height: 1.7;
	padding: 20px 0 30px;
}

.note-ttl {
	display: block;
	color: #e50111;
	font-weight: bold;
	font-size: 16px;
	padding: 0 0 5px;
}

#anpan,#runda,#pantan {
	display:none;
}


.btm{
	width: 90%;
	max-width:620px;
	text-align:left;
	margin:20px auto;
	line-height:1.6em;
	color:#000;
}

#btn{
	width:215px;
	height:172px;
	display:block;
	background:url(img/b_oubo2.png) no-repeat;
	margin:0 auto;
}


.oubo-link {
    display: block;
    width: 220px;
    margin: 0 auto;
}

.logo-link {
    width: 210px;
    /* margin: 30px 0 50px; */
}

.cc {
    width: 90%;
				padding: 10px 0;
    margin: 0 auto;
    font-size: xx-small;
    font-weight: bold;
    line-height: 1.5;
	  text-align: center;
}

.hotel1 {
	margin-left: 1.2em!important;
	margin-top: 0 !important;
	padding: 0 !important;
}

.prize-note {
	display: block!important;
 text-align: justify;
	margin: 30px 30px 60px 30px;
	font-weight: bold;
 line-height: 1.5;
	
}

.indent{
	padding-left: 1em;
	text-indent: -1em;
}

.prize-note-list {
	margin: 10px 0;
}

@media screen and (max-width: 960px) {

	.prize-note {
		width: 88%;
		margin: 0 auto;
		font-size: x-small;
		/* padding: 30px 0; */
		border-top: solid 1px #e50113;
	}
	.indent{
	/* padding-left: 2em; */
	/* text-indent: -2.7em; */
	}

	.top-area .title{
		/* margin-bottom:45px; */
	}
	
	#oubo{
		height: auto;
		padding: 30px 0 0;
		background: none;
		position: relative;
	}
	
#fuwa{
	display:block;
	position:absolute;
	right:110px;
	bottom:0;
	width:20%;
}

#anpan{
	display: block;
	position: absolute;
	left: 40px;
	bottom: 0;
	width: 17%;
}

#cont1 #r-box p span{
	margin:15px 0 8px;
}

#pantan{
display: block;
 position: absolute;
	right: 35px;
	bottom: 0;
	width: 22%;
}

	
#btn{
	width:90%;
	height:auto;
	display:block;
	background:none;
	margin:20px auto;
}

#btn img{
	width:40%;
}

	.oubo-link {
		display: block;
		width: min(38vw, 180px);
		min-width: 130px;
		margin: 0 auto;
	}

	.oubo-link img {
		display: block;
		width: 100%;
		height: auto;
	}

#b_form{
		width:70%;
	}

	.note-ttl {
		font-size: 14px;
		margin: 0 0 5px;
	}
	
	.btm p{
	font-size: 12px;
 font-weight: bold;
 line-height: 1.5;
	text-align: justify;
	}
	
#cont1 #p-box h3{
	font-size:0.7em;
	margin-bottom:0.5em;
	background:#FFFFFF;
}

.ptxt{
	font-size:0.8em;
	margin-bottom:1.2em;
	background:#FFFFFF;
}
	
	#cont1 #r-box ul{
		display: block;
		margin: 0 auto;
	}	
	
#cont1 #r-box ul li img {
    /*max-width: 490px;*/
}
	
.cc {
    width: 90%;
    margin: 0 auto;
    font-size: xx-small;
    font-weight: bold;
    line-height: 1.5;
	  text-align: center;
}
	
.logo-link {
    width: 50%;
}	
	
#page-top a {
 width: 75px;
 height: 75px;
	background-size: 100%;
}

#red{
	/* font-size: 15px; */
	line-height: 1.5;
	padding: 0 0 10px;
}	

.hotel1 {
	margin-left: 2.2em!important;
}

.hotel2 {
	margin-left: 2.2em!important;
margin-top: 0 !important;
padding: 0 !important;
}

}

/* letters */


.txt-l{
	font-size:1.2em;
}

.txt-s{
	font-size:10px;
}

.px12{
	/*font-size:12px;*/
}

.px14{
	font-size:14px;
}


#red{
	color:#E50012;
	padding: 0 0 10px;
    /* font-size: 18px; */
}

.red-txt{
	color: #E50012;
	padding: 0 0 5px 0;
	display: block;
}

#pin{
	color:#F04C9E;
}

#blu-1{
	color:#1B95C9;
}

#grn{
	color:#28B196;
}

#ora{
	color:#f04c9e;
}

/*Clearfix*/

.clearfix:after{
    content: "."; 
    display: block; 
    height: 0; 
    font-size:0;    
    clear: both; 
    visibility:hidden;
}
.clearfix{
    display: inline-block;
} 
/* Hides from IE Mac */
* html .clearfix{
    height: 1%;
}
.clearfix{
    display:block;
}
/* End Hack */

/* cp */

.cp {
	background: #fff;
	padding: 30px 20px;
	margin: 0 auto 30px;
	background-color: #e7fdff;
	background-image: repeating-linear-gradient(-45deg, #fff, #fff 7px, transparent 0, transparent 24px);
	font-family: "M PLUS Rounded 1c", sans-serif, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
}

.cp-ttl {
	font-weight: bold;
	font-size: 28px;
	text-align: center;
	margin: 0 0 20px;
	padding: 0 0 20px;
	color: #f750b6;
	border-bottom: dotted 2px #f750b6;
	text-shadow: 5px 5px 5px #fff, -5px -5px 5px #fff, -5px 5px 5px #fff, 5px -5px 5px #fff, 5px 0 5px #fff, -5px 0 5px #fff, 0 5px 5px #fff, 0 -5px 5px #fff;
}

.cp-ttl span {
	font-size: 15px;
	display: block;
	margin: 0 0 10px;
	line-height: 1.5;
}

.cp-lead {
	font-size: 14px;
	text-align: justify;
	line-height: 1.7;
	padding: 10px 0 20px;
	font-weight: bold;
}

.cp-txt-box {
	background: #fff;
	padding: 25px;
	border-radius: 10px;
	border: 4px solid #ffd7ea;
	/* width: 100%; */
 margin: 0 auto;
}

.cp-txt {
	text-align: justify;
	line-height: 1.5;
}

.cp-txt span {
	font-weight: bold;
	display: inline-block;
	padding: 0 0 5px;
}

.first {
	margin: 0 0 20px;
}

.cp-note {
	line-height: 1.5;
	text-align: justify;
	font-size: x-small;
	padding: 30px 0 0;
}


@media screen and (min-width: 960px) {

	.cp {
		width: 70%;
		max-width: 600px;
		padding: 40px;
		border-radius: 10px;
	}

	/* .cp-note {
		text-align: center;
	} */

	.cp-txt-box {
		width: 80%;
		margin: 0 auto;
		padding: 25px 0;
	}

.cp-lead,
	.cp-txt {
		text-align: center;
		line-height: 1.7;
}

}

.share-btn {
	display: block;
	width: 100%;
	margin: 0 auto;
	max-width: 300px;
	text-decoration: none;
	text-align: center;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
	margin: 0 auto;
	font-size: 16px;
	letter-spacing: 2px;
	margin:  20px auto 30px;
	cursor: pointer;
	font-weight: bold;
	border-radius: 50px;

}

.share-btn a {
	padding: 1em 0;
	color: #fff;
	text-decoration: none;
	display: block;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	background: #f77ec8;
	border: 1px solid  #f77ec8;
	border-radius: 50px;
}

.share-btn a:hover {
	color: #f77ec8;
	background: #fff;
}
