.app-wrap{width: 1200px;margin: 0 auto;}
/*航向*/
.dir-arrow{display: inline-block;width: 100%;border-bottom: 1px solid #a7a7a7;position: relative;}
.dir-arrow::after{content: '';display: inline-block;width: 0;height: 0;border: 2px solid rgba(255, 255, 255, 0);border-left-color: #a7a7a7;border-bottom-color: #a7a7a7;position: absolute;right: 0px;bottom: 0px;}
.dir-arrow.wf::before{content: '';display: inline-block;width: 0;height: 0;border: 2px solid rgba(255, 255, 255, 0);border-right-color: #a7a7a7;border-top-color: #a7a7a7;position: absolute;left: 0px;bottom: -4px;}
.dir-arrow2{display: inline-block;width: 30px;border-bottom: 1px solid #a7a7a7;position: relative;}
.dir-arrow2::after{content: '';display: inline-block;width: 0;height: 0;border: 2px solid rgba(255, 255, 255, 0);border-left-color: #a7a7a7;border-bottom-color: #a7a7a7;position: absolute;right: 0px;bottom: 0px;}
.dir-arrow2.wf::before{content: '';display: inline-block;width: 0;height: 0;border: 2px solid rgba(255, 255, 255, 0);border-right-color: #a7a7a7;border-top-color: #a7a7a7;position: absolute;left: 0px;bottom: -4px;}
        
/*筛选*/
.rsx{display: flex;justify-content: space-between; align-items: center;padding: 10px 0;}
.rsx .tit{display: flex;align-items: center;height: 30px; line-height: 30px;}
.rsx .tit h2{font-size: 16px;font-weight: 600;color: #0086f6;}
.rsx .tit::before{content: "";border-radius: 10px;background: #0086f6;display: inline-block;height: 100%;width: 5px;margin:0 10px 0 1px;}
        
.rsx .tit i{font-size: 26px;color: #0086f6;margin-right: 5px;font-weight: normal;}
.rsx .fitem{width: 35%; height: 50px;display: flex;flex-wrap: nowrap;align-items: center;background: #fff;border-radius: 10px;padding-right: 10px;border: 1px solid #0086f6;}
.rsx .rl{height: 100%;padding: 0 10px; display: flex;align-items: center;border-radius: 9px 0 0 9px; background-color: #0086f6;color: #fff;font-size: 16px;position: relative;}
.rsx .rl i{font-size: 16px;margin-right: 5px;}
.rsx .rl .jian{position: absolute;z-index: 5;top: 0;right: -20px;width: 0;height: 0;border-top: 50px solid #0086f6;border-right: 20px solid transparent;}
.rsx .rr{flex: 1; display: flex;justify-content:space-between;color: #152030;padding: 5px 10px;border-radius: 0 10px 10px 0;cursor: pointer;}
.rsx .rr i{font-size: 30px;color: #0086f6;}
.rsx .rr .r-con{display: flex;align-items: center;margin-left: 40px;font-weight: 500;font-size: 14px;}
.rsx .rr .fx{color: #152030;margin: 0 5px;}
.rsx .rr .r-con .week{font-size: 14px;margin-left: 10px;}
.rsx .rr .r-con:hover{color: #0086f6;}
.rsx .rr .r-con:hover i.dir-arrow2{color: #0086f6;}

/*游轮团期*/
.ydate{width: 1200px;display: flex;justify-content: space-between;border-radius: 10px;box-shadow: 2px 2px 3px #ccc; padding: 10px 0;margin: 10px auto;background: #fff;}
.ydate .yfl,.ydate .yfr{width: 4%;padding: 0 5px;padding-bottom: 10px; display: flex;justify-content: center;align-items: center;cursor: pointer;}
.ydate .yfl i,.ydate .yfr i{font-size: 40px;font-weight: 400;color: #aaa;}
.ydate .ywarp{flex: 1;height: 70px;overflow: hidden; white-space: nowrap;position: relative;}
.ydate .ywarp .ycon{position: absolute; display: flex;flex-wrap: nowrap;flex-direction: row;justify-content: flex-start;}
.ydate .ywarp .yitem{display: flex;flex-direction: column;align-items: center; border-radius: 5px;overflow: hidden; border:1px solid #eee;margin-right: 10px;line-height: 18px;cursor: pointer;}
.ydate .ywarp .yitem .dw{display: flex;flex-direction:column; justify-content: center;align-items: center;}
.ydate .ywarp .yitem .date{background: #e7f3ff;padding: 2px 20px;font-size: 14px;border-radius: 3px 3px 0 0;color: #152030;}
.ydate .ywarp .yitem .week{font-size: 12px;color: #69798c;}
.ydate .ywarp .yitem .price{text-align: right;color: #ff0000;font-size: 12px;}
.ydate .ywarp .yitem .price .num{font-size: 14px}
.ydate .ywarp .yitem .price .qi{font-size: 10px}
.ydate .ywarp .yitem.on{background: #0086f6;color: #fff;}
.ydate .ywarp .yitem.on .date{background: #0086f6;color: #fff;}
.ydate .ywarp .yitem.on .week{background: #0086f6;color: #fff;}
.ydate .ywarp .yitem.on .price{background: #0086f6;color: #fff;}
.ydate .ywarp .yitem.on{border: 1px solid #0086f6;}
.ydate .ywarp .yitem:hover{border:1px solid #0086f6;}
        
/* 航线内容*/
.rcon{width: 1200px;padding:0 10px;border-radius: 10px;color: #152030;}
.rcon .tit{font-size: 14px;padding: 10px 0;border-bottom: 1px solid #eee;}
.rcon .tit h1{font-size: 14px;font-weight: normal;display: inline;}
.rcon .rcon-body .ritem{background: #fff;border: 1px solid #eee;margin-top: 15px;border-radius: 8px; display: flex;justify-content:space-between;align-items: center; border-bottom: 1px solid #eee;padding: 10px;}
.rcon .rcon-body .ritem:nth-child(1){margin-top: 0px;}
.rcon .rcon-body .ritem img{width: 90px;height: 90px;border-radius: 5px; overflow: hidden;}
.rcon .rcon-body .ritem img:hover{ -webkit-transform: scale(1.1);-moz-transform: scale(1.1);-ms-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1);transition-duration: .8s;}
.rcon .rcon-body .ritem .name{width: 10%;font-size: 14px;font-weight: 500;margin-left: 35px; display: flex;flex-direction: column; justify-content: center;}
.rcon .rcon-body .ritem .ename{color: #999999;font-weight: 400;font-size: 12px;}
.rcon .rcon-body .ritem .cport{flex: 4;color: #152030; line-height: 28px; display: flex;justify-content: center; align-items: center;}
.rcon .rcon-body .ritem .cport .days{width: 160px;margin: 0 10px; display: flex;flex-direction: column;justify-content: center;align-items: center;}
.rcon .rcon-body .ritem .cport .sport{display: flex;flex-direction: column;}
.rcon .rcon-body .ritem .cport .eport{display: flex;flex-direction: column;}
.rcon .rcon-body .ritem .cport .sport i{color: #30ac68;}
.rcon .rcon-body .ritem .cport .eport i{color: #f54336;}
.rcon .rcon-body .ritem .cport .time{font-size: 24px;font-weight: 500;}
.rcon .rcon-body .ritem .cport .pname{font-size: 12px;}
.rcon .rcon-body .ritem .cport .pname i{font-size: 26px;}
.rcon .rcon-body .ritem .cport .hx{color: #69798c;}
.rcon .rcon-body .ritem .dida{font-size: 12px;color: #152030;}
.rcon .rcon-body .ritem .dida i{font-size: 12px;}
.rcon .rcon-body .ritem .price{flex: 2;text-align: center;color: #ff0000;font-size: 12px;}
.rcon .rcon-body .ritem .price .num{font-size: 22px}
.rcon .rcon-body .ritem .price .qi{font-size: 12px}
.rcon .rcon-body .ritem .order{width: 90px;margin-right: 10px; background: #f60;background:linear-gradient(to right, #f40, #f70);padding: 8px 10px; color: #fff;text-align: center;font-size: 13px;border-radius: 20px;}
.rcon .rcon-body .ritem:hover{box-shadow: 0px 2px 6px #ccc;border: 1px solid #eee;}
.rcon .rcon-body .ritem:hover .order{animation: move 1s;animation-iteration-count: 1;}
@keyframes move {0% {transform: translateX(0);} 50% {transform: translateX(-20px);} 100% {transform: translateX(0);}}

/*无数据*/
.not-data{margin: 10px 0px;border-radius: 8px; background: #fff;padding: 30px 0px;color: #152030;display: flex;justify-content: center;align-items: center;}
.not-data i{font-size: 32px;color: #ccc;margin-right: 5px;}
.not-data .desc{font-size: 14px;color: #304659;}

.calendarfly{position: absolute;top:50px;left: 0px;width: 371px;height: 413px;background: #ffffff;z-index: 99;}