@charset "UTF-8";
@font-face {
    font-family: 'dincond-regularregular';
    src: url('../font/dincond_regular_font_download-webfont.eot');
    src: url('../font/dincond_regular_font_download-webfont.eot?#iefix') format('embedded-opentype'), url('../font/dincond_regular_font_download-webfont.woff2') format('woff2'), url('../font/dincond_regular_font_download-webfont.woff') format('woff'), url('../font/dincond_regular_font_download-webfont.ttf') format('truetype'), url('../font/dincond_regular_font_download-webfont.svg#dincond-regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* basic */

body {
    font-family: "微軟正黑體", "儷黑 Pro", "Voltaire", Arial, Helvetica, sans-serif;
    color: #fff;
    background-color: #fff;
}

.section {
    background-size: cover;
}

.slide {
    background-size: cover;
    background-position: center top;
    overflow: hidden;
}

.wrap {
    margin-left: auto;
    margin-right: auto;
    width: 960px;
    position: relative;
}

h1 {
    font-size: 6em;
}

p {
    font-size: 2em;
}

.intro p {
    width: 50%;
    margin: 0 auto;
    font-size: 1.5em;
}

#fp-nav ul li a span {
    background-color: #ff2720;
    border: 2px solid #ff3f6c;
}

#fp-nav ul li .fp-tooltip{
    color:#000;
    font-size:15px;
    font-weight: bold;
    font-family: "微軟正黑體";
}

.fp-controlArrow.fp-prev {
    border-width: 30px 34px 30px 0;
    border-color: transparent #000 transparent transparent;
}

.fp-controlArrow.fp-next {
    border-width: 30px 0 30px 34px;
    border-color: transparent transparent transparent #000;
}

/* menu */

#menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 66px;
    background-image: url(../img/menubg.png);
}

#menu ul {
    display: block;
    width: 1000px;
    min-width: 1000px;
    margin: auto;
}

#menu li {
    position: relative;
    display: block;
    float: left;
    width: 145px;
    height: 56px;
    padding-top: 10px;
    border-right: 1px solid #807067;
    text-align: center;
    font-size: 18px;
    line-height: 24px;
    color: #fff;
}

#menu li span {
    font-size: 16px;
    font-family: 'dincond-regularregular';
    letter-spacing: 1px;
}

#menu li a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: auto;
    width: 100%;
    height: 100%;
    text-decoration: none;
}

#menu li:hover {
    color: #000;
    background-color: #e7ff46;
}

#menu li.active,
#menu li.ative:hover {
    color: #000;
    background-color: #e7ff46;
}

#menu li.logo {
    line-height: 46px;
}

#menu li.logo span {
    font-size: 20px;
}

#menu li.logo,
#menu li.logo:hover {
    color: #e7ff46;
    background-color: transparent;
}

#menu li.active a {
    display: none;
}

#menu li.fbicon {
    width: 86px;
    border-right: none;
}

#menu li.fbicon a {
    background-image: url(../img/fbicon.png);
    background-position: center 0px;
    background-repeat: no-repeat;
}

#menu li.fbicon a:hover {
    background-position: center -66px;
}

#menu li.fbicon,
#menu li.fbicon:hover {
    background-color: transparent;
}


/* sections */

#section0 {
    background-image: url(../img/secbg0.jpg);
}

#section1 {
    background-image: url(../img/cuklist/indbg.gif);
}

#section2 {
    background-image: url(../img/secbg1.jpg);
}

#section3 {
    /*background-image: url(../img/secbg3.jpg);*/
}

#section4 {
    /*background-image: url(../img/secbg4.jpg);*/
}

#section4 .fp-tableCell {
    vertical-align: top;
}

/* 料理教室 */

.titlebox {
    position: absolute;
    top: 100px;
    left: 12%;
    z-index: 1000;
    width: 376px;
    height: 480px;
    color: #e7ff46;
    background-image: url(../img/titlebg.png);
}

.titlebox .txt1 {
    display: inline-block;
    padding-left: 26px;
    padding-top: 10px;
    font-size: 154px;
    line-height: 160px;
    font-family: "dincond-regularregular";
}

.titlebox .txt2 {
    display: inline-block;
    width: 100px;
    padding-left: 10px;
    font-size: 26px;
    font-family: "dincond-regularregular";
    letter-spacing: 2px;
}

