@charset "utf-8";

/* CSS Document */

.logo-menu {
    padding: 0px;
    width: 380px;
    position: absolute;
}

.Menu {
    background-color: rgba(255, 255, 255, 0);
    padding: 0px 0px 0px;
    float: right;
    width: calc(100% - 380px);
}

nav.navbar.bootsnav {

	background-color: rgba(255, 255, 255, 0);

}







.home-tnews {
background-image: url(../images/bg2.png);
	    padding: 70px 0;

		   

}



#table-breakpoint tr, #table-breakpoint th, #table-breakpoint td {

    border: none;

    border-bottom: 1px solid #e4ebeb;

    /* font-family: 'Lato', sans-serif; */

    font-size: 16px;

}

.owl-news-t1 .des {

   font-size: 15px;

    color: #869093;

    height: 50px;

    line-height: 25px;

    overflow: hidden;

    margin: 5px 0px 25px;

}

.owl-news-t1 .owl-nav [class*=owl-],

.owl-photo-t1 .owl-nav [class*=owl-]

 {

    color: #FFF;

    font-size: 0;

    padding: 30px 30px;

    cursor: pointer;

    background-image: url(../images/next_prev2.png);

    background-repeat: no-repeat;

    position: absolute;

    top: 50%;

    margin-top: -30px;

    background-color: rgba(255, 255, 255, 0.7);

    border: 3px solid #dfe2e3;

}

.owl-news-t1 .owl-prev {

    background-position: 20px center;

    left: -80px;

}

.owl-news-t1 .owl-next

{

    background-position: -20px center;

    right: -80px;

}







.owl-photo-t1 .owl-prev {

    background-position: 5px center;

	left:15px;

}

.owl-photo-t1 .owl-next{

    background-position: -25px center;

	right:15px;

}





.outw1 .text {

    text-align: left;

        padding: 20px 20px 50px 20px;

}

.outw1 .btn-more {

    text-align: left;

}

.outw1 .btn-more a {

    border: 1px solid #fff;

    background-color: #fff;

    font-size: 10px;

    color: #000;

    padding: 5px 20px;

    display: inline-block;

    border-radius: 0px;

	    margin-top: 15px;

    margin-left: 10px;

	border: 1px solid #c1c1c1;

}

.outw1 .btn-more a:hover {

    color: #fff;

    background-color: #000;

    padding-right: 50px;

}

.outw1 .text .des {

    font-size: 14px;

    line-height: 26px;

    padding: 10px;

    color: #8a8a8a;

	overflow: hidden;

    height: 80px;

}

.image-a4-t1 .map {

    background-color: #f5f5f5;

    border: 1px #666 none;

    border-radius: inherit;

    padding: 15px;

}





.tab .tab-content .Article li {

     background-image: url(../images/symbol.png);

     background-repeat: no-repeat;

     background-position: 5px 8px;

}

.owl-photo-t1 .slide-box {

    margin: 0;

    overflow: hidden;

    background-color: #f3f3f3;

    position: relative;

    padding: 0px;

    border-right: 1px solid #ddd;

}

.owl-photo-t1 a.more {

    display: inline-block;

    padding: 4px 15px;

    font-size: 12px;

    font-weight: 200;

    margin: 15px 0; 

    color: #fff;

    background: #248cb3;

    border-bottom-right-radius: 10px;

    text-transform: capitalize;

    transition: all 0.30s linear;

}

.owl-photo-t1 .image {

    width: 100%;

    height: 0;

    padding-bottom: 65%;

    overflow: hidden;

}



.home-text {

    overflow: hidden;

    height: 100%;

	background: #ececec;

}



.text-b2-t2 .link-area {

    padding: 100px 10px 60px 60px;

}





.video-c2 {

    padding: 100px;

    overflow: hidden;

}

.video-c2.wordtextbox {

    font-size: 14px;

    padding: 30px ;

    text-shadow: 2px 2px 2px rgba(0,0,0,0.4);

}

.owl-a6-t1 {

    padding: 40px 0;

}



.image-a3 .des-area {

    padding: 45px 0px 25px 0px;

    overflow: hidden;

}

table tr, table th, table td {

    font-size: 14px;

}

.btn {



    margin: 5px 0;

   

}

.blog-info h3 {

	font-size: 18px;

}



.text-b3 {

    padding: 0px 0;

}

