@charset "utf-8";
.centerwrap{  width:1200px;  margin:0 auto;}
#indexpage{background:#fff;}
/* header */
header{z-index:15;position:absolute;top:0;left:0;width:100%;padding:10px 0;background:#226699;height:40px;min-width:1200px;}
header h1{font-size:20px;line-height:36px;color:#fff;font-weight:bold;display:inline-block;}
#mainwrap{z-index:5;position:relative;padding:70px 0 200px 0;min-height:calc(100% - 150px);min-width:1200px;}
#pagewrap{position:relative;padding:70px 0;min-width:1200px;}
#linewrap{z-index:1;position:absolute;top:0;left:0;width:100%;height:100%;}
/* 主要外框*/
#i_container{position:relative;padding:100px 30px;text-align:center;}
#f_container{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;background:rgba(100,80,50,0.1);min-width:1200px;}
/* menu */
.menulist{position:relative;display:inline-block;float:right;}
.menulist a{display:inline-block;margin:0 10px;font-size:14px;color:#fff;line-height:30px;}
.noticeclick{position:relative;cursor: pointer;}
#noticelist{position:absolute;display:none;cursor:default;;height:0;overflow:hidden;transition: all 0.3s;background:#fff;z-index:9;top:30px;left:-50px;width:240px;padding:10px 2px;box-shadow: 1px 1px 3px 3px rgba(0,0,0,0.3);}
#noticelist.on{display:block;height:auto;}
.noticeline{border-bottom:1px solid #999;padding:5px 0;font-size:12px;line-height:18px;color:#999;}
.noticeline.new{background:rgba(255,245,245,0.7);color:#444;}
.noticeline span{float:left;visibility: top;padding:0 2%;}
.noticeline span:nth-child(1){width:26%;}
.noticeline span:nth-child(2){width:66%;}
.noticeline:before,.noticeline:after {  content: "";  display: table;}
.noticeline:after{  clear: both;}
/* index */
#i_container h3{font-size:40px;line-height:60px;color:#666;padding:30px 0;}
#i_container p{font-size:20px;line-height:30px;padding:20px 0;}
#i_container .btnwrap{text-align:center;}
#i_container .btnwrap div{display:inline-block; padding:0 20px;margin:0 30px;background:#226699;border-radius: 10px;color:#fff;font-size:20px;line-height:40px;}
/* linebox */
.linebox{position:absolute;}
.linbox_lb{border-left:2px solid #669;border-bottom:2px solid #669;}
.linbox_rb{border-right:2px solid #669;border-bottom:2px solid #669;}
.linbox_lt{border-left:2px solid #669;border-top:2px solid #669;}
.linbox_rt{border-right:2px solid #669;border-top:2px solid #669;}
.linbox_l{border-left:2px solid #669;}
.f_centerwrap{margin:0 auto;}
/* 訂距離最外大框 */
/*.family_spliter{transition: margin 0.1s;}*/
.family_prewrap{position:relative;z-index:10;text-align:center;}
.family_prewrapin{height:0;position:relative;overflow:hidden;transform: scaleY(0);transition: transform 0.3s;}
.family_prewrapin.on{padding-top:50px;height:auto;transform: scaleY(1);}
.family_mainwrap{position:relative;z-index:10;text-align:center;padding-top:50px;}
.family_afterwrap{position:relative;z-index:10;text-align:center;}
.family_afterwrapin{height:0;position:relative;overflow:hidden;transform: scaleY(0);transition: transform 0.3s;}
.family_afterwrapin.on{height:auto;transform: scaleY(1);}
/* 個人框 */
.f_linewrap{font-size:0;position:relative;margin-bottom:40px;}
.family_mainwrap .f_linewrap:nth-child(3){padding-top:20px;}
.family_afterwrap .f_linewrap{padding-top:20px;}
/* 個人框 */
.f_twopeoplewrap{font-size: 0 ;display:inline-block;position:relative;z-index:1;margin:0;border-radius: 5px;box-shadow: 1px 1px 5px rgba(100,100,100,0.2);background:#fff;}
.f_twopeoplewrap:last-child{margin-right:0!important;}
.f_twopeoplewrap.hide{visibility: hidden;}
.f_people{position:relative;z-index:1;float:left;display:inline-block;width:120px;height:200px;background:#fff;margin:0;border-radius: 5px;overflow:hidden;}
.f_people:first-child{border-right:2px solid #ccc;}
.f_nameselectbox{position:absolute;z-index:3;bottom:3px;left:3%;width:94%;height:24px;}
.f_nameselectbox span{display:inline-block;float:left;font-size:14px;line-height:30px;color:#666;line-height:24px;}
.f_nameselectbox span:nth-child(1){width:30%;}
.f_nameselectbox span:nth-child(2){width:70%;}
.f_nameselectbox:after{clear:both;}
.f_nameselectbox span select{border:none;background:#fff;}
.f_nameselectlist{font-size:14px;line-height:24;color:#666;}
.f_nameselectlist option:checked {color:#444;font-weight:bold;}

/*
.farrow{position:absolute;top:-50px;left:50%;width:2px;height:30px;padding:10px 0;}
.farrow.dn{position:absolute;top:auto;bottom:-50px;left:50%;width:2px;height:30px;padding:10px 0;}
.farrow i{font-size:30px;color:#666;line-height:30px;position:absolute;top:10px;left:-13px;transition: transform 0.6s;text-shadow: 1px 1px 5px rgba(100,100,100,0.2);}
.farrow.on i{	-moz-transform:rotate(180deg);   -webkit-transform:rotate(180deg);   -o-transform:rotate(180deg);   -ms-transform:rotate(180deg); transform:rotate(180deg);}
*/
.farrow{position:absolute;top:-50px;text-align:center;left:50%;width:32px;height:32px;margin:8px 0;transform:translateX(-50%);border-radius: 16px;background:#fff;box-shadow: 1px 1px 5px rgba(100,100,100,0.2);}
.farrow.dn{top:auto;bottom:-50px;}
.farrow i{font-size:30px;color:#678;line-height:32px;transition: transform 0.6s;}
.farrow.on i{	-moz-transform:rotate(180deg);   -webkit-transform:rotate(180deg);   -o-transform:rotate(180deg);   -ms-transform:rotate(180deg); transform:rotate(180deg);}

/* 個人內容 */
.fp_top{height:5px;}
.f_people.m.me{background: rgb(27,26,48);background: linear-gradient(180deg, rgba(27,26,48,0.15) 0%, rgba(80,80,150,0.1) 15%, rgba(255,255,255,0.2) 35%, rgba(255,255,255,1) 100%);}
.f_people.m.me{background: rgb(48,26,27);background: linear-gradient(180deg, rgba(48,26,27,0.15) 0%, rgba(150,80,80,0.1) 15%, rgba(255,255,255,0.2) 35%, rgba(255,255,255,1) 100%);}
.f_people.m .fp_top{background:#3239bf;}
.f_people.f .fp_top{background:#cc4433;}
.fp_head{font-size:26px;line-height:46px;text-align:center;padding:15px 0 5px 0;opacity:0.8;}
.fp_head span{display:inline-block;width:50px;height:50px;border:2px solid #999;border-radius: 27px;overflow: hidden;}
.fp_head span img{width:100%;}
.fp_head i{font-size:30px;line-height:46px;color:#ccc;}
.fp_name{font-size:15px;line-height:22px;color:#666;text-align:center;padding:0px;}
.fp_name a{font-size:15px;line-height:22px;color:#666;}
.fp_name a:hover{font-weight:bold;}
.fp_date{font-size:13px;line-height:20px;color:#222;text-align:center;padding:0;}
.fp_replaceme{font-size:22px;line-height:32px;color:#222;text-align:center;}
.fp_iconwrap{position:relative;width:80%;margin:0 auto;padding:0;}
.fp_icon{position:relative;width:21.3%;height:16px;float:left;margin:1px 6%;text-align:center;}
.fp_icon img{position:relative;width:100%;z-index:1;}
.fp_icon .icontext{position:absolute;display:block;padding:0;z-index:2;top:5px;left:50%;border:1px solid #CCC;width:200%;font-size:12px;line-height:16px;color:#444;text-align: left;background:rgba(255,255,255,0.7);display:none;}
.fp_icon:hover  .icontext{display:block;}
.fp_icon:nth-child(3n) .icontext{left:0;}
.fp_data{font-size:13px;line-height:20px;color:#222;width: 30%;float: left;text-align: center;padding:0;}


/* 主內容 */
/* header */
/* block */
/* footer */
footer{z-index:15;position:fixed;bottom:0;left:0;width:100%;padding:20px 0;background:#226699;50px;}
footer p{font-size:13px;line-height:18px;color:#fff;}
/* form */
#popformwrap{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.75);z-index:999;text-align:center;overflow:auto;}
.popformwrap{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.75);z-index:999;text-align:center;overflow:auto;}
.popformbg{position:absolute;}
#popformframepadding{position:relative;padding:1vw 5vw;text-align:center;z-index:1;}
.popformframepadding{position:relative;padding:1vw 5vw;text-align:center;z-index:1;}
#popformframe{position:relative;z-index:1;max-width:1000px;padding:20px 50px;border-top:10px solid #77b4e8;background:rgba(255,255,255,0.97);border-radius: 5px;margin:0 auto;}
.popformframe{position:relative;z-index:1;max-width:1000px;padding:20px 50px;border-top:10px solid #77b4e8;background:rgba(255,255,255,0.97);border-radius: 5px;margin:0 auto;}

.popsplitbox{position:relative;margin:20px 0;}
.popsplitbox:before,.popsplitbox:after {  content: "";  display: table;}
.popsplitbox:after{  clear: both;}
.pop2split{position:relative;border:1px solid #ccc;border-radius:10px;width:47%;margin-right:calc(6% - 4px);margin-bottom:20px;font-size:0;float:left;}
.pop2split:nth-child(2n){margin-right:0;}
.pop2split .formwrap{padding:20px 15px;}
.popformbg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;}
.centerformwrap{max-width:1000px;padding:20px 50px;margin:10px auto;background:rgba(255,255,255,0.97);}
.formhead{border-bottom:5px solid #ccc;padding-bottom:5px;text-align:left;}
.formhead h3{font-size:26px;line-height:40px;color:#444;}
.formwrap h4{font-size:20px;line-height:30px;color:#444;padding-bottom:15px;}
.formhead p{font-size:14px;line-height:20px;color:#777;}
.formhead .titletag{display:inline-block;margin:5px 20px;font-size:14px;line-height:30px;padding:0 10px;border-radius:5px;color:#fff;background:#226699;}
.formwrap{position:relative;text-align:left;padding:20px 0;}
.formsubwrap{position:relative;margin:10px 0;padding:5px 10px;border:2px dotted #ccc;background:#f5f5f5;border-radius:10px;}
.forminwrap{position:relative;margin:0 0 20px 20px;padding:5px 10px;background:#fff;border-radius:10px;}
.formwrap .formline {min-height:30px;position:relative;padding:16px 0 5px 0;}
.formwrap .formsubline{min-height:30px;position:relative;padding:16px 0 5px 0;margin-left:30px;}
.inlinebtn{cursor:pointer;padding:0 20px;float:right;}
.inlinebtn .fa{transition: transform 0.3s;}
.forminwrap.on .fa{transform:rotate(180deg);}

.forminwrap .formline{display:none;border-bottom:1px solid #ccc;}
.forminwrap .formline:last-child{border-bottom:0;}
.forminwrap.on .formline{display:block;}

.formwrap .formline span{display:inline-block;vertical-align: top;color:#444;font-size:16px;line-height:30px;}
.formwrap.style1 .formline span{display:inline-block;padding:0 2%;}
.formwrap .formline  input[type=text],.formwrap .formline  input[type=password],.formtable td input[type=password]{width:99%;padding:0 0.5%;font-size:16px;line-height:28px;background:none!important;border:1px solid #ccc;}
.formwrap .formline select{width:100%;padding:0 0.5%;font-size:16px;line-height:28px;background:none!important;border:1px solid #ccc;}
.formwrap .formline span.split2 input[type=text],.formwrap .formline span.split2 input[type=password]{width:46%;margin-right:2%;float:left;}
.formwrap .formline span.split2 input[type=text]:last-child,.formwrap .formline span.split2 input[type=password]:last-child{margin-right:0;float:right;}
.formwrap .formline span.split2 select{width:47%;margin-right:4%;float:left;}
.formwrap .formline span.split2 select:last-child{margin-right:0;float:right;}
.formwrap .formline span.split3 input[type=text],.formwrap .formline span.split3 input[type=password]{width:30%;margin-right:2.5%;float:left;}
.formwrap .formline span.split3 input[type=text]:last-child,.formwrap .formline span.split3 input[type=password]:last-child{margin-right:0;float:right;}
.formwrap .formline span.split3 select{width:31%;margin-right:2.5%;float:left;}
.formwrap .formline span.split3 select:last-child{margin-right:0;float:right;}
.formwrap .delbtn{display:inline-block;font-size:14px;line-height:30px;padding:0 10px;border-radius:5px;color:#fff;background:#996622;}
.formwrap .addbtn{display:inline-block;font-size:14px;line-height:30px;padding:0 10px;border-radius:5px;color:#fff;background:#226699;}
.formwrap .formline  textarea{width:99%;padding:0 0.5%;height:100px;font-size:16px;line-height:22px;background:none!important;border:1px solid #ccc;}
.formwrap .formline  input[type=submit]{padding:0;font-size:16px;line-height:30px;color:#fff;background:#444;float:right;margin-left:40px;padding:0 40px;}
.formwrap .formline .formerror{position:absolute;top:0;left:17%;padding:0 2%;width:45%;font-size:13px;line-height:16px;color:#A55;font-weight:bold;}
.formwrap.style1 .formline span:first-child{width:12%;}
.formwrap.style1 .formline span:nth-child(2){width:45%;}
.formwrap.style1 .formline span:nth-child(3){width:30%;font-size:13px;line-height:20px;color:#777;}
.formwrap.textstyle h3{font-size:26px;line-height:40px;padding:10px 0;color:#666;border-bottom: 3px solid #ccc;}
.formwrap.textstyle h4{font-size:20px;line-height:30px;padding:5px 0;color:#222;}
.formwrap.textstyle h5{font-size:15px;line-height:22px;color:#222;}
.formwrap.textstyle p{font-size:15px;line-height:22px;color:#666;padding:5px 0;margin:0;}
.formwrap.textstyle p.s{font-size:13px;line-height:20px;color:#999;}
.formwrap.textstyle a{color:#882222;}
.formwrap.textstyle .btn{position:relative;display:inline-block;padding:3px 10px;font-size:16px;line-height:24px;color:#fff;background:#666;border-radius: 10px;margin:0 0 0 30px;}
.formwrap.textstyle .btn:hover{background:#964;}
.formwrap.textstyle .popcard{position:relative;}
.formwrap.textstyle .popcard .left{position:relative;float:left;width:80px;}
.formwrap.textstyle .popcard .right{position:relative;padding-left:20px;float:left;width:calc(100% - 110px);}
.formwrap.textstyle .popcard .fp_head{font-size:26px;line-height:46px;text-align:center;padding:10px 0;opacity:0.8;}
.formwrap.textstyle .popcard .fp_head span{display:inline-block;width:80px;height:80px;border:2px solid #999;border-radius: 42px;overflow: hidden;}
.formwrap.textstyle .popcard .fp_name{font-size:24px;line-height:32px;color:#666;text-align:left;padding:0;padding-bottom:5px;}
.formwrap.textstyle .popcard .cardline{position:relative;padding:3px 0;text-align:left;}
.formwrap.textstyle .popcard .cardline span{display:inline-block;font-size:15px; line-height:20px;color:#222;}
.formwrap.textstyle .popcard .cardline span:nth-child(1){width:30%;}
.formwrap.textstyle .popcard.cardline span:nth-child(2){width:65%;}
/* popcard 個人名片 */
#popcardoutwrap{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;text-align:center;overflow:auto;}
#popcardwrapbg{position:absolute;z-index:0;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.1);}
#popcardwrap{position:absolute;z-index:10;height:250px;width:400px;margin-top:-20px;margin-left:120px;border-radius: 5px;background:#fff;box-shadow: 1px 1px 5px 5px rgba(0,0,0,0.1);}
#popcardwrapin{position:absolute;z-index:1;top:0;left:0;width:100%;height:100%;border-radius: 5px;background:#fff;overflow:hidden;}
#popcardarr{position:absolute;z-index:0;top:20px;left:-10px;width:50px;height:50px;transform:rotate(45deg);background:#fff;box-shadow: 1px 1px 5px 5px rgba(0,0,0,0.1);}
#popcardinfobox{position:relative;padding:10px 30px;}
.popcard_top{height:8px;}
.popcard_bottom{position:absolute;bottom:0;left:0;height:8px;width:100%;z-index:2;}
.popcard_top.m,.popcard_bottom.m{background:#3239bf;}
.popcard_top.f,.popcard_bottom.f{background:#cc4433;}
#popcardinfotop{position:relative;}
#popcardinfotop .left{position:relative;float:left;width:80px;}
#popcardinfotop .right{position:relative;padding-left:20px;float:left;width:calc(100% - 110px);}
#popcardinfotop .fp_head{font-size:26px;line-height:46px;text-align:center;padding:10px 0;opacity:0.8;}
#popcardinfotop .fp_head span{display:inline-block;width:80px;height:80px;border:2px solid #999;border-radius: 42px;overflow: hidden;}
#popcardinfotop .fp_name{font-size:24px;line-height:32px;color:#666;text-align:left;padding:0;padding-bottom:5px;}
#popcardinfotop .cardline{position:relative;padding:3px 0;text-align:left;}
#popcardinfotop .cardline span{display:inline-block;font-size:15px; line-height:20px;color:#222;}
#popcardinfotop .cardline span:nth-child(1){width:30%;}
#popcardinfotop .cardline span:nth-child(2){width:65%;}
#popcardinfobottom{position:absolute;bottom:8px;left:0;Background:#f5f5f5;width:100%;z-index:2}
#popcardinfobottom .cardline{position:relative;padding:10px 0;text-align:left;}
#popcardinfobottom .cardline .btn{position:relative;display:inline-block;padding:3px 10px;font-size:16px;line-height:24px;color:#fff;background:#999;border-radius: 10px;margin:0 0 0 30px;}
#popcardinfobottom .cardline .btn:hover{background:#669;}
/*手機板*/
@media screen and (max-width: 1000px) {
  header{min-width:auto;}
  .centerwrap{width:90%;margin:0 5%;}
  #popformframepadding{position:relative;padding:5vw 5vw;}
  .popformframepadding{position:relative;padding:5vw 5vw;}
  #popformframe{position:relative;padding:3vw 5vw;}
  .popformframe{position:relative;padding:3vw 5vw;}
  /* index */
  #i_container h3{font-size:6vw;line-height:9vw;color:#666;padding:5vw 0;}
  #i_container p{font-size:4vw;line-height:6vw;padding:5vw 0;}
  #i_container .btnwrap{text-align:center;padding:5vw 0;}
  #i_container .btnwrap div{display:inline-block; padding:0 5vw;margin:0 3vw;background:#226699;border-radius: 2vw;color:#fff;font-size:4vw;line-height:8vw;}
}
@media screen and (max-width: 800px) {
  #popformframepadding{position:relative;padding:10vw 5vw;}
  .popformframepadding{position:relative;padding:5vw 5vw;}
}
