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


body{
	width:100%;
	font-family:微軟正黑體, 新細明體, Arial, Helvetica, sans-serif;
	font-size:18px;
	line-height:1.5;

}
.orange{
	color:#ff7e00;
}

.bar{
	display:none;

}

.nav, .nav ul li{
	display:none;
}
.side_menu{
	position:absolute;
	right:0;
}
.side_menu ul li{
	text-align:left;
	padding:0 12px;	
	display: inline-block;
	line-height: 4;
	color:#FFF;
	font-size: 16px;

	
}
.side_menu ul li a{
		color:#FFF;
		text-decoration:none;
	display: block;
}
.side_menu ul li.btn_y a, .nav ul li.btn_y a{
	background: #fffd7b; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmQ3YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmNjMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top, #fffd7b 0%, #ffcc00 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fffd7b 0%,#ffcc00 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fffd7b 0%,#ffcc00 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffd7b', endColorstr='#ffcc00',GradientType=0 ); /* IE6-8 */
	color:#004849;
	padding: 10px 10px;
	border-radius: 5px;
	line-height: 1;
	box-shadow:0px 2px 2px rgba(20%,20%,40%,0.6);
	
}

.gta_qrcode
{
	/* display: block;
	position: absolute; */
	top: 0;
	right: 0;
	max-width: 110px;
	height: 60px;
	background: url(../qrcode/phishing_btn.svg) no-repeat right center/100% auto, #016060;
	z-index: 500;
	color: #FFF;
	font-size: 0;
}


#go, #go2 {
    display: none;
    cursor: pointer;
    position: fixed;
    right: 24px;
    bottom: 24px;
   width: 112px;
    height: 107px;
    z-index: 99999999999999999999999999999999999999999999999;
    background-image:url(../images/top.png);
	background-repeat:no-repeat;
    background-size: 70%;
	background-position: right;
}
ruby{
	font-size:15px;
	display: contents;
	text-align: left;
}


article{
		position:relative;
	width:100%;
		min-width:1000px;

}

header{

    width: 100%;
    height: 60px;
    position: fixed;
    z-index: 9999999;
	background-color: #007c7d;
	top:0;

}

header img{
	position:absolute;
	
}
header img.logo{
	left: 5%;
    top: 8px;
}

.attention{
	width:100%;
	margin:0 auto;
	text-align:center;
}
.attention img{
	width:1054px;
	height:auto;
}
.attention_m{
	display:none;
}
.logo_right {
    right: 0px;
}

.banking{
position: absolute;
top: 10px;
left: 4%;
z-index: 99;
	
	
}
.banking img{
	height: 70px;
	
	
}
.kv{
	background: url(../images/kv_pc.jpg) no-repeat 50% 0;
	height:960px;
	margin-top: 24px;
	background-color: #fee1d3;
	position:relative;
	display:block;
	background-size: cover;

}
.kv img{
	position:absolute;
	bottom:0;
	width:100%;
}
.kv .title{
	width:698px;	
	position:absolute;
	right:10%;
    top: 60%;
	z-index:9999;
	display:block;
}



.kv .title span img{
	width:240px;
	top: 0px;
	/*left: 30px;*/
	left: 0;
	right: 0;
	margin: 0 auto;
			-webkit-filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 1));/*--IEnotwork--*/
filter: drop-shadow(0px 0px 10px rgba(255, 255, 255, 1))
}

.kv_m{
		display:none !important;
	}

.act, .best, .web{
	margin:0 auto;
	text-align:center;
	width:100%;
	position:relative;
	padding:15px 0;
		background-color:#d5f7eb;


}
.web{
	padding-top: 60px;


}
.yellow_bg{
	background-color:#fff6cd;


}
/*.act img.first{
	margin-top:-80px;
}*/

.best .item{
/*	padding-top:15px;*/
		background-color: #d5f7eb;
	padding-bottom: 0;
}
.best .item div{
	background-color: #FFF;
		padding-bottom: 30px;
}
.best .item.hot:before{
	content:url(../images/new_mark.png);
	display: block;
	position: absolute;
	max-width: 100%;
	top: 0px;
	z-index: 99999;

}
.act .item{
	padding-top:0px;
}

