/* ----------------------- */
/* Globel */
/* ----------------------- */
*{
	position: relative;
}
body,html{
	font-family: 微軟正黑體;
}
.wrapper{
	background-color: #eee;
	min-height: 100vh;
}

/* ----------------------- */
/* Utility */
/* ----------------------- */
.u-text-center{text-align: center !important;}
.u-text-right{text-align: right !important;}
.u-mt-24{margin-top: 24px !important;}
.u-mt-48{margin-top : 48px !important;}
.u-mb-48{margin-bottom: 48px !important;}
.u-mb-24{margin-bottom: 24px !important;}
.u-mb-32{margin-bottom: 32px !important;}
.u-pl-8{padding-left: 8px !important;}
.u-pr-8{padding-right: 8px !important;}
@media (max-width: 768px){
	.u-mb-24--mobile{margin-bottom: 24px !important;}
}
@media (min-width: 768px){
	.u-pl-8--desktop{padding-left: 8px !important;}
	.u-pr-8--desktop{padding-right: 8px !important;}
}
/* ----------------------- */
/* Heading & Text */
/* ----------------------- */
h1,h2,h3,h4,h5,h6,p{
	margin: 0;
}
.heading{
	font-size: 30px;
	color: #666;
	font-weight: 700;
	text-align: center;
}
.h3{
	font-size: 16px;
	color: #ffffff;
	/* width: 100%; */
	background-color: #3f51b5;
	float: left;
	padding: 5px 20px;
	font-weight: 400;
	border-radius: 30px;
	letter-spacing: 10px;
}

@media (max-width: 768px){
.heading{
	font-size: 26px;
}
.h3{
	
	width: 100%; 
	
}
}

/* ----------------------- */
/* Components */
/* ----------------------- */

/* Card */
.card{
	padding: 48px;
	background-color: #fff;
	border-radius: 2px;
	box-shadow: 0 3px 20px rgba(0,0,0,0.2);
	    float: left;
		    width: 100%;
}
@media (max-width: 768px){
	.card{
		padding: 48px 16px;
	}
}

/* Btn */
.btn{
	font-family: inherit;
	font-size: 100%;
	padding: 12px 48px; 
	color: #000;
	border: 1px solid #999;
	background-color: #e6e6e6;
	text-decoration: none;
	border-radius: 4px;
	line-height: 24px;
}
input.btn:focus{
	outline: 0;
}
.btn.btn--primary{
	background-color: #53db9b;
	color: #fff;
	border: 0px;
	    width: 100%;
}
.btn.btn--primary:hover{
	background-color: #4bc68d;
}

/* Form */
.form input[type="text"],
.form input[type="password"],
.form input[type="email"],
.form input[type="url"],
.form input[type="date"],
.form input[type="month"],
.form input[type="time"],
.form input[type="datetime"],
.form input[type="datetime-local"],
.form input[type="week"],
.form input[type="number"],
.form input[type="search"],
.form input[type="tel"],
.form input[type="color"],
.form select,
.form textarea {
    padding: 8px 16px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    vertical-align: middle;
    box-sizing: border-box;
	width: 100%;
}
.form input[type="other"] {
    padding: 8px 16px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    vertical-align: middle;
    box-sizing: border-box;
	float: left;
    width: calc(100% - 80px);
    margin-left: 15px;
}
/* 聚焦的狀態 */
.form input[type="text"]:focus,
.form input[type="password"]:focus,
.form input[type="email"]:focus,
.form input[type="url"]:focus,
.form input[type="date"]:focus,
.form input[type="month"]:focus,
.form input[type="time"]:focus,
.form input[type="datetime"]:focus,
.form input[type="datetime-local"]:focus,
.form input[type="week"]:focus,
.form input[type="number"]:focus,
.form input[type="search"]:focus,
.form input[type="tel"]:focus,
.form input[type="color"]:focus,
.form select:focus,
.form textarea:focus {
    outline: 0;
    border-color: #53db9b;
}
.form label{
	margin-bottom: 8px;
	display: inline-block;
	vertical-align: middle;
	color: #666;
	    width: 100%;
}









 [class*="icheck-"] {
    min-height: 22px;
    margin: 6px 10px!important;
    padding-left: 0px;
	     float: left;
}


[class*="icheck-"] > label {
    padding-left: 29px !important;
    min-height: 22px;
    line-height: 22px;
    display: inline-block;
    position: relative;
    vertical-align: top;
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer;
}

