@charset "utf-8";
/* CSS Document */
/* デフォルトをスマホ、MediaqueryでPC対応 */

*{ box-sizing:border-box;}

.pc{display:none;}
.smt{display:block;}

@media (min-width: 900px) {
.pc{display:block;}
.smt{display:none;}
}

a .btn,
.btn a,
#footer .pt01 a{
	box-shadow:inset 0 -30px 30px rgba(0,0,0,0);
	transition:all ease-in 0.3s;
	-webkit-transition:all ease-in 0.3s;
	-moz-transition:all ease-in 0.3s;
}
a:hover .btn,
.btn:hover a,
#footer .pt01 a:hover{box-shadow:inset 0 -30px 30px rgba(0,0,0,0.15);}

/* ------------------------------ 
 ヘッダー 
 ------------------------------ */
#header{
	background:#39221C;
}
#header ul{
	overflow:hidden;
	width:257px;
	margin:auto;
}
#header li{
	float:left;
	display:inline;
}
#header li img{
	margin:10px 0;
	height:28px;
	width:auto;
}

/* ------------------------------ 
 コンテンツ全体 
 ------------------------------ */
#contents {
	text-align:center;
	min-width:320px;
	color:#3d221c;
	overflow:hidden;
}
#contents img{
	width:100%;
	height:auto;
	max-width:640px;
}
#contents span.color-1{
	color:#fe6859;
}
#contents span.color-2{
	color:#55acee;
}
#contents p.btn{
	background-color:#55acee;
	color:#fff;
	border-radius:5px;
}
#contents p.btn a{
	color:#fff;
}

/* コンテンツ全体(フォントサイズ) */
#contents{
	font-size:14px;
}
#contents .vt_by .pt02 li{
	font-size:13px;
}
#contents .vt_howto .pt04,
#footer .pt01 a{
	font-size:15px;
}
#contents .vt_howto .pt03 .btn{
	font-size:16px;
}
#contents .vt_main .p01,
#contents .vt_present .pt03 .p03,
#contents .vt_howto h4,
{
	font-size:18px;
}
@media (min-width: 414px) {
#contents{
	font-size:15px;
}
#contents .vt_howto .pt04,
#footer .pt01 a{
	font-size:16px;
}
#contents .vt_main .p01,
#contents .vt_present .pt03 .p03,
#contents .vt_howto h4,
#contents .vt_howto .pt03 .btn{
	font-size:20px;
}
}
@media (min-width: 640px) {
#contents,
#contents .vt_by .pt02 li{
	font-size:16px;
}
#contents .vt_howto .pt04,
#footer .pt01 a{
	font-size:21px;
}
#contents .vt_howto .pt03 .btn{
	font-size:24px;
}
#contents .vt_main .p01,
#contents .vt_present .pt03 .p03,
#contents .vt_howto h4{
	font-size:24px;
}

}


/* ------------------------------ 
 メイン画像 
 ------------------------------ */
#contents .vt_main .pt02{
	padding:1.6em 0 0.8em;
	overflow:hidden;
}
#contents .vt_main .p01{
	font-weight:bold;
}
#contents .vt_main .p03{
	font-weight:bold;
	margin-bottom:1.6em;
	line-height:1.5;
}
#contents .vt_main .p02{
	margin-bottom:1.4em;
}
#contents .vt_main .p02 strong{
	margin:0 3px;
}
@media (min-width: 640px) {
#contents .vt_main .pt01{margin-top:40px;}
}
@media (min-width: 900px) {
#contents .vt_main .pt01{margin-top:80px;}
}


/* ------------------------------ 
 プレゼント紹介 
 ------------------------------ */
