@charset "UTF-8";



body {
	font-family: Arial, "微軟正黑體", "Microsoft JhengHei", sans-serif;
	text-align: center;
	color: #000 ;
	background: #f3faff ;
	-webkit-text-size-adjust: none;
    margin:0px;
}

img {
	line-height: 0;
}

a:focus {
	outline: none;
}

a {
	text-decoration:underline;
}

strong {
	font-weight: bold;
}

ul {
	list-style: none;
}

html {
  margin: 0 auto;
  background: #f0edda; /* Fills the page */
  position: relative; /* Fix for absolute positioning */  
}


/* --------------------------------------------------------------------------------------------------------------------

common

-------------------------------------------------------------------------------------------------------------------- */

body > header {
	line-height: 0;
}

body > footer {
	color: #fff;
	font-size: 12px;
	padding: 5px 4px;
}
#index{
    max-width: 900px;
	text-align:center;
    height:100%;
	margin:auto;
    padding:0px 0px;
	background: #fff ;
}


p{margin:0px 0px;}

#index > header h1 {
	line-height: 0;
	background: none;
	padding: 0;
}
#index img{
	height: auto;
	display:block;
    margin:0px 0px;
    line-height:0em;
    vertical-align:bottom;
}

p1{margin:30% 0%;
height: 10%;}


.button {
    width:160px;	
    margin:0 auto;
}

.button img{
width: 20%;
float:left;
}

.clear{
	clear:both;
}

.outer{
	    margin:0%;
       	position : fixed;

}


.inner{
            margin:0%;
            width:20%;
            height:70px;
	        text-align:center; 
	        float: left;
	
 }
.backtotop {
    display: scroll;
    position: fixed;
    bottom: 0.5%;
    right: 0%;
}

.fixed {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 200px;
  background-color: white;
}

.outer2{
	        margin:0%;
            background-color:#FFFFFF;
 }

.inner2{
            margin:0 0 0%;
            background-color: #FFFFFF;
            width:100%;
            height:70px;
	        text-align:center; 
	        float: left;
	
        }

/*
文字設定
 */
.headline_LA{
	color: #E4007F;
	font-size:100px;
	font-weight: bolder;
	display:block;
	width:100%;
	text-align:center;
}
.headline_MI{
	float:left;
	color: #FFFFFF;
	padding:2%;
	background-color: #E4007F;
	font-size:40px;
	font-weight: bolder;
	width:96%;
}
.headline_MI_L{
	float:left;
	color: #FFFFFF;
	padding:2%;
	background-color: #E4007F;
	font-size:42px;
	text-align:center;
	font-weight: bolder;
	width:96%;
}
.content_LA{
	color: #C30D23;
	font-size:66px;
	float:left;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: 900;
	display:block;
	width:100%;
	text-align:center;
}
.content_LA_LL{
	padding:2%;
	color: #E60012;
	font-size:66px;
	float:left;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: 900;
	display:block;
	width:96%;
}
.content_LA_S{
	float:left;
	margin-top:10px;
	color: #E60012;
	font-size:60px;
	font-weight: 900;
	display:block;
	width:100%;
	text-align:center;
}
.content_MI{
	text-align:center;
	margin:auto;
	color: #F39800;
	font-size: 42px;
	font-family: 'Noto Sans TC', sans-serif;
	font-weight: bolder;
	display:block;
	width:90%;
}
.content_non{
	font-family: 'Noto Sans TC', sans-serif;
	line-height:45px;
	padding:5%;
	font-size:30px;
	font-weight:bolder;
}
.content_ps{
	padding-bottom:2%;
	padding-right:5%;
	font-size:20px;
	float:right;
	font-weight:bolder;
}
.content_ing2{
	font-family: 'Noto Sans TC', sans-serif;
	padding: 2%;
	font-size: 30px;
	font-weight: bolder;
	line-height: 40px;
	border-color: #E4007F;
	border-style: solid;
	border-radius: 15px;
	width:86%;
	margin:5%;
}
.img_LEFT_50{
	line-height:40px;
	color:#6A3906;
	font-size:28px;
	font-weight:900;
}
.img_LEFT_50_yellow{
	background-color:#F8B62D;
	line-height:40px;
	color:#FFFFFF;
	font-size:28px;
	font-weight:900;
}
.footer, .footer a{
	text-align:center;
	font-size:30px;
	line-height:40px;
	color:#FFFFFF;
}


/*----------CTA 按鈕 star----------*/



.fixed-obj{
    position: fixed;
    top: -380px;
    right: 0;
    max-width: 270px;
    width: 100%;
    z-index: 999;
    transition: top .5s ease-out;
}

.fixed-obj.show_sta{
    top: 105px;
}


.fixed-obj #pc_sta{
    width: 220px;
    display: block;
    margin: 0 0 0 auto;
}

.fixed-obj #mobile_sta{
    display: none;
    margin: 0 auto;
}

/*----------CTA 按鈕 end----------*/

/*** テキスト化
******************************************/



/*img{
	max-width:800px;	
}*/


