@charset "utf-8";
* {
	box-sizing:border-box;
}
html, body {
	height: 100%;
}
body {
    margin: 0;
    padding: 0;
	font-family: 'Roboto','Noto Sans TC', '微軟正黑體',sans-serif;
	font-size: 16px;
	color:#474643;
	overflow-x: hidden;
	background: #fefefe;
}

img {
    vertical-align: top;
}

h1,h2,h3,h4,h5,p,a {
    text-justify: auto;
    text-decoration: none;
    text-align: justify;
}

.clear-float {
	clear: both;
}
.center {
	text-align: center;
}
.section {
	position: relative;
}
.img-full {
	width:100%;
	height: auto;
}
.hide-pc {
	display: none!important;
}
#ClickTitle {
	height: 74px;
	position: relative;
	z-index: 100;
}
.fixed-width {
    width: 100%;
    margin: 0 auto;
	position: absolute;
	height: 100%;
}

h2.title {
	font-size: 38px;
	margin:0 0 50px 0;
	font-weight: 500;
}

.wrap {
}

/*header --------------------------*/
.header-bak {
	position: relative;
    width: 100%;
	height: 0;
	padding-bottom: 55%;
	background-color: #fff;
    background:url("https://www.1111edu.com.tw/edm/event/20260521/images/header-bg.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
	background-attachment: fixed;
	margin:0 0 0 0;
	overflow: hidden;
}

.header-bak .logo{
	position: absolute;
	width: 12%;
	min-width: 100px;
	z-index: 999;
	top: 15px;
	right: 100px;
}


.header-bak .fixed-width img{
	position: absolute;
	z-index: 5;
}

.person {
	left:50%;
	transform: translate(-50%,0);
	bottom:0;
	z-index: 9!important;
	width: 39%;
	max-width: 485px;
}

.main-title {
	right:20px;
	bottom:-10px;
	z-index: 10!important;
	width: 70%;
	max-width: 640px;
}
.house1 {
	top:30px;
	left: 30px;
	width: 35%;
}
.house1-mask {
	position: absolute;
	top:30px;
	left:30px;
	overflow: hidden;
	width:470px;
	height: 618px;
	background-image:url("https://www.1111edu.com.tw/edm/event/20260521/images/house1.png");
	-webkit-animation: play 7s steps(3) infinite alternate;
    animation: play 7s steps(3) infinite alternate;
}
@-webkit-keyframes play {
   from { background-position:    0px; }
     to { background-position: -1410px; }
}

@keyframes play {
   from { background-position:    0px; }
     to { background-position: -1410px; }
}

.house2-mask {
    width: 50%;
	max-width: 608px;
    aspect-ratio: 608 / 532;/* 依照原圖比例自動縮放 */
    position: absolute;
    background-image: url("https://www.1111edu.com.tw/edm/event/20260521/images/house2.png");
    background-repeat: no-repeat;
    /* 背景總寬度放大三倍 */
    background-size: 300% 100%;
    background-position: 0 0;
    animation: play2 2.5s steps(3) infinite;
	z-index: 7;
	right: 0;
	top: 50px;
}

@-webkit-keyframes play2 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 150% 0;
  }
}

@keyframes play2 {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 150% 0;
  }
}
.house2 {
	/*top:40px;
	right: -10px;*/
}

.rec-g2 {
	top:150px;
	left:-270px;
}
.rec-b {
	top:80px;
	left:-120px;
}
.dot-w2 {
	top:450px;
	left:-170px;
}
.rec-g3 {
	top:600px;
	left:-90px;
}
.dot-y {
	top:40px;
	left:700px;
}
.rec-y {
	top:50px;
	right:-145px;
}
.dot-b {
	top:380px;
	right:-260px;
}
.rec-g {
	top:600px;
	right:-150px;
}
/*section2 -----------------*/
.section2 {
	padding:60px 0;
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/section2.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
	overflow: hidden;
}
.section2 h2.title {
	color:#fff;
	font-style: italic;
	letter-spacing: 3px;
	text-align: center;
	font-weight: 700;
}
.section2 section {
	margin:0 auto;
	overflow: hidden;
}

.section2 .fixed-width{
	position: relative;
	height: auto;
	overflow: hidden;
}