.menu ul li a {

    font-size: 16px;

}



.text-b3-t1 .title {

    font-size: 16px;

    line-height: 25px;

    height: 50px;

    overflow: hidden;

	margin-bottom: 10px;

}

.text-b3-t1 .size {

    font-size: 14px;

    line-height: 15px;

    overflow: hidden;

    padding-bottom: 5px;

    margin-bottom: 5px;

    color: #b1b1b1;

    border-bottom: none;

	padding-top: 10px;

}

.text-b3-t1 .file-area {

    padding: 10px;

    position: relative;

}

.text-b3-t1 .more a {

    display: inline-block;

    padding: 5px 30px;

    background-color: #3360b3;

    color: #fff;

    font-size: 14px;

    overflow: hidden;

    position: absolute;

	right: 0;

	top: 82px;

}



.menu ul li a {

    background: #ffffff;

    color: #797979;

    float: left;

    font-size: 18px;

    overflow: hidden;

    padding: 10px;

    position: relative;

    text-decoration: none;

    white-space: nowrap;

    width: 100%;

    border-bottom: 1px solid #cccccc;

}

.menu ul .submenu > li > ul.submenu > li > a {

    border-bottom: none;

    padding: 5px 0px 5px 55px;

    color: #a1a1a1;

    line-height: 24px;

    font-size: 14px;

	background-image: url(../images/symbol.png);

	background-repeat: no-repeat;

	background-position: 35px 8px;

}



.menu ul .submenu > li > ul.submenu > li > ul.submenu > li > a{

    border-bottom: none;

    padding: 5px 0px 5px 70px;

    color: #a1a1a1;

    line-height: 24px;

    font-size: 14px;

	background-image: url(../images/symbol.png);

	background-repeat: no-repeat;

	background-position: 50px 8px;

}



.menu ul .submenu li a {

    background: #f7f7f7;

    border-left: solid 6px transparent;

    border-top: none;

    float: left;

    font-size: 16px;

    position: relative;

    width: 100%;

    border-bottom: 1px solid #ffffff;

}





#table-breakpoint tr, #table-breakpoint th, #table-breakpoint td {

    border: none;

    border-bottom: 1px solid #e4ebeb;

    /* font-family: 'Lato', sans-serif; */

    font-size: 16px;

}

.price {

   padding:20px 50px;

}

.price .table{

   font-size:18px;

    width: 100%;

}

.price .table p{

   width: calc(100% - 100px);

   float: left;

   overflow: hidden;

   height: 25px;

}

.price .table span{

   width: 80px;

       float: right;

	   color:#c0392b; 

}



.interval .bgs2 {

	 background-image: none;

	     padding: 20px 0;

}

.bgs2 {

	position:relative;

	overflow: hidden;

	    padding: 80px 0;

		background-image: url(../images/bg.jpg);

}

.leftBox  {

	margin: 0 0px 20px;

}

.leftBox .subTitle {

    position: relative;

    font-family: "Cantarell", sans-serif;

    font-size: 20px;

    letter-spacing: .075em;

    color: #333;

    text-transform: uppercase;

    padding-left: 75px;

    box-sizing: border-box;

}

.leftBox .subTitle:before {

  content: '';

  position: absolute;

  left: 0;

  top: 15px;

  width: 55px;

  height: 1px;

  background: #fff;

}



 .leftBox .en {

  font-family: "PT Serif", serif;

  font-size: 60px;

    line-height: 75px;

    margin-bottom: 25px;

  color: #333;

  margin-bottom: 20px;

}



.leftBox h2 {
  display: block;
  font-size: 32px;
  font-weight: 100;
  letter-spacing: .1em;
  color: #474747;
  margin-bottom: 45px;
}
.leftBox .btn01 {
    color: #ffffff;
    font-size: 16px;
	line-height: 26px;

}

.btn01 a {

  position: relative;

  display: inline-block;

  border: 1px solid #c1c1c1;

  padding: 10px 90px 10px 20px;

  box-sizing: border-box;

  font-family: "Cantarell", sans-serif;

  text-transform: uppercase;

  letter-spacing: .2em;

  overflow: hidden;

  color: #ffffff;

  background: #333;

}



.btn01 a:before {

  content: '';

  position: absolute;

  left: -50px;

  top: 50%;

  margin-top: -0.5px;

  width: 35px;

  height: 1px;

  background: #fff;

  transition: all .5s;

}