.titlebox .txt3 {
    display: block;
    padding-left: 26px;
    font-size: 80px;
    line-height: 100px;
    margin-top: -20px;
}

.titlebox .txt4 {
    padding-left: 36px;
    font-size: 15px;
    color: #fff;
    font-weight: normal;
    line-height: 22px;
}

.titlebox .txt4 span {
    font-size: 18px;
    padding: 0 3px;
    font-family: "dincond-regularregular";
    letter-spacing: 2px;
}

.titlebox .txt5 {
    display: inline-block;
    padding-left: 30px;
    font-size: 32px;
    line-height: 40px;
    padding-top: 6px;
    border-bottom: 1px solid #e7ff46;
}

.titlebox .txt5 span {
    font-family: "dincond-regularregular";
    letter-spacing: 2px;
}

.titlebox .joinbox {
    position: relative;
    left: 0px;
    z-index: 1000;
    height: 50px;
    bottom: -20px;
}

.titlebox .joinbox a {
    display: block;
    float: left;
    width: 346px;
    height: 50px;
    font-size: 26px;
    color: #000;
    line-height: 50px;
    text-indent: 30px;
    background-color: #e7ff46;
    transition: all 0.1s ease-in-out;
}

.titlebox .joinbox a:hover {
    color: #000;
    text-indent: 40px;
}

.titlebox .joinbox em {
    display: block;
    float: left;
    width: 30px;
    height: 50px;
    background-image: url(../img/joinbtnbg.png);
}

.slide .contentbox {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.slide .contentbox a {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
}

.slide .contentbox .slidecaption {
    position: absolute;
    right: 0px;
    top: 75%;
    font-size: 26px;
    line-height: 60px;
    padding: 0 40px 0 20px;
    color: #000;
    z-index: 1000;
    font-weight: bold;
    background-image: url(../img/slidecaptionbg.png);
}

.slide .contentbox .slidecaption b {
    padding-left: 5px;
    font-size: 30px;
    font-family: "dincond-regularregular";
    letter-spacing: 2px;
    font-weight: bold;
}

.slide .contentbox .slidecaption i {
    position: absolute;
    top: -15px;
    left: 15px;
    display: block;
    font-style: normal;
    font-size: 14px;
    line-height: 16px;
    padding: 5px 10px;
    font-weight: normal;
    background-color: #ff2720;
    color: #fff;
}

.slide .contentbox .slidecaption i em {
    font-size: 16px;
    font-style: normal;
    font-family: "dincond-regularregular";
    letter-spacing: 1px;
}

#slide1 {
    background-image: url(../img/slidebg1.jpg);
    padding: 0 0 0 0;
}

#slide2 {
    background-image: url(../img/slidebg2.jpg);
    padding: 0 0 0 0;
}

#slide3 {
    background-image: url(../img/slidebg3.jpg);
    padding: 0 0 0 0;
}

#slide4 {
    background-image: url(../img/slidebg4.jpg);
    padding: 0 0 0 0;
}

#slide5 {
    background-image: url(../img/slidebg5.jpg);
    padding: 0 0 0 0;
}

#slide6 {
    background-image: url(../img/slidebg6.jpg);
    padding: 0 0 0 0;
}

#slide7 {
    background-image: url(../img/slidebg7.jpg);
    padding: 0 0 0 0;
}

#slide8 {
    background-image: url(../img/slidebg8.jpg);
    padding: 0 0 0 0;
}

.fp-slidesNav.bottom span {
    background-color: #ff2720;
    border: 2px solid #ff3f6c;
}


/* 參賽規則 */

.rulebox {
    position: relative;
    width: 955px;
    margin: auto;
    padding-left: 45px;
    padding-top: 66px;
}

.rulebox .step1 {
    position: relative;
    z-index: 500;
    width: 565px;
    height: 361px;
    background-image: url(../img/section1_step1.png);
    margin-bottom: 20px;
}

.rulebox .step2 {
    width: 598px;
    height: 245px;
    background-image: url(../img/section1_step2.png);
    margin-bottom: 20px;
}

.rulebox .step3 {
    width: 565px;
    height: 245px;
    background-image: url(../img/section1_step3.png);
    margin-bottom: 20px;
}