.section2 .fixed-width div {
	float: left;
	color:#fff;
	font-size: 20px;
	width:33.3%;
}
.section2 img {
	display: block;
	margin:0 auto;
	width: 65%;
	max-width: 220px;
}
.section2 h3 {
	color:#f7bd00;
	text-align: center;
	letter-spacing: 2px;
	font-size: 24px;
	margin:7px 0 10px 0;
	font-weight: 700;
}
.section2 p {
	text-align: center;
	font-weight: 700;
	letter-spacing: 1px;
	font-size: 18px;
	line-height: 1.4;
}
@media(max-width:768px){
.section2 h2.title {
    font-size: 19px;
}
	
.section2 h3 {
    font-size: 18px;
}
	
.section2 p {
    font-size: 15px;
}
}
/*section3 ----------------*/
.section3 {
	padding:50px 0 90px 0;
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/section3-bg.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
}
.section3 h2.title {
	color:#2d2b26;
	font-style: italic;
	letter-spacing: 0px;
	font-size: 48px;
	margin-top:71px;
	margin-bottom:18px;
	line-height: 1.4em;
	font-weight: 700;
}
.section3 h2.title span {
	color:#F7BD00;
}
.section3 .box1 {
	float: left;
	width:45%;
	padding-left: 40px;
}
.section3 .box2 {
	float: left;
	width:45%;
	margin-left: -3%;
}
.section3 .tag {
	display: inline-block;
	color:#413f3f;
	border:1px solid #413f3f;
	border-radius: 50px;
	font-size: 18px;
	font-style: italic;
	text-align: center;
	margin: 0 18px 20px 0;
	padding:4px 14px;
}
.line-container {
  	width: 1px;
  	height: 110px;
  	position:absolute;
  	margin-bottom: 100px;
	bottom:-230px;
	left: 150px;
}
.line {
  	position: absolute;
  	width: 1px;
  	height: 0px;
  	background-color: #474743;
  	top: 0;
  	bottom: initial;
  	animation: line-animation 2.5s ease-in-out 0s infinite normal; 
}

@keyframes line-animation {
  0% {height: 0px; top: 0px;}
  50% {height: 110px; top: 0px;}
  100% {height: 0px; top: 110px;}
}

/*section4 ---------------------*/
.section4 {
	background: #f9f9f9;
	padding:60px 15px;
	overflow: hidden;
}
.section4 section {
	position: relative;
	margin:0 0 100px 0;
}

.section4 .fixed-width2 {
    margin: 0 auto;
    position: relative;
}

.section4 section > div {
	float: right;
}
.section4 .content {
	padding:30px 0 0 65px;
	width: 45%;
	position: relative;
	z-index: 30;
}
.section4 h2.title {
	font-style: italic;
	color:#F7BD00;
	margin:0 0 0px 0;
	letter-spacing: 1px;
	font-weight: 800;
}
.section4 h3 {
	font-style: italic;
	font-size: 17px;
	text-decoration: underline;
	font-weight: 600;
	margin:15px 0 20px 0;
	letter-spacing: 1px;
	color:#61605d;
	line-height: 1.3;
}
.section4 ul {
	margin:0 0 50px 0;
	padding-left: 15px;
}
.section4 ul li{
	color:#61605d;
	line-height: 2.2em;
	letter-spacing: 1px;
	font-size: 18px;
	font-weight: 600;
}
.section4 .num {
	position: absolute;
	bottom:-30px;
	right: 10px;
}
.section4 .class-dot {
	position: absolute;
	bottom:0;
	right: 282px;
}
.section4 .deco {
	position: absolute;
	width: 10%;
	aspect-ratio:300 / 300;
	background: #ededed;
	top:0;
	left: -20px;
}
.section4 .deco2 {
	background: #F7BD00;
	width: 10%;
	aspect-ratio:200 / 200;
	left:46%;
	bottom:0;
	top:inherit;
}
.recruitment{
	position: relative;
	overflow: hidden;
	width: 55%;
	height: 370px;
	z-index: 20;
}
.recruitment img {
	width: 468px;
	height: 350px;
}

@media(max-width:768px){
.section4 {
	padding:15px;
}
	
.section4 section > div {
	float: none;
}
.section4 ul {
	margin:0;
}
	
.section4 .deco2 {
	background: #F7BD00;
	width: 10%;
	aspect-ratio:200 / 200;
	left:90%;
	bottom:unset;
	top:200px;
}
	
.section4 .content {
	width: 100%;
	padding: 15px;
}
	
.section4 .recruitment{
	width: 100%;
}
	
.section4 .num {
    bottom: unset;
    right: 10px;
	top: 5%;
}
	
.section4 section {
    margin: 0 0 15px 0;
}
	
.section4 h3 {
    margin: 10px 0 15px 0;
}
}

