@charset "UTF-8";
div {
  font-family: 微軟正黑體; }

h1 {
  text-align: center;
  font-size: 35px;
  padding: 20px 0;
  color: #5fb9b7;
  line-height: 1.2; }

h2 {
  text-align: center;
  color: #ffb600;
  font-size: 25px; }

.title p {
  color: #999;
  text-align: center;
  padding-bottom: 20px; }

.title {
  padding: 30px 0; }

.header {
  width: 100%;
  position: relative;
  height: 80vw;
  background-image: url(../img/plan_header02.jpg);
  background-position: center right;
  background-size: cover;
  background-repeat: no-repeat;
  background-color: #333; }

section {
  width: 100%;
  background-color: #333; }

.plan_content {
  width: 80%;
  max-width: 1500px;
  margin: 0 auto;
  padding-top: 50px; }
  .plan_content h2 {
    margin-bottom: 30px; }
  .plan_content p {
    width: 100%;
    margin: 0 auto;
    color: #eee;
    line-height: 2;
    padding: 20px 0; }
  .plan_content p span {
    font-size: 20px;
    color: #5fb9b7; }

.plan_content ul {
  text-align: center;
  margin: 0 auto;
  padding-bottom: 50px; }

.plan_content ul li {
  width: 76vw;
  display: inline-block;
  height: 50vw;
  margin: 1.5vw 0.5vw; }

.plan_content ul li:nth-child(1) {
  background-image: url(../img/plan02_pic01.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_content ul li:nth-child(2) {
  background-image: url(../img/plan02_pic02.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_content ul li:nth-child(3) {
  background-image: url(../img/plan02_pic03.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_content ul li:nth-child(4) {
  background-image: url(../img/plan02_pic04.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_content ul li:nth-child(5) {
  background-image: url(../img/plan02_pic05.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_content ul li:nth-child(6) {
  background-image: url(../img/plan02_pic06.jpg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.plan_btn ul {
  text-align: center;
  padding-bottom: 70px; }

.plan_btn ul li {
  display: inline-block; }

.plan_btn ul li a {
  color: white;
  border: 1px solid #5fb9b7;
  margin: 10px 20px;
  padding: 10px 60px; }

.plan_btn ul li:nth-child(1) a:hover {
  color: #333;
  font-weight: bold;
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s;
  background-color: #5fb9b7; }

.plan_btn ul li:nth-child(2) a:hover {
  color: #333;
  font-weight: bold;
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s;
  background-color: #ffb600; }

@media screen and (min-width: 768px) {
  .header {
    background-image: url(../img/plan_header02.jpg);
    background-position: 0% 0%;
    height: 30vw;
    background-attachment: fixed;
    ackground-position: top top;
    background-size: 100%;
    background-repeat: no-repeat;
    background-color: #333; } }

@media screen and (min-width: 768px) {
  .plan_content {
    width: 90%; }
  .plan_content ul li {
    width: 42vw;
    height: 30vw;
    margin: 0.5vw 0.5vw; } }

@media screen and (min-width: 1024px) {
  .plan_content {
    width: 80%; }
  .plan_content p {
    max-width: 1200px; }
  .plan_content ul li {
    width: 25vw;
    height: 13vw;
    margin: 0.5vw 0.5vw; } }

@media screen and (min-width: 1800px) {
  .plan_content ul li {
    width: 20vw;
    height: 12vw; } }