#contents .vt_present{
	background:#f2eee9;
}
#contents .vt_present .pt02{
	padding:1em 0 1.8em;
}
#contents .vt_present .pt02 .p01{
	margin-bottom:1em;
}
#contents .vt_present .pt03 .p01{
	width:63%;
	max-width:406px;
	position:relative;
	margin:auto;
}
#contents .vt_present .pt03 .p01 span{
	position:absolute;
	color:#fff;
	background-color:#fe6859;
	top:0;
	left:0;
	text-align:center;
	width:31%;
	height:20%;
	padding-top:2%;
	padding-top:calc(5% - 10px);
	font-weight:bold;
	font-size:20px;
}
#contents .vt_present .pt03 li:last-child .p01 span{
	min-width:74px;
}
#contents .vt_present .pt03 .p01 span:after{
	content:"名様";
	margin-left:3px;
	font-size:14px;
}
@media (min-width: 640px) {
#contents .vt_present .pt03 .p01 span{/* プレゼント人数 */
	font-size:32px;
	padding-top:1.4%;
}
#contents .vt_present .pt03 .p01 span:after{/* 名様 */
	font-size:20px;
}
}

#contents .vt_present .pt03 ul{
	overflow:hidden;
}
#contents .vt_present .pt03 li{
	margin-bottom:1.8em;
}
#contents .vt_present .pt03 .p02{
	margin-top:0.4em;
}
#contents .vt_present .pt03 .p03{
	font-weight:bold;
	margin-top:0.3em;
}
#contents .vt_present .pt03 .p04{
	margin-top:5px;
}
#contents .vt_present .pt03 .p04 small{
	color:#aaa3a2;
	font-size:13px;
}
@media (min-width: 900px) {/* プレゼント横並び */
#contents .vt_present .pt03 ul{
	width:880px;
	margin:0 auto;
} 
#contents .vt_present .pt03 li{
	float:left;
	width:406px;
	margin:0 10px 40px;
}
#contents .vt_present .pt03 .p01{
	width:406px;
}
#contents .vt_present .pt03 .p02{
	height:2.6em;
	padding-top:0.8em;
	vertical-align:middle;
	display:inline-block;
}
#contents .vt_present .pt03 li:first-child .p02{
	padding-top:0;
}
}

/* 斜め切替 */
#contents .vt_present:after{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 0px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 40px solid #FFFFFF;
    border-left: 640px solid transparent;
}
@media (min-width: 640px) {
#contents .vt_present:after{
    border-bottom: 80px solid #FFFFFF;
    border-left: 1200px solid transparent;
}
}
@media (min-width: 1200px) {
#contents .vt_present:after{
    border-bottom: 120px solid #FFFFFF;
    border-left: 2400px solid transparent;
}
}
@media (min-width: 2200px) {
#contents .vt_present:after{
	border:none;
	height:40px;
	background-color:#F2EEE9;
}
}
/* // プレゼント紹介 */


/* ------------------------------ 
 応募方法 
 ------------------------------ */
#contents .vt_howto .pt01{
	padding-top:2em;
}
#contents .vt_howto .pt02,
#contents .vt_howto .pt03,
#contents .vt_howto .pt04{
	margin-bottom:2em;
}
@media (min-width: 640px) {
#contents .vt_howto .pt02,
#contents .vt_howto .pt03,
#contents .vt_howto .pt04{
	margin-bottom:4em;
}
}

/* 1.まずはフォロー */
#contents .vt_howto .pt02 h4{
    background: url(../images/txt_005.png) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    padding-left: 2.2em;
}

