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;
}

.icon1{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon1.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;
}
.icon2{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon2.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;
}
.icon3{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon3.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;
}
.icon4{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon4.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;
}
.icon5{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon5.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;
}
.icon6{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon6.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;
}
.icon7{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon7.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;
}

.icon8{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon8.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;
}

.icon9{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon9.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;
}

.icon10{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon10.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;
}

.icon11{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon11.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;
}

.icon12{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon12.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;
}
.icon13{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon13.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;
}

.icon14{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon14.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;
}

.icon15{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon15.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;
}

.icon16{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon16.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;
}

.icon17{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon17.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;
}
.icon18{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon18.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;
}
.icon19{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon19.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;
}
.icon20{
    float: left;
    width: 69px;
    height: 70px;
    background-image: url(../images/icon20.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;
}

/* ******************************* */ 

.main_container{
    float: left;
    width: 100%;
	height: auto;
    background-image: url(../images/uibg.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: #FFFFFF;
    font-style: normal;
    font-weight: 600;
    font-size: 1.5vw;
    line-height: 32px;
    text-align: center;
    letter-spacing: 2em;
    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;
}

/* 案例研究 */
.subtitle{
    float: left;
    width: 100%;
    height: 50px;
    font-family: '微軟正黑體';
    font-style: normal;
    font-weight: 800;
    font-size: 30px;
    line-height: 41px;
    position: relative;
    letter-spacing: 0.44em;
    color: #000000;
}

.block1_container{
    float: left;
    width: 47%;
    height: auto;
    margin-right: 60px;
    margin-bottom: 20px;
}
.block2_container{
    float: left;
    width: 47%;
    height: auto;
    margin-bottom: 20px;
}
.block3_container{
    float: left;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}

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

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

.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;
}

.ui1{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 10;
    background-image: url(../images/ui1.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
}

.pain_points_container{
    width: auto%;
    display: flow-root;
    position: relative;
    background: rgba(217, 217, 217, 0.5);
    border-radius: 20px;
    padding: 60px;
    position: relative;
    margin-bottom: 20px;
    margin-left: auto;
    margin-left: auto;
}

.pain_points_inside_container{
    float: left;
    width: 33%;
    height: auto;
    position: relative;
    margin-bottom: 30px;
}


.pain_points_no_inside_container{
    width: 69px;
    height: 70px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

.pain_points_wording_container{
    float: left;
    width: 100%;
    height: auto;
    font-family: '微軟正黑體';
    font-style: normal;
    font-size: 15px;
    line-height: 35px;
    text-align: center;
    position: relative;
    color: #000000;
}

.redtitle{
    color: #EA4335;
    font-size: 30px;
    font-weight: 600;
}

.persoma{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 9.1;
    background-image: url(../images/persoma.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    background-color: #EA4335;
    margin-bottom: 20px;
}

.userjourney{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 9.1;
    background-image: url(../images/userjourney.jpg);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    background-color: #EA4335;
    margin-bottom: 20px;
}


.wireframes{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 13.4;
    background-image: url(../images/wireframes.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    margin-bottom: 20px;
}
.wireframes2{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 21.7;
    background-image: url(../images/wireframes2.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    margin-bottom: 20px;
}

.wireframes3{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 21.7;
    background-image: url(../images/wireframes3.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    margin-bottom: 20px;
}
.wireframes4{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 13.4;
    background-image: url(../images/wireframes4.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    margin-bottom: 20px;
}

.wireframes5{
    float: left;
    width: 100%;
    aspect-ratio: 16 / 20;
    background-image: url(../images/wireframes5.png);
    background-repeat: no-repeat;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
	position: relative;
    margin-bottom: 20px;
}

.go_btn_container{
    float: left;
    width: 100%;
    height: 50px;
    position: relative;
    margin-bottom: 20px;
}

.go_btn_inside_container{
    width: 250px;
    height: 50px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}


a.go_btn{
    float: left;
    width: 250px;
    height: 50px;
    font-family: '微軟正黑體';
    font-size: 20px;
    line-height: 50px;
    color: #fff;
    text-align: center;
    border: 1px solid #fff;
    border-radius:50px;
    position: relative;
    background-color: #E59D37;
    
        
}
a.go_btn:hover {
    color: #000;
    border: 1px solid #000;
    border-radius:50px;
    background-color: #F2DAAE;
    text-decoration: none;

}
a.go_btn:active {
    color: #fff;
    border: 1px solid #fff;
    border-radius:50px;
    background-color: #757575;
    text-decoration: none;
}

/* *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: 45%;
        height: auto;
        margin-right: 60px;
        margin-bottom: 20px;
    }
    .block2_container{
        float: left;
        width: 45%;
        height: auto;
        margin-bottom: 20px;
    }
    .ssub_title {
        float: left;
        width: auto;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 2.2vw;
        line-height: 70px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
    }

}

/* *Phone* */ 
@media only screen and (max-width: 745px) {
    .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;
    }
    .block1_container {
        float: left;
        width: 100%;
        height: auto;
        margin-right: 60px;
        margin-bottom: 20px;
    }
    .block2_container {
        float: left;
        width: 100%;
        height: auto;
        margin-bottom: 20px;
    }
    .start_title {
        float: left;
        width: 100%;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 5vw;
        line-height: initial;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
        margin-bottom: 20px;
    }
    .ssub_title {
        float: left;
        width: auto;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 4vw;
        line-height: 70px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
    }
    .pain_points_inside_container {
        float: left;
        width: 100%;
        height: auto;
        position: relative;
        margin-bottom: 30px;
    }
    .pain_points_container {
        width: auto;
        display: flow-root;
        position: relative;
        background: rgba(217, 217, 217, 0.5);
        border-radius: 20px;
        padding: 60px;
        position: relative;
        margin-bottom: 20px;
        margin-left: auto;
        margin-left: auto;
    }
}

@media only screen and (max-width: 550px) {
    .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;
    }
    .start_title {
        float: left;
        width: 100%;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 7.5vw;
        line-height: initial;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
        margin-bottom: 20px;
    }
    .ssub_title {
        float: left;
        width: auto;
        height: auto;
        font-family: '微軟正黑體';
        font-style: normal;
        font-weight: 600;
        font-size: 6vw;
        line-height: 70px;
        position: relative;
        letter-spacing: 0.03em;
        color: #000000;
    }
}