html,body{
	font-family: "微軟正黑體";
	font-size:12px;
	height:100%;
	width:100%;
	color:#999999;
	background:#1E1E1E;
	}
	
body{
	overflow-x:hidden
	}

.mask {
		background-color:#FFF;
		width:100%;
		height:100%;
		position:fixed;
		z-index:100000;
	  }
#loader {
		background:url(../images/newave-loading.gif) center center no-repeat;
		height: 50px;
		width: 50px;
		left: 50%;
		top: 50%;
		position: absolute;
		margin: -25px 0 0 -25px;
	}

::-webkit-scrollbar {
        width: 5px;
        border-radius: 25px;
    }
      
      /* Track */
::-webkit-scrollbar-track {
        background: #353534; 
       border-radius: 25px;
    }
       
/* Handle */
::-webkit-scrollbar-thumb {
        background: #f2daac; 
           border-radius: 25px;
    }
      
      /* Handle on hover */
::-webkit-scrollbar-thumb:hover {
        background: #555; 
           border-radius: 25px;
    }

.text_c_g{
    color:#F2DAAE;
}

.blank_box{
    float: left;
    width: 100%;
    height: 20px;
}
.text_bold{
    font-size: 25px;
    font-weight: 800;
}

.line{
    float: left;
    width: 100%;
    height: 1px;
    background-color: #E1E1E1;
    margin-bottom: 20px;
    }

/* ******************************* */ 
.main_container{
    float: left;
    width: 100%;
    height: auto;
     background-image: url(../images/gpbg.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    background-color: #1E1E1E;
}

.slogan{
    width: 100%;
    height: 39px;
    font-family: '微軟正黑體';
    color: #000000;
    font-style: normal;
    font-weight: 600;
    font-size: 1.5vw;
    line-height: 40px;
    text-align: center;
    letter-spacing: 0.6em;
    margin-top: 150px;
    position: relative;
    margin-right: auto;
    margin-left: auto;
    }

.inside_div{
    width: 80%;
    display: flow-root;
    background: #FFFFFF;
    border-radius: 25px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 50px;
    padding: 70px;
    position: relative;
}

.main_title{
    float: left;
    width: 100%;
    height: 73px;
    font-family: '微軟正黑體';
    font-style: normal;
    font-weight: 900;
    font-size: 4vw;
    line-height: 87px;
    position: relative;
    letter-spacing: 0.03em;
    color: #000000;
    padding-bottom: 20px;
    border-bottom: solid 1px #060402;
    margin-bottom: 20px;
}
.block1_container{
    float: left;
    width: 46%;
    height: auto;
    margin-right: 60px;
    margin-bottom: 20px;
    position: relative;
}
.block2_container{
    float: left;
    width: 47%;
    height: auto;
    margin-bottom: 20px;
    position: relative;
}
.block3_container{
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 0px;
    position: relative;
}

.block4_container{
    float: left;
    width: 45%;
    height: auto;
    margin-right: 10x;
    margin-bottom: 20px;
    position: relative;
}
.block5_container{
    float: left;
    width: 45%;
    height: auto;
    margin-bottom: 20px;
    position: relative;
}

.wording_container{
    float: left;
    width: 100%;
    height: auto;
    font-family: '微軟正黑體';
    font-style: normal;
    font-size: 15px;
    line-height: 35px;
    position: relative;
    color: #000000;
    margin-bottom: 20px;
}
a.art1_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/graphiic_cis.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
    
        
}
a.art1_work:hover {
        opacity:0.4;
        filter:alpha(opacity=50);
    }

.ssub_title{
    float: left;
    width: auto;
    height: auto;
    font-family: '微軟正黑體';
    font-style: normal;
    font-weight: 600;
    font-size: 3vw;
    line-height: 70px;
    position: relative;
    letter-spacing: 0.03em;
    color: #000000;
    margin-bottom: 20px;
}



a.art2_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 15.1;
    background-image: url(../images/graphic_2.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
   
        
}
a.art2_work:hover {
        opacity:0.4;

}