.btn01 a:after {

  content: '';

  position: absolute;

  right: 14px;

  top: 50%;

  margin-top: -0.5px;

  width: 35px;

  height: 1px;

  background: #c1c1c1;

  transition: all .5s;

}



.btn01 a:hover {

  background: #333;

  color: #fff;

  padding-left: 40px;

}



.btn01 a:hover:before {

  left: 0px;

  transition-delay: .2s;

}



.btn01 a:hover:after {

  background: #333;

  right: -50px;

}





.owl-news-t1 .title {

    color: #000;

    font-size: 18px;

    height: 60px;

    line-height: 32px;

    overflow: hidden;

    margin: 5px 0px;

    margin-bottom: 20px;

}

.image-a4-t2 .imageitem .image {

    text-align: center;

    overflow: hidden;

    opacity: 1;

    -webkit-transform: scale3d(1,1,1);

    transform: scale3d(1,1,1);

    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;

    transition: opacity 0.2s, transform 0.2s;

}



@media (max-width: 767px)  {

.logo-menu {

    width: 100%;

}

.navbar-wrapper .container{

padding-right: 0px;

    padding-left: 0px;

    margin-right: auto;

    margin-left: auto;

}

.Menu {

    width: 100%;

	padding: 0px 0px;

	background-color: rgba(0, 0, 0, 0.7);

}



nav.navbar.bootsnav {

    min-height: 60px;
}

.text-b2-t2 .link-area {

    padding: 20px ;

}

.tab .tab-content .Article li {

    margin-bottom: 10px;

    padding-left: 30px;

}

.tab .tab-content .Article li {

    background-position: 5px 8px;

}

.owl-news-t1 .owl-nav [class*=owl-]{

    padding: 25px 25px;

    

    border: 2px solid #dfe2e3;

}

.owl-news-t1 .owl-prev {

   background-position: 10px center;

    left: -15px;

}

.owl-news-t1 .owl-next{

    background-position: -20px center;

    right: -15px;

}

.video-c2 {

    padding: 20px;

    overflow: hidden;

}

.price {

   padding:20px;

}



.bgs2 {

	position:relative;

	overflow: hidden;

	    padding: 60px 0 0 0;

		background-image: url(../images/bg.jpg);

}

.leftBox  {


}

nav.navbar.bootsnav.no-full .navbar-collapse {

    max-height: 500px;

    padding-top: 30px;

    padding-bottom: 30px;

    overflow-y: auto !important;

}



.leftBox .subTitle {

    font-size: 16px;

}

.leftBox .en {

    font-size: 45px;

    line-height: 50px;

}

.leftBox h2 {

    font-size: 26px;

}

.owl-default .owl-dots {

    bottom: 10px;

}

.owl-a1-t1 .image {

    width: 100%;

}

.topimg img {

   

}

}

#sc351 .video-c3-t1 .wordtextbox {
	background-image: url(../images/bg.jpg);

}
#sc351 .video-c3-t1 .wordtextbox .des {
    text-align: center;
    border: 0px solid #00bcd4;
    margin: 40px;
    padding: 40px;
    min-height: 300px;

}

.abott {
   background-color: #000000a8;
    margin: 50px 100px;
    width: calc(100% - 200px);
    padding: 50px 80px;
    color: #ffffff;

}
.abott  p{
      line-height: 28px;
    font-size: 16px;
	    margin-bottom: 20px;
		text-align: center;
}

.abott  .personnel{
        border: 1px solid #ffffff;
    padding: 10px 20px;
    margin: 10px;
}

.abott  .Item{
   width: 20%;
	float: left;
	text-align: center;
}
.abott  .Item h3{
    line-height: 100px;
    font-size: 26px;
    color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    margin: 10px auto 30px;

		
}
.abott  .Item span{
    font-size: 14px;
}



