@charset "utf-8";
/* CSS Document */

body {
	background-color: #d86d8e;
}
/*=============== header ===============*/
header {
	background-image: url(../img/pages/topimg_8.jpg);
}
.headimg{
    background-image: url(../img/pages/chara_p8.png);
    background-position: bottom;
    width: 270px;
    height: 360px;
    margin-right: -500px;
}
/*=============== header end ===============*/
/*=============== 右邊內容區 ===============*/
.content {
    background-color: #efe470;
}
h2{
    color: #d25179;
}
h2:before {
    background-image: url(../img/pages/h2icon_p8.png);
}
iframe{
    width: 100%;
    height: 50vw;
    min-height: 350px;
}
/*=============== 右邊內容區 end ===============*/
/*=============== 麵包屑 ===============*/

.crumbs span{
    color: #d86d8e;
}
/*=============== 麵包屑 end ===============*/
/*=============== 選單 ===============*/

.p8:after {
    content: "";
    display: block;
    position: relative;
    right: -270px;
    width: 10px;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid #d56b8a;
}
/*=============== 選單 end ===============*/
/*=============== footer ===============*/
footer {
    background-color: #d86d8e;
}
footer:before {
    background-image: url(../img/pages/footerimg_8.png);
    width: 63px;
    height: 85px;
    margin-top: -50px;
}
footer div p {padding: 30px 5%;}
/*=============== footer end ===============*/


/*=============== RWD RWD RWD ===============*/


/*1280以下*/
@media screen and (max-width: 1280px) {
    .headimg{
        width: 200px;
        height: 270px;
        margin-right: -390px;
    }
}

@media screen and (max-width: 1024px){
    .worksheet_title span{
        margin-top: 12vw;
    }
    .worksheet_title:hover span{
        padding: 14px 0 50px;
        margin-top: 11vw;
    }
}

@media screen and (max-width: 1000px){
    .headimg{
        margin-right: -300px;
    }
    .worksheet_title{height: 20vw;}
    .worksheet_title div{height: 20vw;}
    .worksheet_title span{margin-top: 16vw;}
    .worksheet_title:hover span{margin-top: 15vw;}
    iframe{
        height: 65vw;
    }
}

/*768以下*/
@media screen and (max-width: 768px){
    .headimg{
        margin-right: -250px;
    }
    .worksheet_title span{
        font-size: 100%;
        padding-top: 4px;
    }
    .worksheet_title:hover span{
        padding-top: 4px;
    }
}

/*640以下*/
@media screen and (max-width: 640px){
    .headimg{display: none;}
    header{background-position: 44%;}
    .worksheet_title{
        width: 100%;
        height: 46vw;
    }
    .worksheet_title div{height: 46vw;}
    .worksheet_title span{
        margin-top: 36vw;
        font-size: 5vw;
        padding-top: 2vw;
    }
    .worksheet_title:hover span{
        margin-top: 34vw;
    }

    .worksheet_title{    box-shadow: 0px 6px 0 #c4b27a;}

    iframe {
        height: 80vw;
    }

}
/*480以下*/
@media screen and (max-width: 480px){
    header{background-position: 28%;}
    .submn a{font-size: 120%;}
    .worksheet_title span{
        margin-top: 34vw;
        font-size: 5vw;
        padding-top: 1vw;
    }
    .worksheet_title:hover span{
        margin-top: 33vw;
    }


}