body {
    position: relative;
    width: 1440px;
    height: 2000px;
    background: #BCBCBC;
    font-family: 'Noto Serif TC', serif;
    font-family: 'Noto Sans TC', sans-serif;
}
 /*這邊是header*/
 div.position-fixed {
    width: 100%;
    height: 75px;
    background-color: red;
    top: 0px;
    left:0px;
}
.position-fixed {
    position: fixed;
    z-index: 2;

}

.div.title-block-left {
    width: 266px;
    height: 100px;
    background-color: red;
}


.title-block-right {
    width: 100px;
    height: 40px;
    background-color: #850000;
    margin-right: 50px;
    margin-top: 15px;
    position: relative;
    float: right;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    font-family: 'Noto Serif TC', serif;
}

/*並排母容器*/
.ccle {
    margin: 0px auto;
    text-align: center;
    max-width: 1040px;
}

.div-with {
    display: inline-block;
    /*讓div並排*/
    vertical-align: top;
    /*就算個個div行數不同，也一律向上對齊*/
    width: 257px;
    height: 303px;
    border: 0px solid black;
    border-radius: 3px;
    margin: 2px;
    margin: 30px;
}

.div-inline-div {
    width: 257px;
    height: 80px;
    background-color: #DBDBDB;
    margin-top: 0px;
    text-align: center;
}

.div-inline-div-a {
    font-size: 18px;
    line-height: 35px;
    color: black;
    font-family: 'Noto Serif TC', serif;
    margin-top: 10px;




}

.headphoto {
    width: 300px;
    height: auto;
}

.introduce {
    width: 102px;
    height: 48px;
    position: absolute;
    font-family: 'Noto Serif TC', serif;
    background-color: #CA0202;
    color: white;
    font-size: 24px;
    line-height: 48px;
    text-align: center;

}
.cover>img {
    object-fit: cover;
  }

div.title1{
        display: block;
        font-size: 48px;
        line-height: 56px;
        color: rgba(202, 2, 2, 0.75);
        font-family: 'Noto Serif TC', serif;
        left: 43.2%;
        position: absolute; width: 14.02%; height: 1.1904%;  top: 750px;   
}

div.back1{
    position: absolute;
width: 375px;
height: 426px;
left: 775px;
top: 892px;
background: #DBDBDB;
z-index:0;
}

div.bigbox1{
    display:flex;
    width: 862px;
    height: 426px;
    margin:210 290 0 288;
    align-items: center;
    flex-wrap: nowrap;
    z-index:1;
}

div.wang{
    width: 576px;
    height: 323px;
    margin: 52 36 51 0;
    z-index:1;
}

div.box1{
    display: flex;
    width: 227px;
    height: 369px;
    flex-direction: column;
}

div.subtitle1{
width: 145px;
height: 37px;
font-family: 'Noto Sans TC', sans-serif;
margin: 0 80 18 0;
font-size: 36px;
line-height: 42px;
color: #CA0202;
z-index:1;
}

div.text1{
width: 225px;
height: 313px;
font-family: 'Noto Sans TC', sans-serif;
font-size: 24px;
line-height: 28px;
color: #000000;
margin: 18 0 0 0 ; 
z-index:1;
}


div.back2{
    position: absolute;
    width: 375px;
    height: 375px;
    left: 288px;
    top: 1400px;
    background: #DBDBDB;
    z-index: -1;
}

div.bigbox2{
    display:flex;
    width: 862px;
    height: 375px;
    margin:82 290 0 288;
    align-items: center;
    flex-wrap: nowrap;
    z-index:1;
}

div.huang{
    width: 576px;
    height: 323px;
    margin: 25 0 27 32;
    z-index:1;
}

div.box2{
    display: flex;
    width: 218px;
    height: 272px;
    flex-direction: column;
    margin: 21 0 82 38;
}

div.subtitle2{
width: 193px;
height: 37px;
font-family: 'Noto Sans TC', sans-serif;
margin: 0 69 45 0;
font-size: 36px;
line-height: 42px;
color: #CA0202;
z-index:1;
}