#sc375 .col-sm-4 {
  width: 60% ;
      float: right;
}
#sc375 .col-sm-9 {
  width: 40% ;
      float: left;
}
.Service-Content ul{
   margin: 0px;
    padding: 0px;
}
.Service-Content ul li{
   margin: 0px;
    padding: 0px;
}
.Service-Content .Content10{
	padding: 10px;
	margin-bottom: 5px;
	margin-top: 5px;
	border: 1px solid #d0d0d0;
	list-style-type: none;
	float: left;
    width: 100%;
}
.Service-Content .Content10 .name3{
	  width: 70% ;
      float: left;
}
.Service-Content .Content10 .price3{
	  width: 30% ;
      float: right;
	      text-align: right;
		      font-size: 12px;
    color: #b7b7b7;

}
.Service-Content .Content10 .price3 span{
	color: #fa0000;
    margin-left: 15px;
		      font-size: 16px;
}
.Service-Content .Content10 p{
     margin: 0 0 0px;
}
.Service-Content .Content10 .tn{
    font-size: 18px;
	line-height: 26px;
}
.Service-Content .Content10 .en{
    font-size: 12px;
	
	line-height: 20px;
}


@media (max-width: 767px)  {
#sc352 .col-xs-6{
      width: 25%;
}
#sc372 .col-xs-6{
      width: 100%;
}
#sc375 .col-sm-4 {
    width: 100%;
    float: right;
}
#sc375 .col-sm-9 {
    width: 100%;
    float: left;
}
.abott {
    margin: 30px;
    width: calc(100% - 60px);
    padding: 30px;
}
.wort-title h2 {
   
    font-size: 30px;
  
}
.abott .Item {
    width: 100%;
   
}
.Service-Content .Content10 .name3{
	  width: 100% ;
}
.Service-Content .Content10 .price3{
	  width: 100% ;
    

}
	}
	
@media (min-width: 992px){
.container {
        padding-right: 5px;
    padding-left: 5px;
}
nav.navbar.bootsnav {
    min-height: 80px;
}
nav.navbar.bootsnav ul.nav > li > a {
    padding: 30px 8px;
 
}
}	





.leftBox {
float: left;
    width: 100%;
 
}

 .leftBox .subTitle {
  position: relative;
      font-family: 'DM Serif Display', serif;
  font-size: 20px;
  letter-spacing: .075em;
  color: #000;
  text-transform: uppercase;
  padding-left: 75px;
	 padding-bottom: 25px;
  box-sizing: border-box;
}
.leftBox .subTitle:before {
  content: '';
  position: absolute;
  left: 0;
  top: 15px;
  width: 55px;
  height: 1px;
  background:#000;
}
 .leftBox .en {
    font-size: 50px;
    line-height: 2;
    color: #000;
    font-family: 'DM Serif Display', serif;
}

}
 .leftBox h2 {
    display: block;
    font-size: 26px;
    line-height: 36px;
    font-weight: 100;
    letter-spacing: .1em;
    color: #000;
    margin-bottom: 45px;
}


@media (min-width: 980px) {
 .about_text.col_2 {
  display:flex;
    width: 100%;
	 padding: 50px 0 20px;
 }
 .about_text.col_2>div {
  flex-shrink:0;
  width:46%
 }
 .about_text.col_2>div+div {
  margin-left:8%
 }
}
@media (min-width: 1800px) {
 .about_text.col_2>div {
  width:45%
 }
 .about_text.col_2>div+div {
  margin-left:10%
 }
}
@media (max-width: 80px) {
 .about-content-box {
	    padding: 10%;
 }
}

@media (max-width: 768px) {
	 .leftBox .en {
    font-size: 36px;

}
	 .leftBox .h2 {
    font-size: 26px;

}
	
 .about_text.col_2 {
	    padding: 0 0px;
 }
	
.about-content-box {
	    padding: 0 30px 50px;
 }
}


.tbb-area {
    padding: 5% 0%;
}

.tbb-area .tbb-des-area {
    margin: auto;
    background-color: rgba(0, 0, 0, 0.5);
    padding: 4% 12%;
}

.tbb-area .tbb-des-area p {
    color: #FFF;
    letter-spacing: 2px;
    font-weight: 500;
    line-height: 1.8;
    text-shadow: 3px 2px 2px #686868;
}
.tbb-area .tbb-des-area h3 {
    font-size: 40px;
    line-height: 46px;
    color: #fff;
    letter-spacing: 2px;
    font-weight: 500;
    text-shadow: 3px 2px 2px #686868;
}
.about-Page{
    width: 100%;
    margin: 0 0 50px;
    float: left;
}

.about-Page .map{
    background-color: #fafafa;
    padding: 10px;
    border-radius: 30px;
    border: solid 3px #f3f3f3;
	margin-bottom: 20px;
}

