

.lines{
  max-width: 120px;
  height: 8px;
  background: #f8b62d;
  margin: 20px 0;
}

.area{
  padding: 25px 0;
}

.notes{
  color: #ea5514;
  border:2px solid #ea5514;
  /*max-width: 770px;*/
  margin: 15px 0 0 0 ;
  padding:0 15px; 
  border-radius: 5px;
  float: left;
  clear: both;
}

.rows{
  margin: 3% 0;
}
.rows-ms{
  margin: 1% 0;
}
.links{
  background: #036eb8;
  border-radius: 50px!important;
  color: #fff;
  float: left;
  margin: 15px 0 0 0 ; 
}

.topnum{
  font-size: 3em;
  text-align: center;
}
.topnum h2{
  width: 200px;
  height: 200px;
  margin: 0 auto 15px auto;
  border-radius: 100%;
  /*padding:10px 10px;*/
  border:2px solid #0396d6; 
  background: #0396d6; 
  color: #fff;
  line-height: 190px;

}
.title h4{
  padding: 0 15px;
  border-radius: 30px;
  border:4px solid #0396d6;
  float: left;
  color:#0396d6;
}

.service{
  background: url("../image/banner/service.jpg") no-repeat center center;
  background-size: cover;
  padding: 3% 0;
  color: #fff;
}

/*第一區塊*/
.info{
  color: #808080;
  line-height: 2em;
  letter-spacing: 2px;
  font-size: 1.1em;
}

.single{
  padding: 0 8px;
}
.yellow{
  color: #0396d6;
}

.about p{
	color:#808080;
	line-height:30px;
	font-size: 1.1em;
}

.about .three p{
	color:#f39800;
}

.about .three:last-child{
	color:#f39800;
	border:2px solid #f39800;
	padding:5px 8px;
	margin:8px 0;
}
/*第二區塊-----------------------------------------------------*/

.piano{
  padding:1% 0.5%; 
  margin: 1% 0;
}
.piano img{
  border-radius: 5px;
}
/*第三區塊-----------------------------------------------------*/


/*Footer-----------------------------------------------*/
#footer{
  padding: 1% 0;
  background: rgba(10,10,10,0.75);
  color: #fff;
}

#footer .footinfo{
  margin: 0px 0;
  line-height: 36px;
}

#footer .footinfo p{
  margin: 0 0;
}
#footer .footinfo i{
  margin: 0 1% 0 0;
  min-height: 30px;
}

.facepage iframe{
  min-height: 280px;
  margin: 20px 0 20px 0;
}


.facepage .faces{
  max-height: 280px;
  overflow: hidden;
}

.map{
  margin: 0 0 10px 0;
}

/*------------------------------------*/

.consultation input[type="checkbox"],
.consultation input[type="radio"] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
.consultation label {
  position: relative;
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 10px;
  padding-left: 25px;
  padding-right: 10px;
  line-height: 36px;
  cursor: pointer;
  min-width: 20px;
  min-height:20px;
  z-index: 1;
  color: #fff;
}
.consultation label::before {
  content: " ";
  position: absolute;
  top: 6px;
  left: 0;
  display: block;
  width: 20px;
  height: 20px;
  border: 2px solid #6e8886;
  border-radius: 4px;
  z-index: -1;
}
.consultation input[type="radio"] + label::before {
  border-radius: 18px;
}
/* Checked */
.consultation input[type="checkbox"]:checked + label,
.consultation input[type="radio"]:checked + label {
  padding-left: 10px;
  color: #fff;
  
}
.consultation input[type="checkbox"]:checked + label::before,
.consultation input[type="radio"]:checked + label::before {
  top: 0;
  width: 100%;
  height: 100%;
  background: #6e8886;/*#2995cc*/

}
/* Transition */
.consultation label,
.consultation label::before {
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}


/*右側按鈕---------------------------------------------*/

.quicklink{
  position: fixed;
  right:0;
  top:10%;
  max-width: 50px;
  /*background: #f00;*/
  z-index: 4;
}

.quicklink div{
  margin: 0 0 8px 0;
}

@media only screen and (min-width: 600px) {
  /*.singleone755{
 
  min-height: 430px;
}*/
 
}

@media (min-width: 768px) {
  
  

}
@media (min-width: 900px) {



}
@media (min-width: 1000px) {
  .facepage iframe{
    min-height: 280px;
    margin: 0px 0 20px 0;
  }

  .quicklink{
    right:0;
    top:40%;
    max-width: 70px;
  }

  /*第一區塊*/
  .main1{
    padding: 30px 80px;
  }
  .main2{
    padding: 30px 30px;
  }
  .area1pra p{
    font-size: 1.0em;
  }
  #item1 .singleone{
    max-height: 445px;
  }




}
@media (min-width: 1200px) {
   /*第一區塊*/
  .main1{
    padding: 0 80px;
  }
  .main2{
    padding: 0 30px;
  }
  .area1pra p{
    font-size: 1.4em;
  }
  /*第二區塊*/
  
  .topmenu{
    position: sticky;
    top: 0;
  }
  #item1 .singleone{
    max-height: 445px;
  }

  /*Footer-------------------------------*/
  #footer .footinfo{
    margin: 0% 0;
  }
}
@media (min-width: 1300px) {
  #item1 .singleone{
  max-height: 555px;
}
  
}

@media (min-width: 1600px) {
  
 #item1 .singleone{
  max-height: 595px;
}
   
}