.rulebox .schedule {
    position: absolute;
    top: 66px;
    right: 66px;
    z-index: 400;
    width: 370px;
    height: 375px;
    background-image: url(../img/section1_schedule.png);
}

.rulebox .model {
    position: absolute;
    top: 226px;
    right: 0px;
    z-index: 450;
    width: 435px;
    height: 792px;
    background-image: url(../img/section1_midel.png);
}


/* 我要投稿 */

 .bookbox {
 	position: relative;
 	padding-top: 100px;
    width: 1000px;
    height: 729px;
    margin: auto;
    background-image: url(../img/section2_book.png);
    background-position: 0px bottom;
    background-repeat: no-repeat;
}

 .bookbox .notice{
	display: block;
	position: absolute;
	bottom: 85px;
	right: 95px;
	z-index: 9999;
	font-size:14px;
	line-height:18px;
	color: #000;
	text-decoration: underline;
}

 .bookbox .notice:hover{
	color: #ff537b;
}

 .bookbox .joinbtn{
	display: block;
	position: absolute;
	top: 85px;
	right: 95px;
	z-index: 9999;
	width:180px;
	height:80px;
	color: #000;
	font-size:22px;
	line-height:75px;
	text-align: center;
	background-color: #e7ff46;
}

 .bookbox .joinbtn em{
	display: block;
	position: absolute;
	top: 55px;
	left:50%;
	margin-left: -55px;
	z-index: 9999;
	width:110px;
	height:2px;
	background-color: #000;
}

 .bookbox .joinbtn:hover{
	color: #fff;
	background-color: #ff537b;
}

 .bookbox .joinbtn:hover em{
	background-color: #fff;
}


/* 獎品介紹 */
.prizebox{
	padding-top:80px;
	background-image: url(../img/secbg3.jpg);
	background-position: center top;
}

.prize1{
	width: 1000px;
    height: 363px;
    margin: auto;
    background-image: url(../img/section3_prize1.png);
    margin-bottom:20px;
}
.prize2{
	width: 1000px;
    height: 580px;
    margin: auto;
    background-image: url(../img/section3_prize2.png);
    margin-bottom:20px;
}
.prize3{
	width: 1000px;
    height: 580px;
    margin: auto;
    background-image: url(../img/section3_prize3.png);
    margin-bottom:20px;
}
.prize4{
	width: 1000px;
    height: 530px;
    margin: auto;
    background-image: url(../img/section3_prize4.png);
}


/*心機小物*/
.specialbox {
	width:100%;
    padding:100px 0 50px 0;
	background-image: url(../img/secbg4.jpg);
	background-position: center top;
	background-size: cover;
}

.specialbox .special{
	width:1000px;
	height:730px;
	margin:auto;
	background-image: url(../img/section4_special.png);
	background-repeat: no-repeat;
}

/* footer */
.footerbox {
    width:100%;
	height:150px;
	background-color:#181817;
}

.footerbox .footer {
    position: relative;
	width:1000px;
	height:150px;
	margin:auto;
	background-image: url(../img/futr.png);
    background-position: center 0;
}

.footerbox .footer a{
    display: block;
    position: absolute;
    z-index: auto;
}

.footerbox .footer a.logo01{
    top: 60px;
    left: 40px;
    width: 215px;
    height: 55px;
}

.footerbox .footer a.logo02{
    top: 25px;
    left: 325px;
    width: 110px;
    height: 45px;
}

.footerbox .footer a.logo03{
    top: 25px;
    left: 465px;
    width: 120px;
    height: 45px;
}

.footerbox .footer a.logo04{
    top: 25px;
    left: 620px;
    width: 90px;
    height: 45px;
}

.footerbox .footer a.logo05{
    top: 25px;
    left: 735px;
    width: 95px;
    height: 45px;
}

.footerbox .footer a.logo06{
    top: 25px;
    left: 860px;
    width: 90px;
    height: 45px;
}

.footerbox .footer a.logo07{
    top: 80px;
    left: 325px;
    width: 70px;
    height: 65px;
}

.footerbox .footer a.logo08{
    top: 80px;
    left: 415px;
    width: 75px;
    height: 65px;
}

.footerbox .footer a.logo09{
    top: 80px;
    left: 505px;
    width: 95px;
    height: 65px;
}

