html,body {margin: 0; padding: 0;}
.link{cursor: pointer;}
.all{
    font-family:PingFangTC-Regular,微軟正黑體,sans-serif;
    min-width:1200px;
    position:absolute;
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: auto;
}
.header {
    position: relative;
    width: 100%;
    height: 75px;
    margin-top: 0px;
    left: 0px;
    text-align: center;
    overflow: hidden;
    z-index: 400;
    background-color: #252525;
    display: flex;
    align-items:center;
    justify-content:space-between;
}
.Logo{
    margin-left: 100px;
    width: 137px;
    height: 50px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 137px auto;
    background-image: url(../../../Self-Study/images/FUNDAY_LOGO_W.png);
}
.btn{
    float: left;
    margin-left: 20px;
    font-size: 22px;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 30px;
    letter-spacing: 1.7px;
    text-align: center;
    color: #ffffff;
}
.btnborder{
    border-radius: 19px;
    border: #FFFFFF solid;
    margin-right: 100px;
    padding-left: 20px;
    padding-right: 20px;
    height: 30px;
    margin-top: -3px;
}
.contentFull{
    position: relative;
    width: 100%;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden;    
}
.area1{
    position: relative;
    height:calc(100vh - 75px) ;
    background: url('../images/FUNDAY_pc_product_intro_banner.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;    
    width: 100%;
    min-height: 500px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    display: flex;
    align-items: center;
    justify-content: center;    
}

.area1 .Slogn{
    width: 100%;
    height: 40px;
    font-size: 2.4em;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.71;
    letter-spacing: 3.2px;
    text-align: center;
    color: #ffffff;
}
.area1 .ItemList{
    position: relative;
    max-width: 1200px;
    min-width: 1200px;
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;  
    height: 500px;
    overflow: hidden; 
    display: flex;
    justify-content: center;
    align-content: space-between;
    flex-wrap: wrap;    
}
.Item1{
    background: url('../images/FUNDAY_pc_product_intro_btn_learning_normal.png');
}
.Item5{
    background: url('../images/FUNDAY_pc_product_intro_btn_mobilelearn_normal.png');
}
.Item2{
    background: url('../images/FUNDAY_pc_product_intro_btn_pronunciation_normal.png');
}
.Item3{
    background: url('../images/FUNDAY_pc_product_intro_btn_test_normal.png');
}
.Item4{
    background: url('../images/FUNDAY_pc_product_intro_btn_track_normal.png');
}
.Item1:hover{
    background: url('../images/FUNDAY_pc_product_intro_btn_learning_hover.png');
}
.Item5:hover{
    background: url('../images/FUNDAY_pc_product_intro_btn_mobilelearn_hover.png');
}
.Item2:hover{
    background: url('../images/FUNDAY_pc_product_intro_btn_pronunciation_hover.png');
}
.Item3:hover{
    background: url('../images/FUNDAY_pc_product_intro_btn_test_hover.png');
}
.Item4:hover{
    background: url('../images/FUNDAY_pc_product_intro_btn_track_hover.png');
}
.Item1:active{
    background: url('../images/FUNDAY_pc_product_intro_btn_learning_pressed.png');
}
.Item5:active{
    background: url('../images/FUNDAY_pc_product_intro_btn_mobilelearn_pressed.png');
}
.Item2:active{
    background: url('../images/FUNDAY_pc_product_intro_btn_pronunciation_pressed.png');
}
.Item3:active{
    background: url('../images/FUNDAY_pc_product_intro_btn_test_pressed.png');
}
.Item4:active{
    background: url('../images/FUNDAY_pc_product_intro_btn_track_pressed.png');
}
.Item1,.Item2,.Item3,.Item4,.Item5,.Item1:hover,.Item2:hover,.Item3:hover,.Item4:hover,.Item5:hover,.Item1:active,.Item2:active,.Item3:active,.Item4:active,.Item5:active{
    position: relative;
    float: left;
    margin-top: 5%;
    margin-left:calc((100% - (200px * 5)) /6); 
    width: 200px;
    height: 264px;
    background-position: center;
    background-size: 200px auto;
    background-repeat: no-repeat;
}
.area3-1,.area3-2,.area3-3,.area3-4,.area3-5{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;    
    width: 100%;
    height:50vh;
    min-height: 440px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    background-color: #f9f9f9;       
}
.area3-2,.area3-4{background-color: #ffffff;}
.area3-1 .ItemList,.area3-2 .ItemList,.area3-3 .ItemList,.area3-4 .ItemList,.area3-5 .ItemList{
    position: relative;
    margin: 0 auto;
    max-width: 1200px;
    min-width: 1200px;
    width: 100%;  
    overflow: hidden; 
    height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.TSlogn{
    font-size: 2em;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    /*line-height: 1.71;*/
    letter-spacing: 1.1px;
    text-align: left;
    color: #232323;
    margin-left: 5%;
}
.TSubSlogn{
    opacity: 0.86;
    font-size: 1.4em;
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 1.75;
    letter-spacing: 1.8px;
    text-align: left;
    color: rgba(35, 35, 35, 0.86);
    height: 8vh;
    /*display: flex;*/
    align-items: center;
    margin-left: 5%;
}
.TButton{
    position: relative;
    margin: 0 auto;
    float: left;
    width: 200px;
    height: 38px;
    border-radius: 29px;
    box-shadow: -6.8px 12.2px 21.1px 0.9px rgba(27, 19, 16, 0.16);
    background-color: #f74768;
    font-size: 1.2em;
    font-style: normal;
    font-stretch: normal;
    line-height: 38px;
    letter-spacing: 2.6px;
    text-align: center;
    color: #ffffff;
    cursor: pointer;
    margin-left: 5%;
}
.TButton:hover{
    background-color: #fe7679;  
}
.TButton:active{
    box-shadow:none;
}
.area4{
    position: relative;
    width: 100%;
    height:200px;
    min-height: 200px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;  
}
.area4{
    background: url('../images/FUNDAY_pc_product_intro_bg_understand.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.area4 .Slogn{
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 35px;
    font-size: 2em;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    letter-spacing: 2.7px;
    text-align: center;
    color: #ffffff;
}
.JButton{
    position: relative;
    margin: 0 auto;
    margin-top: 25px;
    width: 200px;
    height: 38px;
    border-radius: 29px;
    box-shadow: -6.8px 12.2px 21.1px 0.9px rgba(27, 19, 16, 0.16);
    background-color: #fff5f5;
    font-size: 1.2em;
    font-style: normal;
    font-stretch: normal;
    line-height: 38px;
    letter-spacing: 2.6px;
    color: #f74768;
    text-align: center;
    cursor: pointer;
}
.JButton:hover{
    background-color: #ffffff;
}
.JButton:active{
    box-shadow:none;
}
.area5{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;    
    width: 100%;
    height: 1066px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    background-color: #ffffff;
       
}
.area5 .ItemList,.area6 .ItemList,.area7 .ItemList{
    position: relative;
    margin: 0 auto;
    max-width: 1200px;
    min-width: 1200px;
    width: 100%;  
    height: auto;
    overflow: hidden; 
}
.area5 .Slogn,.area6 .Slogn,.area7 .Slogn{
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 42px;
    font-size: 2.1em;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 42px;
    letter-spacing: 3.2px;
    text-align: center;
    color: #232323;
}
.Price{
    position: relative;
    margin: 0 auto;
    margin-top: 50px;
    width: 100%;
    height:auto;
    min-height: 855px;    
    background: url('../images/FUNDAY_pc_buy_page_form.png');
    background-position: center;
    background-size: auto 855px;
    background-repeat: no-repeat;
}

.area6{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;    
    width: 100%;
    height: 1150px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    background-color: #fff5f7;
       
}

.plan_contents{
    position: relative;
    margin: 0 auto;
    margin-top: 50px;
    width: 100%;
    height:auto;
    min-height: 280px;    
    background: url('../images/FUNDAY_pc_buy_page_plan_contents_circle.png');
    background-position: center;
    background-size: auto 280px;
    background-repeat: no-repeat;  
}
.Product{
    position: relative;
    margin: 0 auto;
    margin-top: 50px;
    width: 100%;
    height:auto;
    display: flex;
    align-items: center;
    justify-content: center;  
}
.ProDiv{background: url('../images/FUNDAY_pc_buy_page_plan_board.png');}
.ProDiv2{background: url('../images/FUNDAY_pc_buy_page_plan_bestchoice_board.png');}
.ProDiv,.ProDiv2{
    position: relative;
    float: left;
    margin-left: 30px;
    width: 286px;
    height: 590px;
    background-position: center;
    background-size: 286px 590px;
    background-repeat: no-repeat;   
}
.Pname{
    position: relative;
    margin: 0 auto;
    margin-top: 25%;
    width: 100%;
    height: 34px;
    font-size: 1.8em;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 34px;       
    text-align: center;
    color: #232323;
}
.Pamount{
    position: relative;
    margin: 0 auto;
    margin-top: 20%;
    width: 100%;  
    font-family: sans-serif;
    font-size: 2.5em;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 57.5px;
    letter-spacing: 2.3px;
    text-align: center;
    color: #f74768;     
}
.Pday{
    position: relative;
    margin: 0 auto;
    margin-top: 5%;
    width: 100%;  
    font-family:PingFangTC-Regular,微軟正黑體,sans-serif;
    opacity: 0.86;
    font-size: 1.2em;
    font-weight: normal;
    font-style:oblique;
    font-stretch: normal;
    line-height: 24px;
    letter-spacing: 1.8px;
    text-align: center;
    color: rgba(247, 71, 104, 0.86);        
}
.PGift{
    position: relative;
    margin: 0 auto;
    margin-top: 5%;
    width: 100%;  
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;    
}
.PGift .free{   
    position: relative;
    background: url('../images/FUNDAY_pc_buy_page_plan_free_icon.png');
    width: 40px;
    height: 40px; 
    background-position: center;
    background-size: 40px 40px;
    background-repeat: no-repeat;   
}
.g-name{
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
    font-size: 1.2em;
    width: 85px;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 22px;
    letter-spacing: 1.7px;
    text-align: left;
    color: rgba(35, 35, 35, 0.86);
}
.g-amount{
    position: relative;
    font-size: 1.2em;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    width: 85px;
    font-family: sans-serif;
    font-weight: bold;
    font-style: normal;
    font-stretch: normal;
    line-height: 20.5px;
    letter-spacing: 0.8px;
    text-align: left;
    color: #f74768;
}

.PGift .g1{ width:  111px;height: 150px; background: url('../images/FUNDAY_pc_buy_page_plan_4800_freebie.png');}
.PGift .g2{ width:  107px;height: 129px; background: url('../images/FUNDAY_pc_buy_page_plan_5980_freebie.png');}
.PGift .giftP{ 
    width: 90px;
    height: 100%;
    position: relative;
    background-position: center;
    background-size: 100% auto;
    background-repeat: no-repeat;   
}
.PButton ,.VButton{
    position: relative;
    margin: 0 auto;
    width: 200px;
    height: 49px;
    border-radius: 29px;
    box-shadow: -6.8px 12.2px 21.1px 0.9px rgba(27, 19, 16, 0.16);
    background-color: #f74768;
    font-size: 1.5em;
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
    line-height: 49px;
    letter-spacing: 2.6px;
    text-align: center;
    color: #ffffff;
    cursor: pointer;
}
.PButton:hover,.VButton:hover{
    background-color: #fe7679;  
}
.Pmemo{
    position: relative;
    margin: 0 auto;
    margin-top: 8%;
    width: 100%;
    font-size: 0.8em;
    font-weight: 500;
    font-style: normal;
    font-stretch: normal;
    line-height: 16px;
    letter-spacing: 0.8px;
    text-align: center;
    color: rgba(57, 56, 56, 0.86);  
}
.area7{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;    
    width: 100%;
    height: 1000px;
    margin-top: 0px;
    margin: 0 auto;
    overflow: hidden; 
    background-color: #ffffff;
}
.area7 .demarcation{
    position: relative;
    margin: 0 auto;
    margin-top: 40px;
    width: 174px;
    height: 10px; background: url('../images/FUNDAY_mobile_buy_page_video_demarcation.png');
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
}
.area7 .SubSlogn{
    position: relative;
    margin: 0 auto;
    margin-top: 40px;
    width: 100%;
    height: 26px;
    font-size: 26px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 26px;
    letter-spacing: 3.2px;
    text-align: center;
    color: rgba(35, 35, 35, 0.86);
}
.area7 .FormBG{
    position: relative;
    margin: 0 auto;
    margin-top: calc(100px - 64px);
    width: 100%;
    height: 530px; background: url('../images/FUNDAY_pc_buy_page_buyer_fillin_line.png');
    background-position: center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;      
}
.area7 .Title{
    position: relative;
    margin: 0 auto;
    top: 68px;
    width: 510px;
    height: 24px;
    padding: 20px;
    font-size: 24px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 24px;
    letter-spacing: 1.8px;
    text-align: center;
    color: #f74768;
    background-color: #ffffff;
    z-index: 2;
}
.FormBG table{
    width:calc(1160px * 0.9);
}
.FormBG td{
    height: 100px;
}
.VButton{
    margin-top: 40px;
}
.area7 .Tborder{
    position: relative;
    margin: 0 auto;
    width: 90%;
    height: 66px;
    border-radius: 3px;
    border: 1px solid #cccccc;  
    display: flex;
    align-items: center;
    justify-content:space-between;     
}
.area7 .Textbar{
    float: left;
    left: 0px;
    width: 25%;
    height: 64px;
    font-size: 24px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 64px;
    letter-spacing: 1.8px;
    text-align: right;
    color: rgba(35, 35, 35, 0.66);
}
.area7 .Nbroder{justify-content:flex-start;  border: 0px; }
.area7 input:focus { outline: none; }
.area7 input{
    outline:none;
    float: right;
    right: 0px;
    width: 70%;
    height: 63px;
    border: 0px solid #cccccc;
    background-color: #ffffff;
    font-size: 24px;
    color: #232323;
}
.area7 .sex{
    position: relative;
    left: 20px;
    margin-left: 20px;
    width: 64px;
    height: 64px; 
    border-radius: 3px;
    border: 1px solid #cccccc;
    background-color:#FFFFFF;
    font-size: 24px;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: 64px;
    letter-spacing: 1.8px;
    text-align: center;
    color: #232323; 
    cursor: pointer;
}

.area7 .sexC{
    background-color: #f74768;
    color: #ffffff; 
}