.best_m{
	display:none;
}
.best .content.wrapper2{
	width:62%;
	margin:0px auto;
	margin-bottom: 30px;
}
hr{
	border:.5px solid #99d4d5;
	padding: 0;
	margin: 0 auto;
	background-color:#d3f8f9;
	width: 80%;
}
.privacy_text hr{
	margin: 25px  auto;
	width:100%;
	
}


h3 img{

    margin: 0px auto;
    text-align: center;
	padding-top:100px;
}
.call_mobile{
	display:none;
	
}
.content{
	width:100%;
	padding:30px 0;
		color:#FFF;
}

.web .content ul li{
	display:inline-block;
	margin:0;
	text-align:center;
	background-color:#FFF;
	border:2px solid #8ad4d6;
	border-radius: 50%;
	width:160px;
	height: 160px;
	font-weight: bold;
	color:#00b3b6;
	vertical-align:middle;
}
.web .content ul li:first-child, .web .content ul li:last-child{
	background-color:#ff7e00;
	border:2px solid #ff7e00;
	color:#FFF;
}
.web .content ul li.arrow{
	content: url("../images/arrow.png");
	background-color:transparent;
	border:none;
	border-radius:0;
	width:auto;
	max-height: 25px;	
}
_:-ms-fullscreen, :root .web .content ul li.arrow{
	width:25px;
	background-image: url("../images/arrow.png");
	background-repeat: no-repeat;
	background-size: contain;
}
.web .content ul li img{
	width:87px;
	height: auto;
	display: block;
	padding: 15px 0 0 0;
}

.wrapper ul li img, .wrapper2 ul li img,  .wrapper3 ul li img{
	 max-width:100%;
	 height:auto;

}


.wrapper{
	width:100%;
	margin:0 auto;
}
.wrapper ul p{
	width: 1000px;
    margin: 0 auto;
	letter-spacing:5px;
}




.web .wrapper3 ul li i{
	font-size:1vw;
	color:#ff7e00;
}
.content p{
	font-weight:bold;
	/*padding:20px 0;*/
	margin:0 auto;

}


.wrapper2 p{
	height:200px;
	width:85%;
	margin:0 auto;
	text-align:justify;
	font-size:18px;
	padding-top: 15px;
	color:#555555;
	font-weight: normal;

}
.wrapper ul li p span, .little{
	font-size:14px;
}
 .little{
	 color:#333333;
	 padding-top: 12px;
	 display: block;
}
.content b, .block2 b, .block4 b{
	background-color:#fdd001;
	border-radius: 30px 0 0 30px;
	border: #00b3b6 solid 1px;
	color:#11797a;

}
.block2 b, .block4 b{
	padding:15px 50px;

}
.block4 .news_a b{
	background-color:#00b3b6;
	border-radius:5px;
	padding:10px 30px;
	color:#FFF;
	letter-spacing: normal;
	

}

.wrapper2  b{	

	border: 1px solid #FFF;
	margin: 10px auto;
	display: inline-block;
}
.wrapper2  b a{	
	color:#11797a;
	display: block;
		padding: 10px 25px;
}
.phone {
	display:none !important;

}
.content .b_right{
	border-radius: 0 50px 50px 0;
}


#middle{
	border-radius:0;
}


.wrapper2 ul li {
	padding-bottom: 50px;
	width:480px;
	margin: 0 30px;
}

.travel{
	width:352px;
	display:block;
	margin:0 auto;
	padding:0;
	max-width: 100%;
}
.travel_m{
	display:none;
}
h2{
	font-size:20px;
	letter-spacing: 2px;
	color:#008082;	
	margin:0 auto;
	padding:15px 0;
	font-weight: normal;
}
.bo{
	padding: 15px 0;
	color:#cacaca !important;
	vertical-align: middle;
}
.bo a{
	text-decoration: none;
	color:#009a9c;
	display: inline-block;

}
.bo a i{
	padding-left:5px;
}