/* section5 ----------------*/
.section5 {
	clear: both;
	padding:60px 0 60px 0;
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/section5-bg.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
	background-attachment: fixed;
	overflow: hidden;
}
.section5 section {
	margin:0 0 85px 0;
}
.section5 h2 img {
	display: block;
	margin:0 auto 20px auto;
}
.section5 section > p {
	font-size: 20px;
	color:#fff;
	text-align: center;
	margin:0 0 40px 0;
	letter-spacing: 1px;
	font-weight: 600;
	line-height: 1.4;
}
.section5 section > p span {
	font-style: italic;
	color:#F7BD00;
}
#por-recruitment, #com-recruitment {
	width: 100%;
	height: 375px;
	overflow: hidden;
}
#por-recruitment img, #com-recruitment img {
	height: 375px;
	width: auto;
}
.license, .bar {
	display: block;
	margin:0 auto;
}
.lic-area .license{
	width: 100%;
}

.bar{
	width: 80%;
	margin: 0 auto;
}
.lic-area .license-l,.bar-l{
	display: none;
}

@media(max-width:768px){
.section5{
	padding: 15px;
}
	
.section5 h2 img {
	width: 90%;
	margin: 0 auto;
	margin-bottom: 20px;
	max-width: 390px;
}
.license, .bar {
	display: none;
}
	
.lic-area .license-l{
	display: block;
	width: 60%;
	margin: 0 auto;
}
	
.bar-l{
	display: block;
	width: 80%;
	margin: 0 auto;
}
}