.about-Page .map img{
   width: 100%;
    border-radius: 10px;
	
}
.about-Page h3{
      line-height: 1.5;
	    color: #27a200;
		font-size: 25px;
		margin: 0 20px;
}
.about-Page h4{
      line-height: 1.5;
	      color: #27a200;
		  margin: 0 20px;
	    font-size: 14px;
}
.about-Page p{
      line-height: 1.5;
	margin: 20px;
}


.Floating {
    right: 20px;
    position: fixed;
    bottom: 45%;
    z-index: 1000;
}




.Floating .Line {
    writing-mode: vertical-lr;
    color: #fefefe;
    background-color: #2baa30;
    padding: 60px 15px 30px;
    border-radius: 50px;
}
.Floating .Line:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 15px;
    width: 40px;
    height: 40px;
	    transform: translateX(-50%);
    background: url(../images/Line-Logo.svg) no-repeat center center/cover;
	
}

.Floating .Line:hover {
     color: #000;
    background-color: #ffee5a;
  
}

.Floating .tel {
    writing-mode: vertical-lr;
    color: #fefefe;
    background-color: #f1940b;
    padding: 60px 15px 30px;
    border-radius: 50px;
}
.Floating .tel:before {
    content: '';
    position: absolute;
    left: 50%;
    top: 15px;
    width: 40px;
    height: 40px;
	    transform: translateX(-50%);
    background: url(../images/tel-Logo.svg) no-repeat center center/cover;
	
}

.Floating .tel:hover {
     color: #000;
    background-color: #ffee5a;
  
}


@media (max-width: 420px) {
.Floating {
    left: 20px;
    bottom: 20px;
}
	
.Floating .Line {
    writing-mode: inherit;
    padding: 10px;
    border-radius: 50px;
    z-index: 1000;
    width: calc(50% - 10px);
    text-align: center;
    letter-spacing: 10px;
}
.Floating  .Line:before {
    left: 10%;
    top: 5px;
    width: 30px;
    height: 30px;
    transform: inherit;
   
}
.Floating .tel {
    writing-mode: inherit;
    padding: 10px;
    border-radius: 50px;
    z-index: 1000;
    width: calc(50% - 10px);
    text-align: center;
    letter-spacing: 10px;
}
.Floating  .tel:before {
    left: 10%;
    top: 5px;
    width: 30px;
    height: 30px;
    transform: inherit;
   
}	
.Announce {
 
    padding-bottom: 50px;
}	
	
	}




.float-buttons {
    position: fixed;
    right: 20px;
    bottom: 25px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.float-btn {
    position: relative;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,.25);
}

.float-btn img {
    width: 65%;
}

/* 提示框 */
.float-btn .tip {
    position: absolute;
    right: 72px;
    top: 50%;
    transform: translateY(-50%) translateX(10px);
    padding: 6px 14px;
    font-size: 14px;
    color: #fff;
    border-radius: 20px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    transition-delay: .3s;
}

.float-btn .tip::after {
    content: "";
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    border-width: 6px;
    border-style: solid;
}

.float-btn:hover .tip,
.float-btn.show-tip .tip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

/* 顏色同步 */
.float-btn.line { background:#06c755; }
.float-btn.line .tip { background:#06c755; }
.float-btn.line .tip::after { border-color: transparent transparent transparent #06c755; }

.float-btn.phone { background:#2196f3; }
.float-btn.phone .tip { background:#2196f3; }
.float-btn.phone .tip::after { border-color: transparent transparent transparent #2196f3; }

.float-btn.top { background:#ff9800; }
.float-btn.top .tip { background:#ff9800; }
.float-btn.top .tip::after { border-color: transparent transparent transparent #ff9800; }

.float-btn:hover {
    transform: scale(1.08);
    transition: .2s;
}

/* 手機 */
@media (max-width:768px){
    .float-btn { width:48px; height:48px; }
    .float-btn .tip { display:none; }
    .float-btn.show-tip .tip { display:block; }
}







/* 預設：電腦版 */
.img-pc {
    display: block;
}

.img-mobile {
    display: none;
}

/* 手機版（寬度 ≤ 768px） */
@media (max-width: 768px) {
    .img-pc {
        display: none;
    }

    .img-mobile {
        display: block;
    }
}