.wrapper .tag{
	padding-bottom: 27px;
}
.wrapper .tag  ol {
    counter-reset: section;
	position: relative;
	margin-left: 4em;
	padding-bottom:10px;
}
.wrapper .tag  ol > li:before {
    margin-left: -4em;
    counter-increment: section;
    content: "好康 " counter(section) " ";
	background-image: url("../images/og-tag.jpg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: right;
	background-color: #ff7e00;
	padding: 0 4px;
	color:#FFF;
	margin-right: 5px;
}
.wrapper .tag  ol li {
	text-align: left !important;
	padding: 5px 0 !important;
	width: auto !important;
	background-color: #FFF !important;
	padding-left: 10px;
	
}
.wrapper .square> li:before {
	content:"取得\A資格" !important;
	white-space: pre-wrap;
	background-image: none !important;
	position: absolute;
	background-color: #e0fafb !important;
	color:#009a9c !important;
	line-height: 1.2;
	padding: 5px 12px !important;
	border-radius: 5px;
}
.wrapper .square> li+li:before {
	content:"寄送\A方式" !important;
}





.wrapper3 b{
	width:300px;
	display:inline-block;
	margin:10px 20px;
}
/*----------進度條-------*/
#scrollable, .content.wrapper3, .content.wrapper3 ul{
	overflow: hidden;
	
}
	.indicator p {
		display: none;
	}
/*------------*/

.arrow_m{
	display:none !important;
}
.content.wrapper{
	width: 1220px;


	
}
.content.wrapper ul{
	display: inline-flex;
	display: inline-block\9;
	margin-right: 25px;
	width: 40%;
	vertical-align: top;
	background-color: #FFF;
		border-radius: 20px;

	

	
}
.content.wrapper ul:last-child{
	margin-right: 0px;

	

	
}
.content.wrapper ul li picture{
	width: 100%;
	display: block;
	background-color: #3ecbcd;
}
.content.wrapper ul li picture, .content.wrapper ul li picture img{
	border-radius: 15px;

}



.content.wrapper ul li{
	display:inline-block;
	margin: 0 auto;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	padding: 15px;

	
}

.content.wrapper ul li div{
	color:#555555;
	font-weight: bold;
	
}
.content.wrapper ul li .step_a{
	text-align: left;
	width:98%;
	margin:0 auto;
	
}
.content.wrapper ul li .step_a span{
	color:#888888;
	text-align: center;
	margin: 10px auto;
	display: block;
}
.content.wrapper ul li h2{
	color:#555555;
	letter-spacing: 0;
	text-align: center;
	
}
.content.wrapper ul li h2 span{
	color:#FFF;
	font-size: 16px;
	background-color: #00a0a2;
	border-radius: 30px;
	padding: 2px 8px;
	display: inline-block;
	
}
.content.wrapper ul li+li{
	width:450px;
		background-color:#00b3b6;

	
}
.content.wrapper ul .step_a figure{
	width: 100%;
	margin: 0 auto;
	height: 170px;
	color:#000000;
 }

.content.wrapper ul .step_a figure h2{
	color:#00a0a2;
	font-weight: bold;
	padding-bottom: 0;
	
 }






.content.wrapper ul li p b:hover{
	opacity:0.9;
}

.item{
	margin:0 auto;
	background-color:#FFF;
	width: 360px;
		color:#00b3b6;
		padding-bottom:50px;


}
.act .item{
	width:80%;
	background-color: #FFF;
	border: 3px solid #FFF;
	margin: 0 auto;
	color: #333333;


}

.act .item span{
	background-color: #ff7e00;
	width:100%;
	display: block;
	color:#FFF;
	font-size: 28px;
	font-weight: bold;
	padding: 15px 0;


}
.act .item div{
	width: 90%;
	margin: 0 auto;

}
.act .item .act_t{
	width:92px;
	height: auto;
	max-width: 100%;
	padding-top: 15px;

}
.act .item h4{
	text-align: center;
	padding: 15px 0;

}
.act .item h4 font{
	color:#ff4e00;
		font-weight: bold;

}
.act .item table{
	width:100%;
	margin-bottom: 10px;

}
.act .item table tr td{
	border:1px solid #FFF;
	background-color: #e6e6e6;
	padding: 15px;
	text-align: left;

}
.act .item table tr~tr td{
	background-color: #f7f7f7;

}
.act .item table tr td:nth-child(2){
	width:65%;

}
.act .item  ol li{
	text-align: left;
	list-style: decimal;
	display:list-item;
	margin-left: 2em;
	font-size: 14px;
	padding: 10px 0;

}
.act .item  ul li{
	display: inline-block;
	width: 20%;
	padding: 10px 5px;
	margin: 0 auto;
	margin-bottom: 15px;

}
.act .item  ul li~li{
	border-left:1px solid #e4e4e4;

}
.act .item  ul li:last-child{
	border-left:none;

}
.act .item a img{
	width:197px;
	height: auto;

}
.share{
	margin:0 auto;
	text-align:center;
	width:100%;
	background-color:#eafcff;
	margin-bottom:50px;
	width:100%;
	color:#00b3b6;
	font-weight:bold;
}
.share ul li{
	display:inline-block;
	vertical-align: top;
}
.share ul li span, .share ul li p .fa{
	color:#fdad01;
	font-weight:bolder;
}
.share ul li .size{
	font-size:30px;
}
.share ul li .ps, .share ul li .d{
	font-size:20px;
	color:#00b3b6;
	vertical-align: top;
	
}