/*�]���O ----------*/
.marquee {
    height: 50px;
    overflow: hidden;
    position: relative;
    background: #f99616;
    color: white;
}
.marquee p {
    cursor: default;
    width: 100%;
    width: max-content;
    width: -moz-max-content;
    position: absolute;
    left: 0%;
    margin: 0;
    line-height: 50px;
	font-size: 18px;
}
.marquee p{
    animation: marqee 15s linear infinite;
}
@keyframes marqee {
  0% {
    left: 0%;
    transform: translateX(0%);
  }
  100% {
    left: 0%;
    transform: translateX(-10%);
  }
}
@media(max-width:768px){
.section5 {
	padding:15px 0;
}
	
.section5 section {
	margin:0 0 15px 0;
	font-size: 17px;
}
	
.section5 section > p {
    margin: 15px;
	font-size: 17px;
}
}
/*section6 ---------------*/
.section6 {
	padding:60px 0;
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/section6-bg.jpg") no-repeat;
    background-position: bottom center;
    background-size: cover;
	overflow: hidden;
}
.section6 .fixed-width {
	position: relative;
	height: auto;
}
.section6 h2.title {
	text-align: center;
	font-style: italic;
	color:#103d65;
	letter-spacing: 1px;
	margin:0 0 10px 0;
	font-weight: 500;
}
.section6 div > p {
	font-size:22px;
	text-align: center;
	font-style: italic;
	color:#103d65;
	letter-spacing: 2px;
	margin:0 0 50px 0;
}
.section6 section {
	margin:0 auto;
	height: auto;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.section6 section div, .section6 section img {
	float: left;
}
.section6 section img {
	margin:0 10px;
}
.section6 section .section6img{
	display: none;
}
.section6 section div {
	width:15%;
	background: url("https://www.1111edu.com.tw/edm/event/20260521/images/pattern.png");
	background-color: #f99616;
	color:#fff;
	padding:15px 0;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
	margin-top: 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.section6 h3 {
	font-size: 32px;
	font-style: italic;
	letter-spacing: 3px;
	margin:0 0 -5px 0;
	font-weight: 400;
	text-align: center;
} 
.section6 h4 {
	font-size: 20px;
	font-style: italic;
	letter-spacing: 4px;
	font-weight: 400;
	text-align: center;
	margin: 0;
	padding-top: 10px;
}
@media(max-width:768px){
.section6{
	padding: 20px;
}
.section6 section div,.section6 section img{
	display: none;
}
.section6 h2.title {
    font-size: 25px;
}
.section6 div > p {
    margin: 0 0 10px 0;
	font-size: 16px;
}
.section6 section img.section6img{
    margin: 10px auto;
    display: block;
    width: 100%;
	max-width: 420px;
}
}
/*section7 --------------*/
.section7 {
	padding:60px 0 50px 0;
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/section7-bg.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
	overflow: hidden;
}
.section7 h2.title {
	text-align: center;
	font-style: italic;
	color:#103d65;
	letter-spacing: 1px;
	margin:0 0 8px 0;
	font-weight: 500;
}
.section7 .company-logo {
	display: block;
	margin:0 auto 30px auto;
}
.section7 .company-area {
	width:1050px;
	margin:0 auto;
	height: 450px;
}
.section7 .company-area-d{
	width:70%;
}
.section7 .company-area-m{
	display: none;
	width:70%;
	margin:0 auto;
	height: auto;
}
.section7 .sub-title {
	font-size: 22px;
	text-align: center;
	font-style: italic;
	color:#103d65;
	letter-spacing: 2px;
	margin:0 0 40px 0;
}
.section7 .sub-title span {
	color:#F7BD00;
}
.section7 .pro-txt {
	font-size: 0.8em;
	color:#787878;
	text-align: center;
	display: block;
	margin:20px 0 0 0;
}

.company-area .slick-slide img {
    width: 100%;
}

.company-area .slick-slide{
	height: auto;
}
@media(max-width:768px){
.section7 h2.title {
    font-size: 24px;
}
	
.section7 .sub-title {
    font-size: 18px;
}

.section7 .company-area-d{
	display: none;
}
	
.section7 .company-area-m{
	display: block;
}
	
.company-area-m .slick-slide img {
    display: block;
    width: 100%;
}
}
/*��� ---------------------------*/
/*�{�r*/
.flicker{
    animation-duration: 0.7s;
    animation-name: blink;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in-out;
}
@keyframes blink {
	0% {
        color: #fff;
    }
    80% {
        color: #fff;
    }
    81% {
        color:#fec019;
    }
    100% {
        color:#fec019;
    }
}
.section-form {
	background:url("https://www.1111edu.com.tw/edm/event/20260521/images/form-bg.jpg") no-repeat;
    background-position: top center;
    background-size: cover;
	overflow: hidden;
	padding:50px 0 60px 0;
	width: 100%;
   border-bottom:  2px solid #f7bd00
}
.title-area {
	text-align: center;
	margin:0 0 50px 0;
}
.title-area h2.title {
	display: inline-block;
	font-size: 36px;
	margin:0 0px 0 0;
	letter-spacing: 2px;
	vertical-align: bottom;
	color:#fff;
	font-weight: 500;
	margin-bottom:7px;
	font-style: italic;
	text-align: center;
}
.title-area h2.title strong{
	font-style: italic;
	font-size: 52px;
}
.form-wrap {
	float: left;
	padding: 0 100px;
	width: 100%;
}
.form-area {
	width: 49%;
	float:left;
	margin:0 0 0 2%;
}
.gift-area {
	float: left;
	width: 47%;
	margin-right: 2%;
	position: relative;
}
.gift {
	position: relative;
	top:20px;
}
.free {
	position: absolute;
	top:40px;
	right: 20px;
}
/* ��檫�� */
input.form_input, #ct1, #ct2 {
	font-family: inherit;
	height: 42px;
	margin:0 0 10px 0px;
}
.labelcolor{
	color:#fff;
	margin-right: 5px;
}

#ct1, #ct2 {
	width: 38.1%;
}
input.form_input:hover, #ct1:hover, #ct2:hover
,input.form_input:focus, #ct1:focus, #ct2:focus{
	border:1px solid #F7BD00;
}
#mailSubmit {
	font-family: '�L�n������','Arial', sans-serif;
	width: 78%;
	height: 45px;
	font-size: 22px;
	color:#fff;
	background: #f12626;
	font-weight: 600;
	letter-spacing: 1px;
	border-radius: 2px;
	display: block;
	margin: 0 0 0 7px;
}
#mailSubmit:hover {
	background:#f12626;
}
.agree-area {
	font-size: 13px;
	margin:5px 0 16px -90px;
}
#checkbox1 {
	position: relative;
	top:3px;
}
.check_txt_a {
	color:#ffcc00;
}
/* ��檫�� end */
.goform {
	position:fixed;
	display: block;
	z-index: 500;
	right:25px;
	bottom:60px;
}
.goform a {
	display: block;
	width:100%;
	height: 100%;
	text-align: center;
	transition: 0.2s;
	color:#fff;
}
.goform i {
	font-size: 13px;
	position: relative;
	left: 4px;
	top:-1px;
}
.goform img {
	width: 52px;
}

@media screen and (max-width:1400px) {
}