a.art3_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 15.1;
    background-image: url(../images/graphic_3.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
        
}
a.art3_work:hover {
        opacity:0.4;

}
       
.art4{
    width: 80%;
    aspect-ratio: 16 / 24;
    background-image: url(../images/graphic_4);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: absolute;
    left: 120%;
    top: -10%;
    z-index: 1;
}

a.art5_work{
    float: left;
    width: 24%;
    aspect-ratio: 16 / 14.5;
    background-image: url(../images/graphic_5.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    margin-right: 10px;
    border-radius: 30px;
    border: 1px solid #cccc     
}
a.art5_work:hover {
        opacity:0.4;
}

a.art6_work{
    float: left;
    width: 24%;
    aspect-ratio: 16 / 14.5;
    background-image: url(../images/graphic_6.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    margin-right: 10px;
    border-radius: 30px;
    border: 1px solid #cccc
        
}
a.art6_work:hover {
        opacity:0.4;
}

a.art7_work{
    float: left;
    width: 24%;
    aspect-ratio: 16 / 14.5;
    background-image: url(../images/graphic_7.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    margin-right: 10px;
    border-radius: 30px;
    border: 1px solid #cccc
}
a.art7_work:hover {
        opacity:0.4;
}

a.art8_work{
    float: left;
    width: 24%;
    aspect-ratio: 16 / 14.5;
    background-image: url(../images/graphic_8.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
    border: 1px solid #cccc
        
}
a.art8_work:hover {
        opacity:0.4;
}

a.art9_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 15.1;
    background-image: url(../images/graphic_9.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
        
}
a.art9_work:hover {
        opacity:0.4;
}

a.art10_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 8.5;
    background-image: url(../images/graphic_10.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
}
a.art10_work:hover {
        opacity:0.4;
}

a.art11_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 19;
    background-image: url(../images/graphic_11.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
        
}
a.art11_work:hover {
        opacity:0.4;
}
a.art12_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 18.5;
    background-image: url(../images/graphic_12.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;

        
}
a.art12_work:hover {
        opacity:0.4;
}

a.art13_work{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 24.5;
    background-image: url(../images/graphic_13.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 30px;
        
}
a.art13_work:hover {
        opacity:0.4;
}

a.art14_work{
    float: left;
    width: 47%;
    aspect-ratio: 16 / 25;
    background-image: url(../images/graphic_14.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    margin-right: 20px;
    border-radius: 30px;
    margin-bottom: 20px;
        
}
a.art14_work:hover {
        opacity:0.4;
}
a.art15_work{
    float: left;
    width: 47%;
    aspect-ratio: 16 / 25.8;
    background-image: url(../images/graphic_15.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
 
        
}
a.art15_work:hover {
        opacity:0.4;
}


.poup_art1{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art1.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}

.poup_art2{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art2.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art3{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art3.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art4{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art4.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art5{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art5.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art6{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art6.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art7{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art7.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art8{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art8.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art9{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art9.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art10{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art10.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art11{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art11.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art12{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art12.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art13{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art13.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
.poup_art14{
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/poup_art14.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    position: relative;
    border-radius: 20px;
}
/* *Pad */ 
@media only screen and (max-width: 1354px) {
.inside_div {
        width: 85%;
        display: flow-root;
        background: #FFFFFF;
        border-radius: 25px;
        margin-right: auto;
        margin-left: auto;
        margin-top: 50px;
        padding: 40px;
        position: relative;
    }
    .block1_container {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 60px;
        margin-bottom: 20px;
        position: relative;
    }
    .block2_container{
        float: left;
        width: 100%;
        height: auto;
        margin-bottom: 20px;
        position: relative;
    }
    
    .block4_container {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 60px;
        margin-bottom: 20px;
        position: relative;
    }
.art4{
            width: 35%;
        aspect-ratio: 16 / 24;
        background-image: url(../images/graphic_4);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: absolute;
        left: 60%;
        top: 10%;
}
 
}
/* *Phone* */ 
@media only screen and (max-width: 1121px) {
    .slogan {
        width: 100%;
        height: 39px;
        font-family: '微軟正黑體';
        color: #FFFFFF;
        font-style: normal;
        font-weight: 600;
        font-size: 0vw;
        line-height: 32px;
        text-align: center;
        letter-spacing: 2em;
        margin-top: 100px;
        position: relative;
        margin-right: auto;
        margin-left: auto;
    }
    .inside_div {
        width: 85%;
        display: flow-root;
        background: #FFFFFF;
        border-radius: 25px;
        margin-right: auto;
        margin-left: auto;
        margin-top: 0px;
        padding: 20px;
        position: relative;
    }
    .main_title {
        float: left;
        width: 100%;
        height: 73px;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 900;
        font-size: 7vw;
        line-height: 87px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
        padding-bottom: 20px;
        border-bottom: solid 1px #060402;
        margin-bottom: 20px;
    }  
    .ssub_title {
        float: left;
        width: auto;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 5vw;
        line-height: 70px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
        margin-bottom: 20px;
    } 
    .block1_container {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 60px;
        margin-bottom: 20px;
        position: relative;
    }
    .block2_container {
        float: left;
        width: 100%;
        height: auto;
        margin-bottom: 20px;
        position: relative;
    }
    .block4_container {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 10px;
        margin-bottom: 10px;
        position: relative;
    }

    .block5_container {
        float: left;
        width: 40%;
        height: auto;
        margin-bottom: 20px;
        position: relative;
        display: none;
    } 
    a.art5_work{
        float: left;
        width: 48%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_5.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 10px;
        border-radius: 30px;
        margin-bottom: 10px;
            
    }
    a.art5_work:hover {
            opacity:0.4;
    }
    
    a.art6_work{
        float: left;
        width: 48%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_6.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 10px;
        border-radius: 30px;
        margin-bottom: 10px;
            
    }
    a.art6_work:hover {
            opacity:0.4;
    }
    
    a.art7_work{
        float: left;
        width: 48%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_7.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 10px;
        border-radius: 30px;
        margin-bottom: 10px;
    }
    a.art7_work:hover {
            opacity:0.4;
    }
    
    a.art8_work{
        float: left;
        width: 48%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_8.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        border-radius: 30px;
        margin-bottom: 10px;
    }
    a.art8_work:hover {
            opacity:0.4;
    }
.art4{
            float: left;
        width: 40%;
        aspect-ratio: 16 / 24;
        background-image: url(../images/graphic_4);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        left: 30%;
        top: -20px;
}
}

@media only screen and (max-width: 710px) {
    .main_title {
        float: left;
        width: 100%;
        height: 73px;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 900;
        font-size: 8.5vw;
        line-height: 87px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
        padding-bottom: 20px;
        border-bottom: solid 1px #060402;
        margin-bottom: 20px;
    }
    .ssub_title {
        float: left;
        width: auto;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 6.5vw;
        line-height: 40px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
    }

    a.art5_work{
        float: left;
        width: 100%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_5.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 0px;
        border-radius: 30px;
        margin-bottom: 20px;
        
            
    }
    a.art5_work:hover {
            opacity:0.4;
    }
    
    a.art6_work{
        float: left;
        width: 100%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_6.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 0px;
        border-radius: 30px;
        margin-bottom: 20px;
            
    }
    a.art6_work:hover {
            opacity:0.4;
    }
    
    a.art7_work{
        float: left;
        width: 100%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_7.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        margin-right: 0px;
        border-radius: 30px;
        margin-bottom: 20px;
    }
    a.art7_work:hover {
            opacity:0.4;
    }
    
    a.art8_work{
        float: left;
        width: 100%;
        aspect-ratio: 16 / 14;
        background-image: url(../images/graphic_8.png);
        background-repeat: no-repeat;
        -moz-background-size: 100%;
        -webkit-background-size: 100%;
        -o-background-size: 100%;
        background-size: 100%;
        position: relative;
        border-radius: 30px;
        margin-bottom: 20px;
            
    }
    a.art8_work:hover {
            opacity:0.4;
    }

}