#contents .vt_howto .pt02 ul{
	overflow:hidden;
	max-width:500px;
	margin:0 auto;
}
#contents .vt_howto .pt02 li{
	width:41.5%;
	float:left;
	margin:1.6em 0 1.6em 7% ;
	background:#f0f0f2;
	overflow:hidden;
}
#contents .vt_howto .pt02 li a{
	padding:0.8em;
}
#contents .vt_howto .pt02 li .p02{
	line-height:2;
	color:#3d221c;
}
#contents .vt_howto .pt02 li .btn{
	height:2em;
	line-height:2em;
	letter-spacing:-1px;
    max-width: 140px;
    margin: auto;
	padding:0 3%;
}
#contents .vt_howto .pt02 li i{
	margin-right:0.4em;
}
#contents .vt_howto .pt02 li:first-child{
	margin-left:5%;
}
@media (min-width: 414px) {
#contents .vt_howto .pt02 li .btn{
	letter-spacing:0;
	font-size:15px;
	padding:0 5%;
}
}
@media (min-width: 640px) {
#contents .vt_howto .pt02 li{
	width:37%;
	margin-left:12%;
}
#contents .vt_howto .pt02 li:first-child{
	margin-left:7%;
}
#contents .vt_howto .pt02 li .btn{
	letter-spacing:0;
	font-size:18px;
    max-width: 160px;
}
}
@media (min-width: 900px) {
#contents .vt_howto .pt02 ul{
	max-width:600px;
}
}
/* 2.ツイート */
#contents .vt_howto .pt03 h4{
    background: url(../images/txt_006.png) no-repeat left bottom;
    background-size: contain;
    display: inline-block;
    padding-left: 1.6em;
}
#contents .vt_howto .pt03 .btn{
	margin:1.6em auto;
	max-width:300px;
	width:65%;
	min-width:210px;
	height:44px;
	line-height:44px;
}
#contents .vt_howto .pt03 .btn a{
	padding:0 5%;
}
#contents .vt_howto .pt03 .btn i{
	font-size:120%;
	margin-right:0.5em;
	vertical-align:text-top;
}
@media (min-width: 640px) {
#contents .vt_howto .pt03 .btn{
	max-width:420px;
	margin:1.6em auto;
	height:52px;
	line-height:52px;
	letter-spacing:1px;
}
}

/* アカウント新規登録 */
#contents .vt_howto .pt04 a{
	background-color:#F0F0F2;
	max-width:350px;
	width:80%;
	border-radius:10px;
	margin:0 auto 2em;
	padding:1em;
	display:block;
}
#contents .vt_howto .pt04 .p01 i{
	font-size:130%;
}
#contents .vt_howto .pt04 a{
	color:#3d221c;
}
#contents .vt_howto .pt04 .btn{
	width:60%;
	min-width:180px;
	height:44px;
	line-height:44px;
	margin:auto;
}
#contents .vt_howto .pt04 .btn i{
	font-size:120%;
	margin-right:0.5em;
	display:none;
}
@media (min-width: 414px) {
#contents .vt_howto .pt04 .btn{
	width:70%;
}
#contents .vt_howto .pt04 .btn i{
	display:inline-block;
}
}
@media (min-width: 640px) {
#contents .vt_howto .pt04 a{
	padding:1.5em 1em;
}
#contents .vt_howto .pt04 .btn{
	width:300px;
}
}

/* 連絡方法 */
#contents .vt_howto .pt05 h4{
	width:79.69%;
	max-width:510px;
	margin:0 auto;
}

#contents .vt_howto .pt05 .p01{
	text-align:left;
	width:70%;
	max-width:450px;
	margin:1.6em auto 2.4em;
	line-height:1.7;
	word-break: break-word;
}
@media (min-width: 400px) and (max-width: 640px) {
#contents .vt_howto .pt05 .p01{
	width:75%;
}}
@media (min-width: 640px) {
#contents .vt_howto .pt05 .p01{
	text-align:center;
}
}

/* 斜め切替 */
#contents .vt_howto:after{
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 0px solid transparent;
    border-right: 640px solid transparent;
    border-bottom: 40px solid #F2EEE9;
    border-left: 0px solid transparent;
}
@media (min-width: 640px) {
#contents .vt_howto:after{
    border-bottom: 80px solid #F2EEE9;
    border-right: 1200px solid transparent;
}
}
@media (min-width: 1200px) {
#contents .vt_howto:after{
    border-bottom: 120px solid #F2EEE9;
    border-right: 2400px solid transparent;
}
}
@media (min-width: 2200px) {
#contents .vt_howto:after{
	border:none;
	height:40px;
	background-color:#F2EEE9;
}
}
/* // 応募方法 */



/* ------------------------------ 
 主催 
 ------------------------------ */