.share ul li img{
	width: 581px;
	height:auto;
	vertical-align:bottom;
}
.share ul li+ li{
    width: 420px;
	text-align:left;
	/*margin-top:40px;*/
	margin-top:80px;
}

.share ul li+ li img{
	width: 249px;
	height:auto;
	vertical-align:bottom;
}
.share ul li p{
	margin-top:10px;
}
.share ul li p +p{
	margin-top:30px;
}
.share ul li p+ p +p{
	font-size:18px;
	color:#888888;
	font-weight:normal;
}

.sharetitle_m{
	display:none;

}
.owl-prev, .owl-next {
    position: absolute;
    overflow: hidden;
    top: 40%;
    height: 58px;
}
.owl-prev {
    left: -50px;
}
.owl-next {
    right: -50px;
}

.act img, .best img, .step img, .web img, .write img, .privacy img{
	max-width:100%;
	margin: 0 auto;
}
.button a img{
	max-width:100%;
	width: 197px;
	height: auto;
}
.button a{
	margin: 15px;
}
.coming, .coming:hover a{
	background-color:#FFF !important;
	opacity: 1 !important;
	cursor:default;
      }








.privacy{
	width:100%;
	position:relative;
	background-image:none;
	margin:0px auto;
	   text-align: center;
	padding-top:30px;

}

.privacy b{
color: #00a0a2;
    text-decoration: none;
    display: block;
    border: #00a0a2 2px solid;
    border-radius: 50px;
    vertical-align: middle;
    text-align: center;
	padding:10px;
    margin: 0 auto;
    font-size: 20px;
	width:40%;
	cursor:pointer;
}
.down, .hide{
		color:#00a0a2;
		background-position:63% center;
		background-repeat:no-repeat;
	    background-size:contain;
		font-weight:bold;

}
.down{
	background-image:url(../images/button.jpg);

}
.hide{

	background-image:url(../images/button2.jpg);

}

.privacy_text{

	margin:0px auto;
	color:#7d7d7d;
	line-height:1.5;
	 width: 1000px;
	

}
.privacy_text a, .privacy_text strong{

	color:#00a0a2;

}
.privacy_text a{

	text-decoration:underline;

}
.privacy_text ol{
	    list-style: decimal;
	padding-top: 30px;
}
.newpage .privacy_text ol{
	    border-top: 1px solid #dcf2f2;
}
.newpage .privacy_text ol~ ol{
	    border-top:none;
}

.privacy_text ol li, .privacy_text p, .privacy_text ul li{
	padding:7px 0;
	letter-spacing:1px;
		text-align:justify;
	margin-left: 20px;
}
.privacy_text ul li:before {
    content: "※";
    float: left;
    margin-left: -20px;
	    color: #00a0a2;
}
.privacy_text ul~ ul{
	padding-top:0;
}
.privacy_text ul li{
		    color: #00a0a2;
}
.privacy_text .notice_t{
	font-size:30px;
}
.privacy_text dl dt{
	padding: 10px 0;
	list-style: disc outside none;
display: list-item;
margin-left: 1em;
}
.privacy_text dl dt span{
	font-style: italic;
	
}
.privacy_text dl dt img{
	max-width: 200px;
	height: auto;
	vertical-align: middle;
	
}
.privacy_text dl dt span font{
	font-size: 13px;
	
}
.privacy_text dl dt table tr td{
	padding: 10px 0;
	border-right: 1px solid #555;
	border-top: 1px solid #555;
	
}
.privacy_text dl dt table tr td:nth-child(1){

	border-left: 1px solid #555;
	
}
.privacy_text dl dt table tr:last-child td{
	border-bottom: 1px solid #555;}
#p_t{
	padding: 0px 20px;
margin-top: -20px;
}