.footerbox .footer a.logo10{
    top: 80px;
    left: 620px;
    width: 90px;
    height: 65px;
}
.footerbox .footer a.logo11{
    top: 80px;
    left: 725px;
    width: 85px;
    height: 65px;
}
.footerbox .footer a.logo12{
    top: 80px;
    left: 825px;
    width: 105px;
    height: 65px;
}

/* fancybox btn reset position */
#fancybox-close{top:20px;right:-30px;background:url(../img/fanc_close.png);width:46px;height:36px;}
#fancybox-bg-n,#fancybox-bg-ne,#fancybox-bg-e,#fancybox-bg-se,#fancybox-bg-s,#fancybox-bg-sw,#fancybox-bg-w,#fancybox-bg-nw{background-image:none;}



/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  



.votebx{ }
#section1 p.annop{padding: 100px 0 0 0;}


@font-face {
    font-family: 'pcpaprregular';
    src: url('../font/pcpapr-webfont.eot');
    src: url('../font/pcpapr-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/pcpapr-webfont.woff2') format('woff2'),
         url('../font/pcpapr-webfont.woff') format('woff'),
         url('../font/pcpapr-webfont.ttf') format('truetype'),
         url('../font/pcpapr-webfont.svg#pcpaprregular') format('svg');
    font-weight: normal;
    font-style: normal;}

/*---------------ICON-------------------------*/
[class^="ic-"],[class*="ic-"]{font-family:'pcpaprregular';font-style:normal;speak:none;font-weight:normal;-webkit-font-smoothing:antialiased; padding: 0 1px;}
.ic-srch:before{content:'A'}
.ic-srch{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'A')}
.ic-hart:before{content:'C'}
.ic-hart{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'C')}
.ic-start:before{content:'D'}
.ic-start{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'D')}
.ic-fb:before{content:'E'}
.ic-fb{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'E')}



