@charset "utf-8";
/* 
Rent Order
PM:ZhangXiaoYu
UI:gejingqi
CSS:HWJ
2015.12.3
*/

body{ min-width: 1000px; font-size: 14px; line-height: 24px; color: #fff;}
body a{ color: #fff;}
body a:hover{ color: #fff;}

.chara li .charaIcon .icon,.wedding li .wCon .icon,.travel .intro .tTit h6{ background: url(/images/activity/hawaii/sprite1.png) no-repeat;}

/* 视差滚动区域 */
.parallax{ width: 100%; background-position: center center; background-repeat: no-repeat; background-attachment: fixed; position: relative; background-size: cover; background-position-x: 50%!important; background-position-y: 0;}
.parallax1{ height: 400px; background-image: url(/images/activity/hawaii/parallax1.jpg);}
.parallax2{ height: 400px; background-image: url(/images/activity/hawaii/parallax2.jpg);}
.parallax3{ height: 486px; background-image: url(/images/activity/hawaii/parallax3.jpg);}
.parallax4{ height: 467px; background-image: url(/images/activity/hawaii/parallax4.jpg); margin-top: -45px;}

/* 首屏 */
.start{ width: 100%; background: url(/images/activity/hawaii/start2.jpg) center center no-repeat; background-size: cover; position: relative; overflow-x: hidden;}
.start .more{ width: 100px; text-align: center; position: absolute; left: 50%; margin-left: -50px; bottom: 20px; cursor: pointer;}
.start .more img{ position: relative; top: -1px;}
.gSider{ width: 240px; height: 240px; background: url(/images/activity/hawaii/sider1.png) no-repeat; position: absolute; right: -46px; top: 50%; margin-top: -120px; cursor: pointer;}

/* 首屏弹出框 */
.gPop{ width: 434px; position: fixed; left: 50%; margin-left: -217px; top: 50%; margin-top: -255px; z-index: 100;}
.gPop .gPopClose{ width: 56px; height: 56px; border-radius: 50%; background: #fff url(/images/activity/hawaii/close.png) center center no-repeat; box-shadow: 0px 0px 20px 0px #000; position: absolute; right: -76px; top: 0; cursor: pointer;}
.gPop .gPopCon{ width: 100%; background-color: #fff; border-radius: 8px; box-shadow: 0px 0px 20px 0px #000; overflow: hidden;}
.gPop .gTit{ width: 100%; height: 35px; line-height: 35px; background-color: #f3f3f3; text-align: center; color: #696969;}
.gPop .gRank{ width: 100%; overflow: hidden;}
.gPop .gRank ul{ width: 436px;}
.gPop .gRank li{ padding-top: 10px; padding-bottom: 5px; width: 86px; border: 1px solid #efefef; border-left: none; position: relative; float: left;}
.gPop .gRank li img{ display: block; width: 46px; height: 46px; border-radius: 50%; margin: 0 auto;}
.gPop .gRank li span{ display: block; text-align: center; line-height: 22px; color: #4fb4e4;}
.gPop .gRank li i{ display: block; width: 20px; height: 20px; border-radius: 50%; background-color: #f43f77; font-style: normal; text-align: center; line-height: 20px; position: absolute; right: 10px; top: 10px;}
.gPop .gTop{ width: 100%; padding-top: 30px; padding-bottom: 10px; border-bottom: 1px solid #efefef; position: relative;}
.gPop .gTop img{ display: block; width: 80px; height: 80px; border-radius: 50%; border: 5px solid #e5e5e5; margin: 0 auto;}
.gPop .gTop span{ display: block; text-align: center; font-size: 32px; line-height: 66px; color: #4fb4e4;}
.gPop .gTop i{ display: block; width: 32px; height: 32px; border-radius: 50%; background-color: #f43f77; font-size: 12px; font-style: normal; text-align: center; line-height: 32px; position: absolute; right: 164px; top: 30px;}
.gPop .gIntro{ padding: 10px 20px; font-size: 16px; color: #696969;}
.gPop .gIntro span{ display: block; color: #4fb4e4;}
.gPop .gBtn{ display: block; width: 100%; height: 54px; font-size: 24px; text-align: center; line-height: 54px; background-color: #4fb4e4;}
.gPop .gBtn:hover{ text-decoration: none; background-color: #24a5e2;}
.gMask{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#c8000000,endColorstr=#c8000000);0); position: fixed; left: 0; top: 0; z-index: 100;}
.gMask .gClose{ display: block; width: 52px; height: 52px; border: 1px solid #fff; border-radius: 50%; font-size: 34px; font-weight: bold; text-align: center; line-height: 55px; opacity: 0.7; position: absolute; right: 20px; top: 20px; -webkit-transition: all 1s; transition: all 1s;}
.gMask .gClose:hover{ text-decoration: none; opacity: 1; -webkit-transform:rotate(180deg); transform:rotate(180deg);}
.gMask .gReady{ display: block; font-size: 200px; line-height: 816px; text-align: center; text-shadow: 1px 1px 10px #fff; -webkit-animation: zoomIn 1s linear 0s 4 normal both; animation: zoomIn 1s linear 0s 4 normal both;}
.gMask .gLoad,.wedMask .gLoad{ width: 100%; height: 50px; font-size: 36px; text-align: center; line-height: 50px; position: absolute; left: 0; top: 50%; margin-top: -25px;}
@-webkit-keyframes zoomIn {
	0% { opacity: 0; -webkit-transform: scale3d(.3,.3,.3);}
	50% { opacity: 1;}
	100% { opacity: 0; -webkit-transform: scale3d(1.5,1.5,1.5) translate3d(0,-4px,0);}
}

@keyframes zoomIn {
	0% { opacity: 0; transform: scale3d(.3,.3,.3);}
	50% { opacity: 1;}
	100% { opacity: 0; transform: scale3d(1.5,1.5,1.5) translate3d(0,-4px,0);}
}
.gMask .score{ width: 600px; height: 520px; background: url(/images/activity/hawaii/score.png) no-repeat; position: absolute; left: 50%; top: 50%; margin-left: -300px; margin-top: -260px;}
.gMask .score span{ display: block; font-size: 64px; font-weight: bold; color: #fff37f; text-align: center; padding-top: 312px; font-style: italic;}

/* 旅游特色区域 */
.chara{ width: 100%; height: 600px; background: url(/images/activity/hawaii/charaBg.jpg) center center no-repeat; background-size: cover; position: relative;}
.chara ul{ width: 100%; height: 100%; margin: 0 auto;}
.chara li{ width: 20%; height: 100%; float: left; position: relative; overflow: hidden; cursor: pointer;}
.chara li .charaBg{ width: 100%; height: 100%; position: absolute; left: 0; top: -100%; -webkit-transition:all 1s; transition:all 1s;}
.chara li .charaBg img{ width: 100%; height: 100%;}
.chara li.hover .charaBg{ top: 0;}
.chara li .charaIcon{ width: 100%; position: absolute; left: 0; top: 204px; -webkit-transition:all 1s; transition:all 1s;}
.chara li .charaIcon .icon{ width: 100px; height: 100px; margin: 0 auto;}
.chara li .charaIcon .icon1{ background-position: 0px 0px;}
.chara li .charaIcon .icon2{ background-position: -100px 0px;}
.chara li .charaIcon .icon3{ background-position: -200px 0px;}
.chara li .charaIcon .icon4{ background-position: -300px 0px;}
.chara li .charaIcon .icon5{ background-position: -400px 0px;}
.chara li .charaIcon i{ display: block; width: 110px; height: 1px; background-color: #fff; opacity: 0.5; margin: 10px auto 0;}
.chara li .charaIcon p{ margin-top: 26px; font-size: 22px; text-align: center; line-height: 30px; opacity: 0.5;}
.chara li.hover .charaIcon{ top: 80px;}
.chara li.hover .charaIcon p{ opacity: 1;}
.chara li .charaCon{ width: 100%; height: 100%; position: absolute; left: 0; bottom: -100%; -webkit-transition:all 1s; transition:all 1s;}
.chara li .charaCon p{ width: 200px; padding: 340px 0 0; margin: 0 auto; text-align: center; opacity: 0.75}
.chara li.hover .charaCon{ bottom: 0;}
.charaPop{ width: 100%; height: 100%; background: url(/images/activity/hawaii/charaPop.jpg) no-repeat; background-size: cover; position: absolute; left: 0; top: 0; display: none;}
.charaPop .cPopCon{ width: 1200px; margin: 0 auto; position: relative;}
.charaPop .cPopCon span{ display: block; font-size: 28px; line-height: 30px; padding-top: 212px;}
.charaPop .cPopCon p{ width: 620px; font-size: 18px; line-height: 30px; margin-top: 16px;}
.charaPop .cPopCon img{ display: block; width: 440px; height: 534px; position: absolute; right: 0; top: 32px;}
.charaPop .cPopCon .cClose{ display: block; width: 52px; height: 52px; border: 1px solid #fff; border-radius: 50%; font-size: 34px; font-weight: bold; text-align: center; line-height: 55px; opacity: 0.7; position: absolute; left: 290px; top: 88px; -webkit-transition: all 1s; transition: all 1s;}
.charaPop .cPopCon .cClose:hover{ text-decoration: none; opacity: 1; -webkit-transform:rotate(180deg); transform:rotate(180deg);}

/* 婚礼区域 */
.wedding{ width: 100%; height: auto;}
.wedding li{ width: 33.33%; float: left; position: relative; cursor: pointer;}
.wedding li .wBg{ width: 100%; height: auto;}
.wedding li .wHover{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0; -webkit-transition:all 0.5s; transition:all 0.5s;}
.wedding li .wCon{ width: 100%; height: 100%; position: absolute; left: 0; top: 0;}
.wedding li .wCon .icon{ width: 200px; height: 160px; margin: 15% auto 0;}
.wedding li .wCon .icon1{ background-position: 0 -100px;}
.wedding li .wCon .icon2{ background-position: -200px -100px;}
.wedding li .wCon .icon3{ background-position: -400px -100px;}
.wedding li .wCon .wBtn{ display: block; width: 134px; height: 36px; border: 1px solid #fff; border-radius: 6px; text-align: center; line-height: 36px; margin: 16% auto 0; opacity: 0.5;}
.wedding li .wCon p{ width: 100%; font-size: 18px; text-align: center; line-height: 50px; opacity: 0.7; position: absolute; left: 0; bottom: 0;}
.wedding li.hover .wHover,.wedding li.hover .wCon .wBtn{ opacity: 1;}

/* 旅行种类区域 */
.travelWtap{ width: 100%; height: 482px; background: url(/images/activity/hawaii/travelBg.png) center center no-repeat; background-size: 100% 100%; position: relative;}
.travel{ width: 786px; height: 510px; padding: 10px 107px 0; background: url(/images/activity/hawaii/travelCon.png) center center no-repeat; margin: 0 auto; position: relative; top: -95px;}
.travel .intro{ height: 390px; overflow: hidden;}
.travel .intro .tTit{ width: 100%; text-align: center; padding-top: 63px;}
.travel .intro .tTit span{ display: block; height: 24px; color: #cdc37b;}
.travel .intro .tTit h6{ width: 350px; height: 40px; margin: 15px auto 0; text-indent: -9999px;}
.travel .intro .tTit1 h6{ background-position: 0 -260px;}
.travel .intro .tTit2 h6{ background-position: 0 -300px;}
.travel .intro .tTit3 h6{ background-position: 0 -340px;}
.travel .intro .tTit i{ display: block; width: 60px; height: 3px; background-color: #cdc37c; margin: 26px auto 0;}
.travel .intro .tText{ width: 574px; margin: 24px auto 0; color: #333;}
.travel .intro .tText a{ color: #cdc37c;}
.travel .slider{ width: 100%; height: 220px; position: relative;}
.travel .slider ul{ height: 250px;  width: 500px;  margin: 0 auto; position: absolute; left: 50%; margin-left: -250px;}
.travel .slider li{ width: 362px; height: 216px; border: 2px solid #fff; box-shadow: 0px 0px 10px #737373; position: absolute; top: 36px;}
.travel .slider li img{ display: block; width: 100%; height: 100%;}
.travel .slider li.s1{ left: 56px; z-index: 1;}
.travel .slider li.s2{ left: 210px; top: 0; width: 362px; height: 216px; z-index: 2;}
.travel .slider li.s3{ left: 494px; z-index: 1;}
.travel .arr{ display: block; width: 42px; height: 42px; background: #cdc37c url(/images/activity/hawaii/arr.png); position: absolute; top: 259px; cursor: pointer;}
.travel .prev{ left: 88px;}
.travel .next{ right: 88px; background-position: -42px 0;}
.travel .arr:hover{ background-color: #c4b75b;}
.travel .arr.disabled{ background-color: #dedede;}
.slide_box{width:786px;height:626px;position:relative;overflow:hidden}
.slide_box ul{width:20000em;position:absolute;left:0;top:0}
.slide_box ul li{width:786px;float:left;overflow:hidden;height:626px}

/* 航线区域 */
.flyWrap{ width: 100%; height: 600px; background: url(/images/activity/hawaii/flyBg.jpg) center center no-repeat; background-size: 100% 100%;}
.fly{ width: 1200px; padding-top: 47px; margin: 0 auto; position: relative;}
.fly .fTit{ width: 166px; height: 44px;}
.fly .fBtn{ height: 44px; font-size: 20px; line-height: 44px; margin-top: 17px; position: relative; z-index: 10;}
.fly .fBtn a{ display: inline-block; width: 172px; height: 44px; border-radius: 4px; background: #ff9f00 url(/images/activity/hawaii/fIcon.png) 30px 10px no-repeat; margin-left: 11px; text-indent: 61px; box-shadow: 0px 0px 10px 0px #7d7d7d;}
.fly .fBtn a:hover{ background-color: #ffa819; text-decoration: none;}
.fly .fCon{ width: 676px; height: 200px; margin-top: 40px;}
.fly .fCon img{ display: block; width: 300px; height: 200px; float: left; margin-right: 30px;}
.fly .fCon span{ display: block; font-size: 24px; margin-bottom: 10px;}
.fly .fList{ margin-top: 30px; clear: both;}
.fly .fList li{ float: left; margin-right: 15px;}
.fly .fList li img{ display: block; width: 100px; height: 67px;}
.fly .fList li.current img{ display: block; width: 94px; height: 61px; border: 3px solid #fff;}
.fly .island{ width: 540px; height: 440px; background: url(/images/activity/hawaii/island1.png) no-repeat; position: absolute; right: 0; top: 82px;}
.fly .island .line{ display: block; background: url(/images/activity/hawaii/line.png) no-repeat; position: absolute; left: 212px; top: 109px;}
.fly .island .line1{ width: 0; height: 180px; background-position: 0px 0px; left: -487px; top: -41px;}
.fly .island .line2{ width: 0; height: 74px; background-position: 0px -180px; left: 73px; top: 65px;}
.fly .island .line3{ width: 0; height: 210px; background-position: 0px -254px;}
.fly .island .line4{ width: 0; height: 120px; background-position: 0px -464px;}
.fly .island .line5{ width: 0; height: 100px; background-position: 0px -584px;}
.fly .island .line6{ width: 0; height: 78px; background-position: 0px -684px;}
.fly .island .island1{ display: block; width: 100px; height: 56px; position: absolute; left: 4px; top: 55px;cursor: default;}
.fly .island .island2{ display: block; width: 76px; height: 59px; position: absolute; left: 187px; top: 108px; z-index: 1;cursor: default;}
.fly .island .island3{ display: block; width: 66px; height: 28px; position: absolute; left: 282px; top: 159px;cursor: default;}
.fly .island .island4{ display: block; width: 34px; height: 34px; position: absolute; left: 308px; top: 188px;cursor: default;}
.fly .island .island5{ display: block; width: 80px; height: 66px; position: absolute; left: 342px; top: 180px;cursor: default;}
.fly .island .island6{ display: block; width: 136px; height: 150px; position: absolute; left: 402px; top: 257px;cursor: default;}
.fly .island .active{cursor: pointer;}
.fly .island .plane{ width: 76px; height: 46px; background: url(/images/activity/hawaii/plane.png) no-repeat; position: absolute; left: 186px; top: 110px;}

/* 下载区域 */
.downloadwrap{ width: 100%; height: 514px; background-color: #3c3c3c;}
.download{ width: 1000px; padding-top: 112px; margin: 0 auto; font-size: 18px;}
.download .dTit{ font-size: 16px; line-height: 32px;}
.download .dTit span{ font-size: 30px;}
.download .dTags{ margin: 12px 0;}
.download .dTags span{ color: #57321f; padding: 3px 6px; border-radius: 4px; background-color: #fff; margin-right: 15px;}
.download img{ display: block; width: 208px; height: 296px; float: left; margin-right: 22px;}
.download .intro{ line-height: 30px;}
.download .dBtn{ margin-top: 18px;}
.download .dBtn a{ display: inline-block; width: 158px; height: 42px; text-align: center; line-height: 42px; border-radius: 4px; margin-right: 20px;}
.download .dBtn a:hover{ text-decoration: none;}
.download .dBtn a.dBtn1{ background-color: #ff9f00;}
.download .dBtn a.dBtn1:hover{ background-color: #ffa817;}
.download .dBtn a.dBtn2{ background-color: #4aa5ea;}
.download .dBtn a.dBtn2:hover{ background-color: #5ab1f2;}

/* 制作人员 */
.producers{ width: 980px; margin: 0 auto; padding: 14px 0; font-size: 12px; color: #10191c; overflow: hidden;}
.producers span{ display: block; width: 62px; line-height: 70px; float: left;}
.producers ul{ float: left;}
.producers ul li{ width: 100px; float: left;}
.producers ul li img{ display: block; width: 72px; height: 72px; border-radius: 50%; margin: 0 auto;}
.producers ul li p{ line-height: 26px; text-align: center;}

/* 婚礼弹出框 */
.wedPop{ width: 900px; height: 476px; position: fixed; left: 50%; margin-left: -450px; top: 50%; margin-top: -238px; z-index: 101;}
.wedPop .wedPopClose{ width: 56px; height: 56px; border-radius: 50%; background: #fff url(/images/activity/hawaii/close.png) center center no-repeat; box-shadow: 0px 0px 20px 0px #000; position: absolute; right: -76px; top: 0; cursor: pointer;}
.wedPop .wedPopCon{ width: 100%; height: 100%; background-color: #fff; border-radius: 8px; box-shadow: 0px 0px 20px 0px #000; overflow: hidden;}
.wedPop .wTit{ padding: 6px 20px 0; font-size: 24px; line-height: 50px; color: #000;}
.wedPop .wText{ margin: 0 20px; height: 120px; font-size: 16px; line-height: 30px; color: #696969; overflow: auto;}
.wedPop .wPlace{ width: 800px; height: 180px; margin: 60px auto 0; background-repeat: no-repeat; position: relative;}
.wedPop .wPlace.five{ background-image: url(/images/activity/hawaii/place1.png);}
.wedPop .wPlace.six{ background-image: url(/images/activity/hawaii/place2.png);}
.wedPop .wPlace li{ display: block; width: 60px; height: 60px; position: absolute;}
.wedPop .wPlace li img{ display: block; width: 100%; height: 100%; border-radius: 50%;}
.wedPop .wPlace li span{ display: block; width: 280px; font-size: 18px; line-height: 46px; text-align: center; color: #696969; position: absolute; left: 50%; margin-left: -140px; top: 60px;}
.wedPop .wPlace li.texttop span{ top: -46px;}
.wedPop .five li.p1{ left: 51px; top: 116px;}
.wedPop .five li.p2{ left: 204px; top: 82px;}
.wedPop .five li.p3{ left: 343px; top: 4px;}
.wedPop .five li.p4{ left: 562px; top: 70px;}
.wedPop .five li.p5{ left: 683px; top: 31px;}
.wedPop .six li.p1{ left: 77px; top: 90px;}
.wedPop .six li.p2{ left: 163px; top: 9px;}
.wedPop .six li.p3{ left: 260px; top: 107px;}
.wedPop .six li.p4{ left: 407px; top: 83px;}
.wedPop .six li.p5{ left: 567px; top: 65px;}
.wedPop .six li.p6{ left: 686px; top: 3px;}
.wedMask{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.7); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#c8000000,endColorstr=#c8000000);0); position: fixed; left: 0; top: 0;z-index: 100;}

#girl {background-size: cover;}
.container{position: relative;}

/* 滚动条优化 */
.jspContainer{position:relative;overflow:hidden}
.jspPane{position:absolute}
.jspVerticalBar{position:absolute;top:0;right:0;width:10px;height:100%;}
.jspCap{display:none}
.jspHorizontalBar .jspCap{float:left}
.jspTrack{position:relative;background:#ddd;border-radius: 5px;}
.jspDrag{position:relative;top:0;left:0;background:#bbb;border-radius: 5px;cursor:pointer}
* html .jspCorner{margin:0 -3px 0 0}

.island_content a{color:#ff9f00;}









