﻿@charset "utf-8";
/* CSS Document */
body {
	background-repeat: repeat;
	font-family: "Microsoft YaHei", sans-serif;
}
/* 這是設定所有放大縮小的物件是使用移動方式變化 */
.tra{-webkit-transition: all 0.6s;
	-moz-transition: all 0.6s;
	-ms-transition: all 0.6s;
	-o-transition: all 0.6s;
	transition: all 0.6s;}
/* wow進場後額外繼續輪播的動畫 */
.myAni {
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
}

.myAni.infinite {
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.myAni.hinge {
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}
.myAni.infinite.pulse {
/*animation-delay: 2s;*/
-webkit-animation-name: pulse !important;
animation-name: pulse !important;
}
.wrapper{position:relative;}

/*表頭表尾 請勿砍*/
.top, .footer{
    line-height: 0px;
}
.top{
    z-index: 99;
    position: relative;
	top: 0;
}
/*很多物件通用*/
.BRR{height: 1px;}
.width1280{max-width:1280px;min-width:280px;height:auto;margin: 0  auto;}
.width1280_b{ background-image:url(../images/bg02.png);max-width:1280px;min-width:280px;height:auto;margin: 0  auto;}
.topICON{ text-align:center; padding-top:20px; padding-bottom:20px;}
.myButton {
  -moz-border-radius:28px;
  -webkit-border-radius:28px;
  border-radius:28px;
  display:inline-block;
  cursor:pointer;
  font-family:Arial;
  font-size:17px;
  padding:9px 33px;
  text-decoration:none;
}
.myButton:hover {
  background-color:#5cbf2a;
}
.myButton:active {
  position:relative;
  top:1px;
}



/*BANNER 進場delay時間、浮動*/

.banner{ position:relative; overflow:hidden;}
img.banner001, img.banner002, img.banner003,img.banner004,img.banner_bottom{position:absolute;}
img.banner001{-webkit-animation-delay: 1.2s; /* Chrome, Safari, Opera */animation-delay: 0.3s;}
img.banner002{-webkit-animation-delay:1s; /* Chrome, Safari, Opera */ animation-delay:1s;}
img.banner003{-webkit-animation-delay:1s; /* Chrome, Safari, Opera */ animation-delay:1s;}
img.banner004{-webkit-animation-delay:1s; /* Chrome, Safari, Opera */ animation-delay:1s;}
img.B_file{-webkit-animation-delay:1s; /* Chrome, Safari, Opera */ animation-delay:1s;}

/*表單區*/
.fill{background-image:url(../images/b_bg.png);position:relative;z-index:20;text-align:center;}

.fill h2{font-size: 38px;color: #FFF;text-align:center;/* line-height: 20px; *//* padding-bottom: 1px; */font-weight: bold;font-style: italic;}
.fill h2 .a01{font-size: 38px;color: #fff438;text-align:center;/* line-height: 2.2em; */padding-bottom:10px;font-weight: bold;font-style: italic;}
.fill h2 .a02{font-size: 38px;color: #3384c3;text-align:center;line-height: 44px;padding-bottom:10px;font-weight: bold;font-style: italic;}
.fill h2 .gray{color: #7a7781;line-height: 39px;font-size: 27px;}
.fill h2 .Bu{color: #0384c6;line-height: 42px;font-size: 40px;}
.fill .share{display: block;width:50%;margin:0 auto;}
.fill .share ul li{ float:left; list-style:none;}
.fill #sBut{display:block;max-width:527px;height:auto;min-width:280px;margin: 9px auto;width:100%;}
.fill .go_button{-webkit-animation-duration: 2s; /* Chrome, Safari, Opera */animation-duration: 2s;max-width: 220px;/* height:auto; */min-width: 200px;margin: -18px auto;}
.fill .statement{color: #606060;line-height:40px;}
.fill .statement a{color: #337ab7;}
.fill .statement a:hover{ color:#FFF;}
.fill .form-control{ margin-bottom:5px}

.face {
	position: absolute;
	width: 316px;
	height: 316px;
	backface-visibility: hidden;
	margin-left:-14px;
}   
.face.back {
  display: block;
  transform: rotateY(180deg);
  box-sizing: border-box;
  padding:0px;
  color: #FFF;
  font-size:14px;
  background-color: #696969;
}  
.face.back p{font-size: 16px;line-height:1.5em;/* padding-top:100px; */color:#FFF;align-content: center;padding: 74px;}

/*PIC通用*/
img.pic{max-width: 295px;min-width:200px;margin: auto;display:block;width:95%;height:auto;margin-top: 30px;}
img.pic2{max-width: 474px;min-width:303px;/* margin: 89px auto; */display:block;width: 124%;height:auto;margin-left: 193px;margin-top: 107px;}	
img.pic3{max-width: 617px;min-width:400px;margin: auto;display:block;/* width:95%; */height:auto;margin-top: 72px;}
img.girl{max-width: 818px;min-width:303px;margin: 47px auto;display:block;width: 162%;height:auto;margin-left: 149px;}
img.bn{max-width: 331px;min-width:250px;margin: 51px 114px;display:block;/* width:95%; *//* height:auto; *//* text-align: center; *//* align-content: flex-start; */}



/*	↓↓↓↓	螢幕尺寸大於960時頁面顯示效果↓↓↓↓	 */
@media (min-width: 960px) {
/*BANNER*/
/*表單區*/
.fill h2 .important{font-size:35px;}

img.banner001{display: block;top: 20%;left: 10%;z-index: 5;max-width: 654px;height:auto;width: 32vw;}
img.banner002{display: block;top: 35%;left: 10%;z-index: 5;max-width: 654px;height:auto;width: 32vw;}
img.banner003{display: block;top: 60%;left: 10%;z-index: 5;max-width: 599px;height:auto;width: 33vw;}
img.banner004{display: none;}
img.B_file{ position: absolute;top: 100%;left: 0%;z-index: 5;max-width: 914px;height: 100vh;width: auto; padding-top:0%;}
#B_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: normal; font-size: 2.35em; letter-spacing:0.2em; margin-bottom: 5%; line-height: 1.45em;}
#B_fill{ margin-left: 22%; margin-top: 17%;}
#C_reason{ margin-right:50%; padding-top: 5%;}

#inline{ display:inline-block;}
#rectangle_C { width: 50vw; height: 15px; background: #f9c31f; margin-top: 2%;}
#people_list{ font-size: 1.5em; color: #202020; line-height: 2em; text-align: left; padding-left:25%;}
#people_list2{ font-size: 1.5em; color: #202020; line-height: 2em; text-align: left; padding-left:25%;}

#FirstPage {
	background: #fff;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	display: inline-block;
	height: 50px;
	margin: 0 15px;
	overflow: hidden;
	position: absolute;
	bottom: 8%;
	right:45%;
	text-indent: 100%;
	white-space: nowrap;
	width: 50px;
}
#C_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 2.5em; letter-spacing:0.25em; margin-bottom: 5%; line-height: 1.45em; color: #f9c31f; text-align:center; padding-top: 8%;}
.C_section p{ text-align:center; margin-top: 10%;}
img.C_pic{ height: 100%; width: auto;} 
img.C_pic_960{ display: none;}
img.D_pic{ height: 100%; width: auto;} 
#D_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 2.5em; letter-spacing:0.25em; margin-bottom: 5%; line-height: 1.45em; color: #353383; text-align:center; padding-top: 8%;}
.D_section p{ text-align:center; margin-top: 7%;}
#rectangle_D { width: 50vw; height: 15px; background: #353383; margin-top: 2%;}
img.D_pic_960{ display: none;}
#E_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 2.5em; letter-spacing:0.25em; margin-bottom: 5%; line-height: 1.45em; color: #ff5b1a; text-align:center; padding-top: 8%;}
.E_section p{ text-align:center; margin-top: 10%;}
img.E_pic{ height: 100%; width: auto;} 
#rectangle_E { width: 50vw; height: 15px; background: #ff5b1a; margin-top: 2%;}
img.E_pic_960{ display: none;}
img.F_pic{ height: 100%; width: auto;} 
#F_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 2.5em; letter-spacing:0.25em; margin-bottom: 5%; line-height: 1.45em; color: #00837d; text-align:center; padding-top: 8%;}
.F_section p{ text-align:center; margin-top: 7%;}
#rectangle_F { width: 50vw; height: 15px; background: #00837d; margin-top: 2%;}
img.F_pic_960{ display: none;}
img.F_col{ display:block; margin:0 auto; margin-top:10%;}
img.F_col2{ display:none;}
#G_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 2.5em; letter-spacing:0.25em; margin-bottom: 5%; line-height: 1.45em; color: #ee771e; text-align:center; padding-top: 8%;}
.G_section p{ text-align:center; margin-top: 4%;}
img.G_pic{ height: 100%; width: auto;} 
img.G_pic_960{ display: none;}
#rectangle_G { width: 50vw; height: 15px; background: #ee771e; margin-top: 2%;}
img.G_col{ width:25vw; height:auto;}
}

#B_title{ font-size: 1.75em; letter-spacing:0.13em; margin-bottom: 5%; line-height: 1.35em;}
#C_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 1.75em; letter-spacing:0.1em; margin-bottom: 5%; line-height: 1.45em; color: #f9c31f; text-align:center;}
#D_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 1.75em; letter-spacing:0.1em; margin-bottom: 5%; line-height: 1.45em; color: #353383; text-align:center;}
#E_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 1.75em; letter-spacing:0.1em; margin-bottom: 5%; line-height: 1.45em; color: #ff5b1a; text-align:center;}
#F_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 1.75em; letter-spacing:0.1em; margin-bottom: 5%; line-height: 1.45em; color: #00837d; text-align:center;}
#G_title{ font-family: "Microsoft YaHei", sans-serif; font-weight: bold; font-size: 1.75em; letter-spacing:0.075em; margin-bottom: 5%; line-height: 1.45em; color: #ee771e; text-align:center;}

#people_list{ font-size: 1.35em; color: #202020; line-height: 1.7em; text-align: left; padding-left:12%;}
#people_list2{ font-size: 1.35em; color: #202020; line-height: 1.7em; text-align: left; padding-left:18%;}

.C_section, .D_section {
	margin-top: 2%;
}
.E_section{
	margin-top: 2%;
}
.F_section {
	margin-top: 2%;
}
.G_section {
	margin-top: 2%;
}

/* ↓↓↓↓ pad 豎屏時, 頁面顯示尺寸 300 < x <1023 時,顯示效果 ↓↓↓↓  */
@media (min-width: 300px) and (max-width:960px) {
.BRR{ display: block;}
/*BANNER*/

img.banner001{display: none;}
img.banner002{display: none;}
img.banner003{display: none;}
img.banner004{display:block; top: 35%;left: 5%;z-index: 5; width: 80vw; height: auto; max-width: 645px;}
img.B_file{display: none;}

#B_fill{ margin-left: 0%; margin-top:20%;}

#inline{ display:inline-block;}
 
#FirstPage {
	background: #fff;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	display: inline-block;
	height: 50px;
	margin: 0 15px;
	overflow: hidden;
	position: absolute;
	bottom: 8%;
	right:43%;
	text-indent: 100%;
	white-space: nowrap;
	width: 50px;
}


#rectangle_C {
	 width: 100vw; height: 10px; background: #f9c31f; margin-top: 2%;
	}

img.Python_logo{ width:15vw; height:auto;}
.C_section p,.D_section p,.F_section p,.E_section p{ text-align:center; margin-top: 5%;}

.C_section_col2,.D_section_col1,.E_section_col2,.F_section_col1,.G_section_col2{
	display:none;
}
img.C_pic_960,img.D_pic_960,img.E_pic_960,img.F_pic_960,img.G_pic_960{
	 width:100%; height:auto;
	} 
img.D_pic,img.F_pic{
	width:100%; height:auto;
} 

#rectangle_D { 
	width: 100vw; height: 10px; background: #353383; margin-top: 2%;
}

img.D_icon1{ width:70vw; height:auto;}
img.D_icon2{ width:70vw; height:auto;  margin-top:8%;}
img.D_icon3{ width:70vw; height:auto; margin-top:8%;}

#rectangle_E {
	 width: 100vw; height: 10px; background: #ff5b1a; margin-top: 2%;
	}


#rectangle_F {
	 width: 100vw; height: 10px; background: #00837d; margin-top: 2%;
	}

img.F_col{ display: none;}
img.F_col2{ display:block; margin:0 auto; margin-top:5%;}
/*img.F_col{ width:95vw; height:auto; margin-top:5%;}*/


#rectangle_G {
	 width: 100vw; height: 10px; background: #ee771e; margin-top: 2%;
	}
.G_section p{ text-align:center; margin-top: 2%;}

img.G_col{ width:65vw; height:auto;}

.col-lg-12_B, .col-md-12_B, .col-xs-12_B, .col-sm-12_B {
	position: relative;
	max-width: 90vw;
	min-height: 1px;
	padding-right: 0px;
	padding-left: 0px;
	margin: 0 auto;
	margin-top: 1%;
	margin-bottom: 1%;
}

.mod-singular-section-inD {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 100%;
	margin-top: 0px;
}

.mod-singular-section:first-child {
	background-image: url(../images/A_bg_960.png);
	background-size: cover;
}
}

/*========================================================*/
@media only screen and (max-width: 1280px) {
	#people_list{
		font-size: 1.5em;
		line-height: 1.5em;
	}
	#people_list2{
		font-size: 1.5em;
		line-height: 1.5em;
	}
	#B_title {
		font-size: 2.5em;
		letter-spacing: 0.5em;
		line-height: 1.5em;
	}
	#C_title, #D_title, #E_title, #F_title, #G_title {
		font-size: 2.5em;
		letter-spacing: 0.5em;
		line-height: 1.5em;
	}
	.C_section, .D_section {
		margin-top: 2%;
	}
	.E_section{
		margin-top: 2%;
	}
	.F_section {
		margin-top: 2%;
	}
	.G_section {
		margin-top: 2%;
	}
}


/*↓↓↓↓ *螢幕尺寸【大於於】768時頁面顯示效果	↓↓↓↓ */
@media (max-width: 768px) {
	
}






/*↓↓↓↓ 	螢幕尺寸【小於】480時頁面顯示效果	↓↓↓↓ */
@media (max-width: 480px) {
	#people_list {
		padding-left: 3%;
	}
	#people_list2 {
		padding-left: 3%;
	}
}

@media (max-width: 320px) {
	img.banner004 {
		top: 25%;
	}
	#B_title {
		font-size: 1.3em;
		letter-spacing: 0em;
	}
	#B_fill {
		margin-top: 5%;
	}
	.C_section, .D_section {
		margin-top: 10%;
	}
	.E_section {
		margin-top: 10%;
	}

	#people_list{
		font-size: 1.2em;
		line-height: 1.2em;
	}
	#people_list2{
		font-size: 1.2em;
		line-height: 1.2em;
	}
	#C_title, #D_title, #E_title, #F_title, #G_title {
		font-size: 1.7em;
		letter-spacing: 0em;
		line-height: 1.2em;
	}
	
}


#sec02{
	background-color: #fff;
}
h1, .h1{
    margin:0;
}