footer{
	width:100%;
	margin:30px 0 0 0;
	background-color:#E3E3E3;
}
footer p{
	margin: 0px;
	text-align:center;
	padding-top:5px;
	color:#FFFFFF;
	vertical-align:middle;
    letter-spacing: 1px;
		background-color:#007c7d;

	
}
footer .cautious {
	max-width:1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	flex-direction: row;
	box-sizing: border-box;
	padding: 30px  20px;
	color:#555555;
	
}
footer .cautious span:first-child{
	font-size: 25px;
}
footer .cautious span{
	flex: 0 1 22%;
	display: inline-block\9;
	border:1px solid #555555;
	vertical-align: middle;
	justify-content: center;
	padding: 15px 0;
	
}
footer .cautious span+span{
	flex:1 1 70%;
	text-align: justify;
	border: none;
	box-sizing: border-box;
	padding: 20px 10px;
	display: inline-block;/*for ie10*/
	text-align: justify;/*for ie10*/
	
	
}
footer .cautious span.span_fh{

	display: block;
	flex:initial;
	border-top:1px solid #c0c0c0;
	
	
}
footer .cautious span abbr{
	padding-left: 10px;
	
}
footer .cautious span a{
	color:#007c7d;
	
}


a, a:hover{
	text-decoration:none;

}
a:hover{
		opacity:0.9;
}
.arrow_b, .arrow_b3{
    vertical-align: baseline;
	left:0;
	top:0;
	display:inline-block;
}
.arrow_b3{

	-webkit-animation: move .3s infinite linear;  
	-moz-animation: move .3s infinite linear;  
	-ms-animation: move .3s infinite linear;-o-animation: move 10s infinite linear;
}

@-webkit-keyframes move {
        0% { 
            transform:translate(0px);

        }
		50%{
			transform:translate(5px);
		} 
		
		100% { 
            transform: translate(0px);

        }


}


/*--------------news--------------------------*/
.news_banner {
    background-image: url(../images/news_banner.jpg);
    /*background-size: 1440px auto;*/
    margin: 0 auto;
    width: 100%;
    background-repeat: no-repeat;
    background-position: bottom;
    height: 451px;
    min-width: 1000px;
	background-color:#60d0d2;
}
.newpage{
	color:#666666;
	text-align:center;
	margin:0 auto;
	text-align:center;
	width:100%;



}
img.news_mobile{
	display:none;
}
.news {
    text-align: center;
	padding-bottom: 50px;
	font-weight:bold;
	width:100%;
	
	

}
.news img {
    padding: 20px 30px;

	margin:0 auto;
}
.block2{
	background-color:#eeffff;
}
.news p{
	width:700px;
	margin:0 auto;
	text-align:left;
	font-size:18px;
	color:#888888;
	letter-spacing:1px;
}
.news p a { color: #00a0a2; text-decoration: underline;}
.block{
	width:100%;
	margin:0 auto;
}
.block ul li{
	display:inline-block;
	width:340px;
	vertical-align:top;

}
.block ul li p{
	width:67%;
	text-align:justify;
	font-size:24px;


}
.block ul li span{
	font-size:18px;


}

.block ul li b{
	color:#00b3b6;
}
.block0{
display:inline-block;
padding-top: 50px;
}
.block0 .list{
	width:900px;
	text-align:center;
	margin:0 auto;
	color:#888888;

	
}
.block0 .list ul li{
	float:left;
	text-align:left;
	font-size:24px;
	width:700px;
	padding:15px 0 15px 5px;
	vertical-align:top;

}
.block0 .list ul li.one{
	width:190px;
    margin: 0;
	background-image:url(../images/tag.jpg);
	background-repeat:no-repeat;
	color:#FFF;
	background-position:center;
}
.block2  b, .block4 b {
	border-radius:30px;
	border:none;
	padding:15px 55px;
	margin:15px 0;
	text-align:left;
	
}
.block3{
	padding-bottom:0;
}

.news_b{
    margin: 20px auto;

}
.news_a{
    margin: 0px auto;
	margin-bottom: 60px;

}


.new_mo{ font-weight: bold!important;
}

.sub_title{font-weight: bold; color:#00a0a2;
}

.table_pc{margin: 20px 0 40px 0;}
.table_m{margin: 20px 0 40px 0; display: none;}