[class*="icheck-"] > input:first-child {
    position: absolute !important;
    opacity: 0;
    margin: 0;
}

    [class*="icheck-"] > input:first-child:disabled {
        cursor: default;
    }

    [class*="icheck-"] > input:first-child + label::before,
    [class*="icheck-"] > input:first-child + input[type="hidden"] + label::before {
        content: "";
        display: inline-block;
        position: absolute;
        width: 22px;
        height: 22px;
        border: 1px solid #D3CFC8;
        border-radius: 0px;
        margin-left: -29px;
		border-radius: 5px;
    }

    [class*="icheck-"] > input:first-child:checked + label::after,
    [class*="icheck-"] > input:first-child:checked + input[type="hidden"] + label::after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 0;
        left: 0;
        width: 7px;
        height: 10px;
        border: solid 2px #fff;
        border-left: none;
        border-top: none;
        transform: translate(7.75px, 4.5px) rotate(45deg);
        -ms-transform: translate(7.75px, 4.5px) rotate(45deg);
    }

[class*="icheck-"] > input[type="radio"]:first-child + label::before,
[class*="icheck-"] > input[type="radio"]:first-child + input[type="hidden"] + label::before {
    border-radius: 50%;
}

[class*="icheck-"] > input:first-child:not(:checked):not(:disabled):hover + label::before,
[class*="icheck-"] > input:first-child:not(:checked):not(:disabled):hover + input[type="hidden"] + label::before {
    border-width: 2px;
}

[class*="icheck-"] > input:first-child:disabled + label,
[class*="icheck-"] > input:first-child:disabled + input[type="hidden"] + label,
[class*="icheck-"] > input:first-child:disabled + label::before,
[class*="icheck-"] > input:first-child:disabled + input[type="hidden"] + label::before {
    pointer-events: none;
    cursor: default;
    filter: alpha(opacity=65);
    -webkit-box-shadow: none;
    box-shadow: none;
    opacity: .65;
}

.icheck-primary > input:first-child:not(:checked):not(:disabled):hover + label::before,
.icheck-primary > input:first-child:not(:checked):not(:disabled):hover + input[type="hidden"] + label::before {
    border-color: #2e6da4;
}
.icheck-primary > input:first-child:checked + label::before,
.icheck-primary > input:first-child:checked + input[type="hidden"] + label::before {
    background-color: #337ab7;
    border-color: #2e6da4;
}


 .word {
      margin: 30px 30px 50px;
      font-size: 16px;
      line-height: 1.8;
      width: calc(100% - 60px);
}


 .Vice {
    min-height: 22px;
    margin: 10px 2px!important;
    padding-left: 0px;
	float: left;
}

 .Phone3 span {
    width: 33.333%;
	float: left;
}
 .Phone3 span:nth-of-type(even) {
    margin: 0 10px;
	 width: calc(33.333% - 20px);
}
 .project {
     width: 100%;
	float: left;
	 margin-bottom: 35px;
}
 .series {
     width: 100%;
	float: left;
}

 .member {
     width: calc(100% - 30px);
     float: left;
     padding: 20px 0px;
     border-bottom: #e0e0e0 1px solid;
}
 .member h4{
	 margin-bottom:10px;
	color: #666;
	width: 100%;
	font-size: 18px;
}
 .Phone4 > div {
    width: calc(25% - 10px);
	float: left;
	margin-right:10px;
	
}
 .Phone4 > div:nth-of-type(4) {
	 width: calc(25% - 0px);
	 margin-right: 0px;
}


@media (max-width: 768px){
 .Phone4 > div {
    width: calc(100% - 0px);
	float: left;
	margin-right:0px;
}
 .Phone4 > div:nth-of-type(4) {
	 width: calc(100% - 0px);
	 margin-right: 0px;
}
.member {
    padding: 20px 0px 0px;
    width: calc(100% - 10px);
}
}
.address-25 {
   width: calc(25% - 10px);
   float: left;
   margin-right:10px;
  
}
.address-50 {
   width: calc(50% - 0px);
	float: left;
}
@media (max-width: 768px){
.address-25 {
   width: calc(50% - 10px);
    margin-bottom: 10px
}
.address-25:nth-of-type(2) {
   width: calc(50% - 0px);
    margin-right:0px;
  
}
.address-50 {
   width: calc(100% - 0px);
	float: left;
}
}