﻿html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing:0;}

body{
	font-family:"微軟正黑體" !important;
}
.clearfix{clear:both;}

/*desktop*/

/*2018.5/18增加置頂選單*/
.top{ margin:0; padding:0;
	width:100%;
	height:60px; line-height:60px;
	background-color:#000;
	font-size:1.1em; color:#666;
	position:fixed; z-index:999;
	top:0;
	text-align:center;
	}
.top a{ text-decoration:none; color:#FFF;}
.top a:hover{ text-decoration:underline;}

/* == 麵包屑 == */
.path{box-sizing: border-box;margin:60px auto 0 auto; width:100%; padding:0 0 0 20px; font-size:16px; line-height:50px; color:#000; background:#FFF; }
.path ol{ margin:0; padding:0; width:100%;}
.path li{ margin:0; padding:0; display:inline-block;}
.path li a{ color:#000; text-decoration:underline;}
.path li a:hover{ text-decoration:none;}

/*nav*/
nav{background: #572100;width: 100%;text-align: center;padding: 20px calc((100% - 600px)/2);box-sizing:border-box;}
nav ul{display: flex;justify-content:space-around;}
nav ul li{background: #fff;border-radius: 50px;padding:10px 20px;position: relative;overflow: hidden;}
nav ul li a{transition: all .5s;text-decoration: none;color: #000;font-weight: bold;font-size: 24px;position: relative;z-index:50;}
nav ul li::before{content:'';transition: all .5s;display: block;width:0%;height: 100%; position: absolute;left: 0;top: 0;bottom: 0;background:#873400;opacity: 0.5;}
nav ul li::after{content:'';transition: all .5s;display: block;width:0%;height: 100%; position: absolute;right: 0;top: 0;bottom: 0;background: #873400;opacity: 0.5;}
nav ul li:hover::before{width: 50%;}
nav ul li:hover::after{width: 50%;}
nav ul li:hover a{color: #fff;}
/* nav ul li a:hover{color: #fff;} */

/* header */
header{width:100%;height: 0;background:url(../images/header.jpg)no-repeat;padding-bottom:41.3%;position: relative;overflow: hidden;background-size: cover;}
.header-1{width:100%;height: 0;background:url(../images/header-1.png)no-repeat;padding-bottom:41.3%;position: absolute;transform-origin:600px 99px;background-size: cover;}
.header-2{width:100%;height: 0;background:url(../images/header-2.png)no-repeat;padding-bottom:41.3%;position: absolute;background-size: cover;}
.header-2{
	animation:lr 3s linear;
	/* animation: cc 20s linear infinite;  */
}

@keyframes lr{	
0%{transform: translateX(1200px) rotateY(180deg);}
65%{transform:translateX(-1300px) rotateY(180deg);}
66%{transform:translateX(-1300px) rotateY(0deg);}
100%{transform:translateX(0px);}
}

@keyframes cc{
	0%{transform: translateX(1200px) rotateY(180deg);}
	20%{transform:translateX(-1300px) rotateY(180deg);}
	21%{transform:translateX(-1300px) rotateY(0deg);}
	40%{transform:translateX(1500px) rotateZ(0deg);}
	42%{transform: translateX(1500px) rotateZ(180deg);}
	60%{transform: translateX(-1400px) rotateZ(180deg);}
	61%{transform:translateX(-1100px) rotateZ(0deg);}
	80%{transform:translateX(1500px) rotateZ(360deg);}
	82%{transform: translateX(1500px) rotateZ(0deg);}
	100%{transform: translateX(-1400px) rotateZ(360deg);}
}

.header-2::after{content: ''; width: 100%;height: 0;background: url(../images/header-3.png)no-repeat;padding-bottom: 41.3%;position: absolute;transform-origin:58.28125% center;background-size: cover;}
.header-2::after{content: ''; transform: rotateY(0deg);animation:rotate .8s linear infinite;}
@keyframes rotate{
from{transform: rotateY(0deg);}
to{transform: rotateY(180deg);}
}

/*main*/
/* main01 */
.main01{overflow: hidden; position: relative; background: #ee363f;padding: 40px 0 380px 0;padding-right:calc((100% - 1200px)/2);padding-left:calc((100% - 1200px)/2); text-align: center;}
/*width:1200px;*/
.main01 h2{font-size: 60px;color: #fff;line-height: 2;}

.main01 .row-1{margin: 0 auto;margin-top: 30px;}
.main01 .row-2{display: flex;justify-content:space-between;transform: translateY(60px);}

.main01 .box{cursor:default;color: #fff;width:380px;border-radius:30px;box-sizing: border-box;padding:10px;display: flex;align-items: center;justify-content:center;}
.main01 .box::after{content: '';display: block;clear:both;}
.main01 .box p:first-child{display: block;font-size: 90px;font-weight:bold;margin-right: 10px;font-family: "Arial";}
.main01 .box p:nth-child(2){font-size:28px;text-align: left;line-height: 1.2;font-weight: bold;}
.main01 .box p:nth-child(2) span{display: block;color:yellow;font-size:36px;}
.main01 .box1{background:#22ac38;transform: translateX(-150px);}
.main01 .box2{background:#00b7ee;width: 400px;}
.main01 .box3{background:#556fb5;transform: translateX(150px);}
.main01 .row-2 .box2{display: none;}

.main01 .base{position: absolute;bottom: 0;left: 0;right: 0;height: 0;width: 100%;text-align: center;display: flex;transform:translateY(-350px);}
.main01 .circle{margin: 0 auto; width:850px;height:600px;background: #fff;border:20px solid #eeeeee;border-bottom:0px solid #eeeeee;border-top-left-radius: 99em;border-top-right-radius: 99em;box-sizing: border-box;padding:80px 10px;}
.main01 .circle p:first-child{font-size: 50px;font-weight: bold;margin-bottom:40px;}
.main01 .circle p:first-child span{color: #ee363f;font-size:65px;}

.main01 .triangle{transition: all 1.5s;height: 0;position: absolute;left:calc(50% - 60px);bottom:100px;z-index: -1;display: flex;transform-origin:center 400px;transform: rotate(-50deg);}
.main01 .triangle::before{content:'';display:block;width:0px;height:0px;border-bottom:150px solid #2f7aa5;border-right:30px solid #2f7aa5;border-top:150px solid transparent; border-left:30px solid transparent;}
.main01 .triangle::after{content:'';display:block;width:0px;height:0px;border-bottom:150px solid #205472;border-left:30px solid #205472;border-top:150px solid transparent; border-right:30px solid transparent;}

.main01 .circleP{
	font-size: 26px;
	font-weight: bold;
}
.main01 .circle .circle-p1{
	color: #22ac38;
}
.main01 .circle .circle-p1::before{
	content:'薪水高';
	color: #fff;
	background:#22ac38;
	padding:4px 8px;
	margin-right:8px; 
}
.main01 .circle .circle-p2{
	color: #00b7ee;
}
.main01 .circle .circle-p2::before{
	content:'門檻低';
	color: #fff;
	background:#00b7ee;
	padding:4px 8px;
	margin-right:8px; 
}

.main01 .circle .circle-p3{
	color: #556fb5;
}
.main01 .circle .circle-p3::before{
	content:'上榜快';
	color: #fff;
	background:#556fb5;
	padding:4px 8px;
	margin-right:8px; 
}
.main01 .circle>a{text-decoration: none;padding:5px 10px;border-radius: 10px;display:inline;line-height:4;font-size: 30px;color: #fff;}
.main01-mobile{display: none;}

/* main02 */
.main02{padding:60px calc((100% - 1000px)/2);padding-bottom: 0;}
/*width: 1000px;*/
.main02 h3{ font-size: 48px;font-weight: bold;color: #fff;background: #000;padding:15px 0;text-align: center;}
.main02 .content{height: 590px;transform: translateY(-15px);display: flex;justify-content: space-between;align-items: center;}
.main02 .main02an{animation:main02an 1.6s linear;}
@keyframes main02an{
from{width:0%;overflow: hidden;overflow-x:hidden;display: block;}
to{width: 100%;overflow: auto;overflow-x:hidden;display: block;}
}
.main02-1{display: none;}
.main02 .content .chat{display: none;}
.main02 .content .chat{transform:translateX(-10px); border-radius:30px;background:#00b7ee;padding: 20px;box-sizing: border-box;color: #fff;font-size: 36px;position: relative;line-height: 1.3;}
.main02 .content .chat::before{
	content:'';
	width: 0;
	height: 0;
	position: absolute;
	left:-70px;
	top:15%;
	z-index:2;
	display: block;
	border-top:5px solid #fff;
	border-right:35px solid #fff;
	border-left:35px solid transparent;
	border-bottom:5px solid transparent;
}
.main02 .content .chat::after{
	content:'';
	width: 0;
	height: 0;
	position: absolute;
	left:-50px;
	top:15%;
	z-index:1;
	display: block;
	border-top:15px solid #00b7ee;
	border-right:25px solid #00b7ee;
	border-left:25px solid transparent;
	border-bottom:15px solid transparent;
}
.main02 .content .chat span{color:#ffea01;}
.main02-mobile{display: none;}

/* main03 */
.main03{transform: translateY(-15px);text-align: center;background: linear-gradient(to bottom left,#fc7e7a,#ffd342);padding: 60px calc((100% - 1000px)/2);}
/*width:1000px;*/
.main03 h4{font-size: 60px;text-align: center;}
.main03>ul{width: 100%;margin-top: 40px;display: flex;justify-content: space-between;}
.main03 ul img{width: 100%;}
.main03 ul li ul li{color: #fff;margin-top: 10px;text-align: center;padding: 10px 15px;font-size: 30px;}
.main03>ul li:first-child ul li{background: #009944;}
.main03>ul li:nth-child(2) ul li{background: #00b7ee;}
.main03>ul li:nth-child(3) ul li {background: #556fb5;}
.main03>p{line-height:4;font-size: 26px;font-weight: bold;}
.main03>a{background:#d6001a;color: #fff;font-weight: bold;text-decoration:none;padding:5px 50px;border-radius: 10px;font-size: 30px;}
.main03>a:hover{box-shadow:0 0 15px#FF0F2B;}
.main03>a:active{background:#990012;}

/* main04 */
.main04{padding: 60px calc((100% - 1000px)/2) 120px calc((100% - 1000px)/2);}
/*width: 1000px;*/
.main04 h5{font-size: 60px;position: relative;text-align: center;font-weight: bold;}
.main04 h5::before{content:'';position: absolute;left:20px;top:-10px;display:block;background:url(../images/main04-1.png)no-repeat;width: 160px;height:75px;}
.main04 h5::after{content:'';position: absolute;right:20px;top:-10px;display:block;background:url(../images/main04-1.png)no-repeat;width: 160px;height:75px;}

.main04 ul li{display: flex;justify-content:space-between;align-items: center;margin-top: 20px;width: 100%;border-radius: 10px;background: #eeeeee;padding:40px;box-sizing: border-box;}
.main04 ul li:first-child{margin-top:40px;}
.main04 ul li .content{width: 70%;}
.main04 ul li img{max-width:200px;height:200px;}
.main04 ul li .head{color: #009944;font-size: 30px;font-weight: bold;}
.main04 ul li .name{font-size: 24px;font-weight:bold;line-height: 2;}
.main04 ul li .name span{color:red;}
.main04 ul li .exp{color: #767676;font-size: 18px;margin-bottom:20px;line-height: 1.5;}
.main04 ul li a{text-decoration:none;border-radius:10px; background: #eb6100;color: #fff;font-size: 24px;padding:5px 10px;font-weight: bold;}
.main04 ul li a:hover{box-shadow:0 0 15px #F06400;}
.main04 ul li a:active{background:#A34400;}

/* == 班址 == */
.footer{ width:100%; background-color:#888;  overflow:hidden;}
.footer-con{ margin:0 auto; padding:50px 0; max-width:1200px; display: flex; justify-content: center; align-items: center; overflow:hidden; }
.footer-conL{ max-width:230px;}
.footer-conR ul{ margin:0; display: flex; flex-wrap: wrap;}
.footer-conR li{ width: 24%;}
.footer-conR li a{ display:block; padding:0; margin:0 40px 10px 0; height:21px; font-size:20px; text-decoration:none; color:#FFF; }
				   
/*other*/
@media(max-width:1530px){
.main01 .box{padding: 0;}
.main01 .box1{transform: translateX(-100px)}
.main01 .box3{transform: translateX(100px)}
}

@media(max-width:1420px){
	.main01 .row-2{margin-top:100px;}
	.main01 .triangle{transform: rotate(-45deg);}
	.main01 .box{width:auto;padding:10px 20px;}
	.main01 .box p:first-child{font-size: 75px;}
	.main01 .box2{display:none;}
	.main01 .box1{transform: translateX(0px)}
	.main01 .row-2 .box2{display: block;transform: translateY(-100px);display: flex;justify-content: space-between;}
	.main01 .box3{transform: translateX(0px)}
	.main01 .base{transform: translateY(-300px);}
	.main01 .circle{padding-top: 70px;}
	.main01 .circle p:first-child{margin-bottom:30px;}
	.main01 .circle>a{line-height: 3.5;}
}

@media(max-width:1240px){
	.main01{padding:40px 2.5% 380px 2.5%}
	/*width: 95%;*/
	.main01 .circle{padding-top: 50px;}
	.main01 .circle p:first-child{margin-bottom:30px;}
	.main01 .circle>a{font-size: 26px;}
}
@media(max-width:1120px){
	.main01{padding-bottom:330px;}
	.main01 .base{transform:translateY(-250px) scale(0.8);}
	.main01 .box p:first-child{font-size: 65px;}
	.main01 .box p:nth-child(2){font-size: 22px;}
}
@media(max-width:1060px){
	.main01 .box {width: auto;padding: 10px;}
	.main01 .box p:nth-child(2) span{font-size: 30px;}
	.main01 .row-2 {transform: translateY(40px);}
	
	.main02{padding: 60px 2.5% 0 2.5%;}
	/*width: 95%;*/
	.main02-1{display:block;opacity:0;}
	.main02 .content{height: auto;}
	@keyframes main02an{
		from{opacity: 0;}
		to{opacity: 1;}
	}
	.main02 .content img{width:60%;}

	.main03{padding: 60px 2.5% 60px 2.5%;}
	/*width: 95%;*/
	.main03 h4{font-size: 52px;}

	.main04{padding: 60px 2.5% 60px 2.5%;}
	/*width: 95%;*/
	.main04 h5{font-size:55px;}
	.main04 h5::before{transform: scale(0.6);left:1vw;}
	.main04 h5::after{transform: scale(0.6);right:1vw;}
}
@media(max-width:940px){
	.main01 .triangle{transform: rotate(-30deg);}
	footer{width: 98%;padding:40px 1%;}
}
@media(max-width:1060px) and (min-width:769px){
.footer{ width:100%; background-color:#2c3c49; overflow:hidden;}
.footer-con{ padding:50px 0; width: 100%; display: flex; justify-content: center; align-items: center; overflow:hidden; }
.footer-conL{ max-width:230px;}
.footer-conR ul{ margin:0; display: flex; flex-wrap: wrap;}
.footer-conR li{ width: 25%;}
.footer-conR li a{ display:block; padding:0; margin:0 0 10PX; height:21px; font-size:18px;}/* footer */
.footer{ margin:1px 0 0;width:100%; background-color:#2c3c49; overflow:hidden;}
.footer-con{ padding:50px 0; width: 100%; display: flex; justify-content: center; align-items: center; overflow:hidden; }
.footer-conL{ max-width:230px;}
.footer-conR ul{ margin:0; display: flex; flex-wrap: wrap;}
.footer-conR li{ width: 25%;}
.footer-conR li a{ display:block; padding:0; margin:0 0 10PX; height:21px; font-size:18px;}
}
/*ipad*/
@media(max-width:768px){
/*2018.5/18增加置頂選單*/
.top{ margin:0; padding:0;
	width:100%;
	height:60px; line-height:60px;
	background-color:#000;
	font-size:1em; color:#666;
	position:fixed; z-index:999;
	top:0;
	text-align:center;
	}
.top a{ text-decoration:none; color:#FFF;}
.top a:hover{ text-decoration:underline;}	

/* == 麵包屑 == */
.path{ margin:60px auto 0 auto; padding:0 2%; width:100%; font-size:15px; line-height:50px; color:#666; }
.path ol{ margin:0; padding:0; width:100%;}
.path li{ margin:0; padding:0; display:inline-block;}
.path li a{ color:#000; text-decoration:underline;}
.path li a:hover{ text-decoration:none;}

/*nav*/

/* header */

/*main*/
/* main01 */
.main01{padding:40px 2% 300px 2%;}
/*width: 96%;*/
.main01 h2{font-size: 50px;}
.main01 .row-2{display: flex;justify-content: space-between;margin: 0;transform: none;}
.main01 .row-2 div{width: 32%;border:2px solid #fff;border-color:#fff #572100 #572100 #fff ; box-sizing: border-box;}
.main01 .row-2 div:active{border-color:#572100 #fff #fff #572100 ;}
.main01 .row-2 .box2{transform:none;padding-right: 5px;}
.main01 .box p:nth-child(2){font-size: 17px;}
.main01 .box p:nth-child(2) span{font-size: 26px;}
.main01 .base {transform: translateY(-270px) scale(1);}
.main01 .circle{height:150px;width:600px;border-radius: 0;padding: 0;border:10px solid #eeeeee;}
.main01 .circle p:first-child{margin-bottom: 20px;}
.main01 .triangle{display: none;}
.main01 .circle>a{line-height:6;}

/* main02 */
.main02{padding: 60px 2.5% 0 2.5%;}
/*width: 95%;*/
.main02 .content .chat{font-size: 28px;padding: 15px;line-height: 1.3;}
.main02 .content .chat::before{left:-60px;border-width: 5px 30px;}

/* main03 */
.main03{padding:60px 5% 60px 0;}
/*width: 95%;*/
.main03 h4{font-size:46px;font-weight: bold;text-align: center;transform: translateX(20px);}
.main03>ul{display: block;}
.main03>ul>li{display: flex;justify-content:center;flex-wrap: wrap;margin-top: 30px;}
.main03>ul>li:first-child{margin-top: 0;}
.main03 ul li img{width:40%;height: auto;transform: scale(0.8);}
.main03 ul li>ul{width:60%;}
.main03>p{line-height:3;}

/* main04 */
.main04{padding-left:2.5%;padding-right:2.5%;padding-bottom:50px;}
/*width: 95%;*/
.main04 h5{font-size: 50px;}
.main04 h5::before{transform: scale(0.6);left: -40px;}
.main04 h5::after{transform: scale(0.6);right: -40px;}
.main04 ul li{padding:30px 10px;}
.main04 ul li img{transform: scale(0.8);}
.main04 ul li .content{width:70%;}
.main04 .content .head{margin-bottom:10px;}
.main04 .content .name{line-height:1.8;}
.main04 .content .name span{display: block;font-size: 22px;}
.main04 .content .exp{line-height:2;margin: 10px 0;}
.main04 ul li a{font-size: 22px;line-height: 2;}

/* == 班址 == */
.footer{width:100%; background-color:#2c3c49; overflow:hidden;}
.footer-con{ padding:50px 0; display: flex; justify-content: center; align-items: center; overflow:hidden; }
.footer-conL{ max-width:230px;}
.footer-conR ul{ margin:0; display: flex; flex-wrap: wrap; gap: 15px;}
.footer-conR li{ width: 25%;}
.footer-conR li a{ display:block; padding:0; font-size:5vw;}

}


/*phone*/
@media(max-width:767px){

/*2018.5/18增加置頂選單*/
.top{ margin:0; padding:0;
	width:100%;
	height:50px; line-height:50px;
	background-color:#000;
	font-size:0.8em; color:#666;
	position:fixed; z-index:999;
	top:0;
	text-align:center;
	}
.top a{ text-decoration:none; color:#FFF;}
.top a:hover{ text-decoration:underline;}

/* == 麵包屑 == */
.path{ display:none;}
 
 .wrap{margin-top: 50px;}
/*nav*/
nav{width:100%;padding:10px 1%;}
nav ul li{padding: 10px;}
nav ul li a{font-size:4vw;}

/* header */
header{background:url(../images/header-mobile.jpg)no-repeat;padding-bottom:98.7%;background-size: cover;}
.header-1{display: none;}
.header-2{background:url(../images/header-2-mobile.png)no-repeat;padding-bottom:98.7%;background-size: cover;transform-origin: 64.7% center;animation:lr 1s linear infinite;}
.header-2::after{content: none;transform-origin:0% center;}
@keyframes lr{	
	from{transform: rotateY(0deg);}
	to{transform: rotateY(180deg);}
}
/*main*/

/* main01 */
.main01{display: none;}
.main01-mobile{display: block;background:#ee363f;padding:20px 3%;text-align: center;}
/*width:94%;*/
.main01-mobile h2{font-size:8vw;color:#fff;text-align: center;font-weight:bold;}
.main01-mobile ul{width: 94%;margin: 15px auto 15px auto;text-align: left;}
.main01-mobile ul>li{display: flex;justify-content:flex-start;font-size:4vw;margin-top: 20px;border-radius: 10px;padding:10px 20px 10px 20px;}
.main01-mobile ul li:first-child{background: #22ac38;margin: 0;}
.main01-mobile ul li:nth-child(2){background: #00b7ee;}
.main01-mobile ul li:nth-child(3){background: #556fb5;}

.main01-mobile ul>li p{color: #fff;font-weight: 700;}
.main01-mobile ul>li p span{display: block;}
.main01-mobile ul>li p:first-child{font-size:20vw;margin-right:10px;}
.main01-mobile ul>li p:nth-child(2) span{font-size:8vw;color:#fcff00;line-height:1.5;}
.main01-mobile ul>li p:nth-child(2){font-size:6vw;}
.main01-mobile>p{font-size:9vw;text-align: center;color: #fff;font-weight: bold;}

.main01-mobile .reson{text-align: left;background: #fff;box-sizing: border-box;border-radius: 10px;padding:10px;margin-top: 10px;}
.main01-mobile .reson ul{width: 100%;}
.main01-mobile .reson ul li{background: #fff;padding: 0;display: flex;justify-content: space-between;}
.main01-mobile .reson ul li p{display: block;color: #000;font-size:6vw;width:66%;line-height: 1.1;display:flex;align-items: center;}
.main01-mobile .reson span{color: #fff;padding: 10px;box-sizing: border-box;font-size:6vw;font-weight: bold;width:28%;display: flex;justify-content: center;align-items: center;}
.main01-mobile .reson ul li:first-child span{background: #22ac38;}
.main01-mobile .reson ul li:nth-child(2) span{background: #00b7ee;}
.main01-mobile .reson ul li:nth-child(3) span{background: #556fb5;}

.main01-mobile>a{font-weight:bold;background:gray;text-decoration: none;color: #fff;font-size:8vw;padding:5px 10px;line-height:3;border-radius: 10px;}

/* main02 */
.main02 h3{font-size:10vw;}
.main02 .content{position: relative;}
.main02 .content img{width: 100%;}
.main02-1{display: none !important;}
.main02-mobile{display:initial;}
.main02 .content .chat{order: -1;position: absolute;bottom:25%;left:5%;width:60%;font-size:6vw;}
.main02 .content .chat::before{
	content:'';
	left: auto;
	top: 20%;
	right:-30px;
	transform:rotateY(180deg);
	z-index:52;
    border-top:5px solid #fff;
    border-right:15px solid #fff;
    border-left:15px solid transparent;
    border-bottom:5px solid transparent;
}
.main02 .content .chat::after{
	content:'';
	left: auto;
	top: 20%;
	right:-30px;
	transform:rotateY(180deg);
	z-index: -1;
	border-top:15px solid #00b7ee;
	border-right:15px solid #00b7ee;
	border-left:15px solid transparent;
	border-bottom:15px solid transparent;
}

/* main03 */
.main03{padding: 40px 2%;transform: translateY(-50px);}
/*width:96%;*/
.main03 h4{transform: none;font-size:12vw;}
.main03>ul>li{display:flex;flex-wrap: wrap;margin-bottom:20px;}
.main03 ul li img{width: auto;}
.main03 ul li>ul{width: 98%;}
.main03>p{line-height: 2;font-size: 20px;margin-bottom: 20px;}

/* main04 */
.main04{padding:0 2.5% 40px 2.5%;}
.main04 h5{font-size:9vw;line-height: 2;}
.main04 h5::before{content:'';position: absolute;left:20px;top:35px;bottom: 0;display:block;background:url(../images/main04-1.png)no-repeat;width: 160px;height:75px;}
.main04 h5::after{content:'';position: absolute;right:20px;top:auto;bottom:35px;display:block;background:url(../images/main04-1.png)no-repeat;width: 160px;height:75px;transform:rotateY(180deg) scale(0.6);}

.main04 ul li{flex-wrap: wrap;text-align:right;}
.main04 ul li .content{width:98%;margin: 0 auto;}
.main04 ul li img{transform:none;display:block;margin: 0 auto;}
.main04 .content .head{font-size:6vw;text-align: center;line-height: 1.5;}
.main04 .content .exp{text-align:left;}
.main04 ul li .name{font-size:9vw;text-align: center;}

/* footer */
.footer{ width:100%; background-color:#2c3c49; overflow:hidden;}
.footer-con{ padding:50px 2%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; overflow:hidden; }
.footer-conL{ max-width:230px;}
.footer-conR ul{ width: 100%; margin:20px 0 0; display: flex; flex-wrap: wrap;}
.footer-conR li{ width: 30%;}
.footer-conR li a{ display:block; padding:0; margin:0px; font-size:4.5vw; color:#FFF;}

}

*{ margin:0; padding:0;}

html{ width:100%; height:100%; font-family:Arial, Helvetica,"微軟正黑體",sans-serif; text-size-adjust:none;
      font-size:15px;}
ul{ margin:0; padding:0; list-style:none;}
p{ margin:0; padding:0;}
        