#contents .vt_by{
	background:#f2eee9;
}
#contents .vt_by .pt02 ul{
	overflow:hidden;
	max-width:600px;
	margin:0.6em auto 1.3em;
}
#contents .vt_by .pt02 li{
	width:42.5%;
	float:left;
	margin-left:5%;
	text-align:left;
}
#contents .vt_by .pt02 .p01{
	border:1px solid;
	background:#3D221C;
}
#contents .vt_by .pt02 .p01 img{
	opacity:1;
	-moz-opacity:1;
	filter:alpha(opacity=100);
	transition:all ease 0.3s;
	-webkit-transition:all ease 0.3s;
	-moz-transition:all ease 0.3s;
}
#contents .vt_by .pt02 .p01:hover img{
	opacity:0.85;
	-moz-opacity:0.85;
	filter:alpha(opacity=85);
}
#contents .vt_by .pt02 .p02{
	font-weight:bold;
	line-height:2;
}
#contents .vt_by .pt02 .p03{
	line-height:1.5;
}

#contents .vt_by .pt03{
	border-top:1px solid #aaa3a2;
	padding:1.3em 0;
	margin:0 auto;
	width:80%;
	max-width:300px;
}
@media (min-width: 640px) {
#contents .vt_by .pt03{
	border:none;
	max-width:600px;
	padding-bottom:3em;
}
}


/* ------------------------------ 
 フッター
 ------------------------------ */

/* TOPへ */
#footer .pt01{
	background:#f6c6be;
	height:44px;
	line-height:44px;
	text-align:center;
}
#footer .pt01 a{
	color:#3d221c;
}
#footer .pt01 i{
	margin-right:0.5em;
}
@media (min-width: 640px) {
#footer .pt01{
	background:#f6c6be;
	height:52px;
	line-height:52px;
}
}

/* SNSフローティング */
#footer{
	background:#3D221C;
	padding-bottom: 58px;
}
#footer .sns{
    margin: 0 auto;
    padding: 20px 5px 10px;
    text-align: center;
    position: fixed;
    bottom: 0;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, rgba(61,34,28, 0.3)), color-stop(0.00, rgba(61,34,28, 0)));
    background: -webkit-linear-gradient(top, rgba(61,34,28, 0) 0%, rgba(61,34,28, 0.3) 100%);
    background: -moz-linear-gradient(top, rgba(61,34,28, 0) 0%, rgba(61,34,28, 0.3) 100%);
    background: -o-linear-gradient(top, rgba(61,34,28, 0) 0%, rgba(61,34,28, 0.3) 100%);
    background: -ms-linear-gradient(top, rgba(61,34,28, 0) 0%, rgba(61,34,28, 0.3) 100%);
    background: linear-gradient(to bottom, rgba(61,34,28, 0) 0%, rgba(61,34,28, 0.3) 100%);
    z-index: 999;
    width: 100%;
}
@media (min-width: 640px) {
#footer {
	padding-bottom:0px;
}
#footer .sns{
	width: 80px;
    background: rgba(255, 255, 255, 0.4);
	right:0;
}
#footer .sns li{
	margin-bottom:10px;
	margin-right:auto;
	margin-left:auto;
}
}
@media (min-width: 1000px) {
#footer .sns{ right: 50%; margin-right:-510px;}
}
/* copyright */
#footer .pt03{
	padding:0.8em;
	text-align:center;
	color:#F2EEE9;
}
@media (min-width: 640px) {
#footer .pt03{
	padding:45px 0 15px;
}
}


/*--------------------------------
　終了表示
--------------------------------*/
#contents .vt_main .close{
	background-color:rgba(254,104,89,1.00);
	color:#fff;
	font-weight:bold;
	margin:-10px 0 20px;
	padding:0.5em 0;
	line-height:1.5;
}
#contents .vt_main .close span{
	display:inline-block;
}

#contents .vt_howto .pt03 .btn.close{
    line-height: 1.5;
    height: 4em;
    padding-top: 0.5em;
    background: #7A7A7A;
    width: 90%;
    max-width: 540px;
}