@media screen and (min-width : 640px){	
.txt01{
	height: auto;
	padding: 2% 14% 5% 14%;
	font-size: 22px;
	font-weight: bold;
	text-align: center;
	line-height: 1.4 !important;
	color: #5791e5;
}
#bee{
	width: 30px;
	float: right;
	margin-left: 2px;
	margin-right: 2px;
}
#bee2{
	width: 30px;
	float: left;
	margin-left: 2px;
	margin-right: 2px;
}
#headline_left,#headline_left2{
	float: right;
	color: #000000;
	text-align: center;
	font-size: 100%;
}
#headline_right,#headline_right2{
	float: left;
	color: #000000;
	text-align: center;
}
#headline_all_left,#headline_all_left2{
	margin: auto;
	width: 50%;
	float: left;
}
#headline_all_right,#headline_all_right2{
	margin: auto;
	width: 50%;
	float: right;
}


}

@media screen and (max-width : 640px){	
		#topimage{
	margin: 3 2%;
	font-size: 14px;
	height: 30%;
	text-decoration:none;
	background: #FFC51C;
	}
.txt01{
	height:auto;
	padding: 2% 10% 2% 10%;
	font-size: 22px;
	font-weight: bold;
	text-align: left;
	line-height: 1.4 !important;
	color: #5791e5;
}
#bee{
	width: 0px;
	float: right;
	margin-left: 2px;
	margin-right: 2px;
}
#bee2{
	width: 0px;
	float: left;
	margin-left: 2px;
	margin-right: 2px;
}
#headline_left{
	width: 100%;
	float: left;
	color: #000000;
	text-align: center;
	font-size: 100%;
}
#headline_right{
	width: 100%;
	float: left;
	color: #000000;
	text-align: center;
}
#headline_all_left{
	margin: auto;
	width: 100%;
	float: left;
}
#headline_all_right{
	margin: auto;
	width: 100%;
	float: right;
}
#headline_left2{
	float: right;
	color: #000000;
	text-align: center;
	font-size: 100%;
}
#headline_right2{
	float: left;
	color: #000000;
	text-align: center;
}
#headline_all_left2{
	margin: auto;
	width: 50%;
	float: left;
}
#headline_all_right2{
	margin: auto;
	width: 50%;
	float: right;
}
	
	
/*----------CTA 按鈕 star----------*/
  .fixed-obj #pc_sta{
        display: none;
    }

 .fixed-obj #mobile_sta{
        display: block;
  }
    
    .fixed-obj {
        top: auto;
        bottom: -360px;
		max-width: 800px;
        transition: bottom .5s ease-out;
    }

    .fixed-obj.show_sta{
        top: auto;
        bottom: 0;
    }	
	
/*----------CTA 按鈕 end----------*/
	
}


@media screen and (min-width : 640px){	
.txt03 {
	height: auto;
	padding: 2% 14% 2% 14%;
	font-size: 16px;
	line-height: 200%;
	text-align: left;
	color: #666;
	clear: both;
}

}

@media screen and (max-width : 640px){	
.txt03 {
	height:auto;
	padding: 2% 10% 2% 10%;
	font-size: 16px;
	line-height:200%;
	text-align: left;
	color: #666;
}
}


.txt03_h1 {
	font-size:19px;
	font-weight:bold;
}


.txt05 {
	height:auto;
	margin:5% 0 0 0;
	padding: 1% 5% 1% 6%;
	font-size: 14px;
	text-align:center;
	line-height: 1.6 !important;
	color: #fff;
	background-color:#933019;
}

@media screen and (min-width : 640px){	
#styleimage{
	margin-left:14%;
	margin-right:14%;
	}
}

@media screen and (max-width : 640px){	
	
	#topimage{
	margin: 3 2%;
	font-size: 14px;
	height: 30%;
	text-decoration:none;
	background: #FFC51C;
	}
#styleimage{
	margin-left:10%;
	margin-right:10%;
	}
}
	

#topimage{
	margin: 3 2%;
	font-size: 19px;
	height: 30%;
	text-decoration:none;
	background: #FFC51C;
	}
	
#topimage p{
	text-align:center;
	text-decoration:none;
	padding:3% 3% 1% 3%;
	line-height: 1.8 !important;
	}
	
@media screen and (max-width : 640px){
    #topimage p{ 
	font-size : 70%;
	color:#333333;
	text-align:left;
	line-height:1.5;} 
}
 
@media screen and (min-width : 640px) {
    #topimage p{ 
	font-size : 100%;
	color:#333333;}
}
	
#stylehr{
	color:#F8FBFF;
	margin-top:2%;
	margin-bottom:4%;
	}
	
@media screen and (min-width : 640px) {
    #left{
        margin-left:6%;
        float:left;
        width:25%;
    }
}
	
@media screen and (max-width : 640px){
    #left{
        position:relative;
        width: 100%;
        height: 150px;
        padding-top:-100px;
        overflow: hidden;
        float:none;
    }
    #left img{position:absolute;
        top:-140px;
    }
}	
	

@media screen and (min-width : 640px) {
    #snsbox{
        text-align:left;
        margin-left:35%;
        font-size:14px;
	}
}

@media screen and (max-width : 640px) {
    #snsbox{
        font-size:12px;
    }
}

@media screen and (min-width : 640px) {
    #snsbox_img{
        padding-left:45%;
    }
}

@media screen and (max-width : 640px) {
    #snsbox_img{
        padding-left:7%;
    }
}
	
@media screen and (min-width : 640px) {
    #snsbox .img001{
        width:50%;
        display:inline-block;
    }
}	
	
@media screen and (max-width : 640px) {
    #snsbox .img001{
        width:120px;
        display:inline-block;
    }
}

#bg_red_bold{
	font-weight:bold;
	background-color:#FF0;
	}
	
