@charset "utf-8";
/*Background_setting*/
*{ margin:0; padding:0; line-height:100%; font-family:"微軟正黑體",Arial; box-sizing:border-box;}
*:focus { outline: none;}
::selection{ background-color:#8c004c; color:#fff;}
a{ text-decoration:none;}
/*header*/
.header{ width:100%; height:125px; background-color:#8c004c; box-shadow:0 5px 7px 0 rgba(0,0,0,.2); position:fixed; top:0; left:0; z-index:99;}
.left_block{ display:inline-block;}
.left_block .logo{ height:125px; padding-left:22px;}
.mobile_menu{ display:none;}
.right_block{ position:absolute; display:inline-block; top:0; right:0;}
.right_block .menu{ height:125px; display:inline-block; text-align:center; margin-right:30px; padding-top:30px; transform:scale(1); transition:.2s;}
.right_block .menu:hover{ transform:scale(1.2); transition:.2s;}
.right_block .menu img{ max-width:100%;}
.right_block .menu p{ font-size:17px; color:#fff; display:block; padding-top:10px;}
/*footer*/
.footer{ background-color:#444; border-bottom:5px solid #8c004c; text-align:center; padding:30px 20px; position:relative;}
.footer .ftt{ font-size:15px; color:#fff; line-height:25px;}
.footer .ftt a{ color:#fff;}
.link_block{ display:block; text-align:center; margin:auto;}
.link_block .link{ display:inline-block; background-color:#666; border-radius:5px; margin:0 10px 0 10px; padding:8px 13px; font-size:15px; color:#fff; transform:scale(1); transition:.2s;}
.link_block .link:hover{ transform:scale(1.1); transition:.2s;}

/*contact*/
.frame{ width:100%; height:100%; display:block; padding-top:125px;}
.music_btn{ font-size:17px; color:#fff; background-color:#333; position:fixed; bottom:15px; right:35px; display:inline-block; padding:5px 10px 5px 30px; border-radius:5px; transition:.3s;}
.music_btn:hover{ background-color:#8c004c; transform:scale(1.1); transition:.2s;}
.music_btn::before{ content:""; display:inline-block; border-style:solid; border-width:6px 10px; border-color:transparent transparent transparent #fff; position:absolute; top:50%; left:10px; margin-top:-6px;}
.music_btn02{ font-size:17px; color:#fff; background-color:#333; position:fixed; bottom:15px; right:35px; display:inline-block; padding:5px 10px 5px 30px; border-radius:5px; transition:.3s;}
.music_btn02:hover{ background-color:#8c004c; transform:scale(1.1); transition:.2s;}
.music_btn02::before{ content:""; display:inline-block; width:1px; height:15px; position:absolute; top:6px; left:13px; background-color:#fff;}
.music_btn02::after{ content:""; display:inline-block; width:1px; height:15px; position:absolute; top:6px; left:18px; background-color:#fff;}
.wrapper{ display:block; padding:0 0 50px 0;}
.banner{ width:100%; position:relative; z-index:-1;}
.banner_image{ width:100%; height:660px; position:relative; overflow:hidden;}
.banner_image img{ width:1920px; position:absolute; top:0; left:50%; margin-left:-960px;}
.white_cover{ width:100%; height:380px; display:block; position:absolute; left:0; bottom:0; background:-moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.01) 1%, rgba(255,255,255,1) 100%); background:-webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(255,255,255,1) 100%); background:linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(255,255,255,1) 100%);}
.page_title{ position:absolute; top:140px; left:0; right:0; margin:auto; display:inline-block; z-index:10;}
.page_title .ch{ font-size:45px; color:#fff; text-align:center; text-shadow:0 2px 5px rgba(0,0,0,.3); padding-bottom:5px;}
.page_title .en{ font-size:25px; color:#fff; text-align:center; text-shadow:0 2px 3px rgba(0,0,0,.3);}
.content{ max-width:1210px; width:100%; margin:-300px auto 0 auto; padding:0 20px;}
.edit_block{ width:100%; background-color:#fff; border-radius:10px; padding:40px;}
.paragraph_title{ font-size:25px; color:#8c004c; padding-bottom:10px; line-height:30px;}
.ctt{ display:block;}
.ctt p, .ctt span, .ctt em, .ctt u, .ctt strong{ font-size:16px; color:#333; line-height:36px; padding-bottom:10px;}
.ctt img{ max-width:100%;}
.fs{ font-size:0;}
@media screen and ( max-width: 1023px) and ( min-width: 768px) {
/*header*/
.header{ height:62px;}
.left_block .logo{ height:62px;}
.left_block .logo img{ height:62.5px;}
.mobile_menu{ width:62px; height:62px; text-align:center; display:inline-block; position:absolute; top:0; right:0; padding-top:17px;}
.mobile_menu p{ display:block; width:30px; border-top:2px solid #fff; padding-bottom:10px; margin:0 auto;}
.right_block{ display:inline-block; background-color:#333; position:absolute; top:62px; z-index:99;}
.right_block .menu{ height:auto; padding:20px; margin:auto; display:block;}
.right_block .menu img{ width:19.5px; vertical-align:text-bottom; margin-right:5px;}
.right_block .menu p{ display:inline-block; padding:0;}

/*contact*/
.frame{ padding-top:62px;}
.edit_block{ padding:20px;}
}

@media screen and ( max-width: 767px) {
/*header*/
.header{ height:62px;}
.left_block .logo{ height:62px; padding-left:10px;}
.left_block .logo img{ height:62.5px;}
.mobile_menu{ width:62px; height:62px; text-align:center; display:inline-block; position:absolute; top:0; right:0; padding-top:17px;}
.mobile_menu p{ display:block; width:30px; border-top:2px solid #fff; padding-bottom:10px; margin:0 auto;}
.right_block{ display:inline-block; background-color:#333; position:absolute; top:62px; z-index:99;}
.right_block .menu{ height:auto; padding:20px; margin:auto; display:block;}
.right_block .menu img{ width:19.5px; vertical-align:text-bottom; margin-right:5px;}
.right_block .menu p{ display:inline-block; padding:0;}
/*footer*/
.footer{ padding:30px 10px;}
.footer .ftt{ text-align:left;}

/*contact*/
.frame{ padding-top:62px;}
.banner_image{ height:330px;}
.banner_image img{ width:960px; margin-left:-480px;}
.white_cover{ height:230px;}
.page_title{ top:60px;}
.page_title .ch{ font-size:35px;}
.page_title .en{ font-size:18px;}
.content{ margin:-150px auto 0 auto; padding:0 10px;}
.edit_block{ padding:10px;}
.ctt p{ font-size:15px; line-height:30px; padding-bottom:15px;}
}