.grid-item{width:280px; margin: 15px 10px;  background: #fff; float: left; box-shadow: 10px 10px 20px rgba(0,0,0,.2);}
.grid-item2{width:580px;}

.blgid{ height: 30px; background: #e6e6e6; font-size: 12px; line-height: 30px;}

.blgid b{display: block; width: 40px; height: 40px; overflow: hidden; border-radius: 100%; float: left; margin: -12px 5px 0;}

.blgid b img{ width: 100%;}
.blgid u{ display: block; width: 55px; height: 30px; line-height: 30px; color: #fff; float: right; margin: -30px 0 0 5px; text-align: center; text-decoration: none; cursor: pointer;
background: #00c5d3; 
background: -moz-linear-gradient(top,  #00c5d3 0%, #01a9b5 100%); 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00c5d3), color-stop(100%,#01a9b5)); 
background: -webkit-linear-gradient(top,  #00c5d3 0%,#01a9b5 100%); 
background: -o-linear-gradient(top,  #00c5d3 0%,#01a9b5 100%); 
background: -ms-linear-gradient(top,  #00c5d3 0%,#01a9b5 100%); 
background: linear-gradient(to bottom,  #00c5d3 0%,#01a9b5 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00c5d3', endColorstr='#01a9b5',GradientType=0 ); 
}
.blgid u.on,.blgid u.on:hover{ background:#8c8c8c;}
.blgid u:hover{ background: #00aab6;}
.blgid u a{ color: #fff;}
.blgid a p{ display: block; width: 175px; height: 30px; line-height: 30px;text-overflow: ellipsis;-o-text-overflow: ellipsis;white-space: nowrap; overflow: hidden;  color: #616161; font-size: 12px;}
.grid-item2 a p{ width: 460px;}
.blgid a:hover p{ color: #01b3c0;}

.fudpic{ width: 100%; overflow: hidden;}
.fudpic a{ display: block; width: 100%; height: auto;}

.votebx .fudpic a{ max-height: 280px;}

.fudpic a img{ width: 100%; transition:0.4s;-webkit-transition:0.4s;-moz-transition:0.4s;;transition:0.4s}



.fudpic:hover a img{transform: rotate(0deg) scale(1.2);transition: 0.4s;    -webkit-transform: rotate(0deg) scale(1.2);-webkit-transition: 0.4s;-moz-transform: rotate(0deg) scale(1.2);-moz-transition:  0.4s;}

.vvbx{ display: block; width: 120px; height: 50px; margin: -30px 15px 0 0; position: relative; float: right;}
.vvbx li{ display: block; width: 50px; height: 50px; float: left; margin: 0 5px; text-align: center; border-radius: 100%; box-shadow:3px 3px 3px rgba(0,0,0,.2); overflow: hidden;
background: #fcfcfc;
background: -moz-linear-gradient(top,  #fcfcfc 0%, #ebebeb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#ebebeb));
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%);
background: -o-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%); 
background: -ms-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%); 
background: linear-gradient(to bottom,  #fcfcfc 0%,#ebebeb 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ebebeb',GradientType=0 ); 
}

.vvbx li.icht{
background: #fd485d; 
background: -moz-linear-gradient(-45deg,  #fd485d 0%, #ea354a 100%); 
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#fd485d), color-stop(100%,#ea354a)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg,  #fd485d 0%,#ea354a 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg,  #fd485d 0%,#ea354a 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg,  #fd485d 0%,#ea354a 100%); /* IE10+ */
background: linear-gradient(135deg,  #fd485d 0%,#ea354a 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd485d', endColorstr='#ea354a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.vvbx li a{display: block; width: 100%; height: auto; font-size: 13px;}

.icfb{ line-height: 50px;}
.icfb a span{color: #01adb9;  font-size: 26px;}
/*
.icht a{ color: #fff; font-family: 'dincond-regularregular'; font-weight: bold;}
*/
.icht a{ color: #fff; font-weight: bold;}
.icht .ic-hart{ display: block; line-height: 24px; color: #fff;font-size: 20px; margin: 6px 0 0 0;}

.icfb:hover{ background: #01adb9; }
.icfb a:hover{ color: #fff;}
.icfb a:hover span{color: #fff;}

.vvbx li.icht:hover{color: #fff;  background: #fcfcfc;
background: -moz-linear-gradient(top,  #fcfcfc 0%, #ebebeb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#ebebeb));
background: -webkit-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%);
background: -o-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%); 
background: -ms-linear-gradient(top,  #fcfcfc 0%,#ebebeb 100%); 
background: linear-gradient(to bottom,  #fcfcfc 0%,#ebebeb 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ebebeb',GradientType=0 ); 
}
.vvbx li.icht:hover a,.vvbx li.icht:hover a span{ color: #fd485d;}




.grid-item h3{ padding:0px 20px 10px 20px; font-size: 16px; line-height: 22px; text-align: left;}
.grid-item h3 a{ color: #000;}
.grid-item h3 a:hover{ color: #01adb9;}
.grid-item h3 span{ border-bottom: 2px solid #01adb9; font-size: 13px; line-height: 30px; letter-spacing: 2px; font-weight: bold;}

.mrblg{ margin: 20px auto; width:200px; height: 45px; line-height: 45px; background: #000; border-radius: 5px; font-size: 20px; text-align: center; letter-spacing: 3px;}
a .mrblg{ color: #e7ff46;}
a:hover .mrblg{ color: #000; background: #e7ff46;}



.prizL,.prizR{ width: 405px; float: left; padding: 80px 0 0 0;}
.prizR{ padding: 50px 0 0 60px;}

.przlis{ width: 100%; background: url(../img/pt.gif); margin: 0 0 20px 0; padding: 0 0 20px 0;}
.przlis h2.tit{ display: block; height: 55px; background: #000; color: #e7ff46; font-size: 25px; padding: 10px 20px;}
h2.tit u{ display: block; font-size: 15px; color: #c3c3c3; line-height: 28px; text-decoration: none;}
.przlis ul{ padding: 5px 20px;}
.przlis ul li{ display: block; height: 55px; border-bottom: 2px solid #000; background: url(../img/star.png) 8px center no-repeat; padding: 10px 0 0 35px; font-size: 22px; color: #000; font-weight:bold;}
.przlis ul li i{ display: block; line-height: 20px; font-size: 15px; color: #717272; width: 100%; height: 28px; overflow: hidden;text-overflow: ellipsis;-o-text-overflow: ellipsis;white-space: nowrap; font-style: normal; font-weight: normal;}

p.annop{ font-size:15px; color:#729b8d; text-align:center; line-height:30px;}