div.text2{
width: 218px;
height: 272px;
font-family: 'Noto Sans TC', sans-serif;
font-size: 24px;
line-height: 28px;
color: #000000;
margin: 0 0 0 0 ; 
z-index:1 ;
}

@media only screen and (max-width: 768px) {
    body {
        position: relative;
        width: 768px;
        height: 4217.6px;
        background: #BCBCBC;
        font-family: 'Noto Serif TC', serif;
        font-family: 'Noto Sans TC', sans-serif;
    }
    
/*這邊都是header的*/
.headphoto {
    width: 200px;
    height: auto;
    margin-top: 20px;

}

.headtop {
    background-color: red;
    width: 100%;
    height: 70px;
    position: fixed;
    z-index: 2;


}

.title-block-right {

    width: 70px;
    height: 40px;
    background-color: #850000;
    position: relative;
    text-align: center;
    line-height: 40px;
    font-size: 12px;
    float: none;
    display: inline-flex;
    margin-left: 20px;
    margin-bottom: 20px;
    margin-right: 20px;
    margin-top: 20px;
}

div.position-fixed {
    width: 100%;
    height: 75px;
    background-color: red;
    bottom: 0px;
}

.headphoto2 {
    width: 40%;
    height: auto;
    margin: 0 auto;
    position: relative;
    display: block;
    top: 20%;

}

.ccle2 {
    margin: 0px auto;
    text-align: center;

}

.headphoto {
    width: 0px;
    height: auto;
    margin-top: 20px;

}

.ccle2 div {
    display: inline-block;
    vertical-align: center;

}

/*header到這邊為止*/

    div.title1{
        display: block;
        font-size: 48px;
        line-height: 56px;
        color: rgba(202, 2, 2, 0.75);
        font-family: 'Noto Serif TC', serif;
        position: absolute;
        width: 207px;
        height: 51.2px;
        left: 128px;

}

    div.back1{
    width: 0px;
    background: none;
    z-index:0;
    }

    div.bigbox1{
        display:flex;
        width: 768px;
        height: 1211.73px;
        margin:377.6 0 0 0;
        align-items: center;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        z-index:1;
    }

    div.wang{
        width: 768px;
        height: 689px;
        margin: 0 0 0 0;
        z-index:1;
}


div.box1{
    display: flex;
    width: 512px;
    height: 482.12px;
    flex-direction: column;
    justify-items: center;
    margin: 32 128 0 128;
}

div.subtitle1{
width: 175px;
height: 44.8px;
font-family: 'Noto Sans TC', sans-serif;
margin: 0 168.53 36.2661 168.53;
font-size: 40px;
line-height: 46px;
color: #CA0202;
z-index:1;
}

div.text1{
width: 512px;
height: 405.33px;
font-family: 'Noto Sans TC', sans-serif;
font-size: 36px;
line-height: 42px;
color: #000000;
margin: 0 0 0 0 ; 
z-index:1;
}

div.back2{
    width: 0px;
    background: none;
    z-index:0;
}

div.bigbox2{
    display:flex;
    width: 768px;
    height: 1066.665px;
    margin:128 0 0 0;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
    z-index:1;
}

div.huang{
    width: 768px;
    height: 689px;
    margin: 0 0 0 0;
    z-index:1;
}

div.box2{
    display: flex;
    width: 522.666px;
    height: 345.6px;
    flex-direction: column;
    justify-items: center;
    margin: 32 121.6 0 121.6;
}

div.subtitle2{
    width: 213.333px;
    height: 44.8px;
    font-family: 'Noto Sans TC', sans-serif;
    margin: 0 149.3 27.73 149.3;
    font-size: 40px;
    line-height: 46px;
    color:#CA0202;
    z-index:1;
}

div.text2{
    width: 512px;
    height: 405.33px;
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 36px;
    line-height: 42px;
    color: #000000;
    margin: 0 0 0 0 ; 
    z-index:1;
}
}

a:hover {
    color: black;
    border-bottom: 1px solid rgb(208, 5, 26);
    transform: translateX(5px);
    transition: transform .1s linear;
}

a {
    font-family: 'Noto Serif TC', serif;
    font-size: 18px;
    line-height: 28px;
    color: #FFFFFF;
    text-decoration: none;

}