/*
Theme Name:Courtyard
Theme URI:http://precisethemes.com/wordpress-theme/courtyard/
Author:Precise Themes
Author URI:https://precisethemes.com/
Description:Courtyard - Responsive WordPress Theme is clean, minimalistic and beautifully designed theme perfectly for Hotel and Resorts. Courtyard theme can likewise be utilized to make site for Motel, Boarding House, Guest House, Lodge, Bed and Breakfast, B&B, Hostel, Inn Hospitality Business, Restaurant, Cuisine, Cafe, and some other kind of site you can envision with effectively adaptable and easily customizable landing page. Preview Demo is available at http://demo.precisethemes.com/courtyard/
Version:1.2
License:GNU General Public License v2 or later
License URI:http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:courtyard
Tags:one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, post-formats, theme-options, threaded-comments, blog, e-commerce, food-and-drink

font-family:'Ubuntu', sans-serif;font-family:'Roboto', sans-serif;
*/
/*============================ contact-us.php ============================*/
/*--- 共用 ---*/
.about_title_white, .about_title_blue, .about_title_orange{
    font-size: 3rem;
    padding: 20px 0;
    line-height: 1.2;
    font-weight: bold;
    margin: 0;
}
.about_title_white {
    color: #fff;
}
.about_title_blue {
    color: #44849d;
}
.about_title_orange {
    color: #e07425;
}
.about_btn {
    font-size: 1.125rem;
    line-height: 1;
    margin: 10px;
    padding: 1rem 2.2rem;
	border-radius: 10px;
	display: inline-block;
}
.about_btn_orange,
.about_btn_orange:visited
.about_btn_orange:visited:focus{
    color: #fff;
    background: #e07425;
	font-weight: bold;
	outline: none;
	border: 0;
}
.amazon-ad_btn_orange:hover{
    color: #fff;
    background: #e95a13;
}
/*row-table*/
.row-table{display:table;width:100%;margin:0 0px}
.row-table .col-cell{display:table-cell;vertical-align:middle;padding:0 30px}
.row-table.row-right{direction:rtl}
.row-table.row-right .col-cell{direction:ltr}

/*--- banner ---*/
.bg-header#about {
    background: linear-gradient(100deg,#3551a4 20%,#2c8ec4 63%,#31cdb0 100%);
	animation: gradient 15s ease infinite;
	background-size: 200% 200%;
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}
#about .container .banner {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: stretch;
    padding: 40px 0 0px 0;
}
.banner .banner-title {
    width: 40%;
    margin: 7% 0 0 0;
}
.banner .banner-title .caption{
    font-size: 3.2rem;
    font-weight: bold;
	color: #fff;
    text-align: left;
}
.banner .banner-title .subtitle {
    font-size: 1.5rem;
    line-height: 1.2;
    margin: 0;
    animation-delay: .5s;
    color: #fff;
    text-align: left;
    width: 100%;
}
.banner .banner-img {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
}
/*--- #about_who ---*/
#about_who {
	padding: 3rem 0;
}
#about_who .article-wrap {
	background: linear-gradient(90deg,#f1f4ff 65%,#FFF 50%);
	position: relative;
}
#about_who .container {
    position: initial;
}
#about_who .who_group {
    width: 50%;
	padding: 2rem 0px;
}
#about_who .who_con:first-of-type {
	margin: 0 0 70px 0;
}
#about_who .who_img {
    position: absolute;
    top: 50%;
    right: 0;
	left: auto;
    transform: translateY(-50%);
	width: 43%;
	margin: 0 0 0px 0;
}
#about_who .img-responsive {
	width: 100%;
	position: relative;
	z-index: 2;
}
#about_who .who_img:before {
    content: "";
    width: 100%;
    height: -webkit-fill-available;
    background: linear-gradient(90deg, #3ab3b0 0%, #55367d 100%);
    position: absolute;
    top: 25px;
    left: -3%;
    bottom: -20px;
    z-index: 1;
}
/*--- #about_from ---*/
#about_from {
	background: #a6cbc6 url(images/about_from-bg2.png) repeat center center;
	padding: 0px 0 0 0;
}
#about_from .article-wrap {
    padding: 1.1em 0 0 0;
}
/**/
.from_module_group {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.from_title {
	width: 45%;
	color: #fff;
	margin: 50px 0 0 0;
}
/*--- #about_support ---*/
#about_support {
    padding: 50px 40px 70px 40px;
    border: 1px solid #fff;
    border-radius: 15px;
	width: 45%;
}
#about_support ul{
	padding: 0;
	list-style: none;
	color: #fff;
}
#about_support ul a,
#about_support ul a:visited,
#about_support ul a:visited:focus {
	color: #fff;
	text-decoration: underline;
}
#about_support .about_title_blue {
	font-size: 2.5rem;
	color: #fff;
}
/*============================ RWD ============================*/
@media screen and (min-width:1800px){
	/*--- #about_who ---*/
	#about_who .container {
		position: relative;
	}
	#about_who .who_img {
		right: 30px;
	}
	/*--- #about_from ---*/
	#about_from .article-wrap {
		background-position: 50% bottom;
		background-size: contain;
	}
}
@media screen and (max-width:1380px){

}
@media screen and (max-width:1200px){
	/*--- #about_from ---*/
	#about_from .article-wrap {
		background-position: -180px bottom;
		background-size: 140%;
	}
	.from_title {
		width: 43%;
	}
	.form_group {
		width: 60%;
	}
	/*--- #about_support ---*/
	#about_support .support_list {
		margin: 0px 3% 45px 0%;
		width: 41%;
	}
}
@media screen and (max-width:1024px){

}
@media screen and (max-width:890px){
	/*--- banner ---*/
	#about .container .banner {
		flex-direction: column;
		padding: 15px 0 0px 0;
	}
	.banner .banner-title {
		width: 100%;
		margin: 7% 0 30px 0;
	}
	/*--- #about_who ---*/
	#about_who {
		padding: 0px 0 0px 0;
	}
	#about_who .article-wrap {
		background: linear-gradient(90deg,#f1f4ff 100%,#FFF 50%);
	}
	.from_title {
		width: 100%;
	}
	#about_who .who_group {
		width: 100%;
		padding: 10% 0px;
	}
	#about_who .who_img {
		position: relative;
		top: 0;
		left: 50%;
		right: auto;
		transform: translateX(-50%);
		width: 80%;
		margin: 0 0 110px 0;
	}

	/*--- #about_from ---*/
	#about_from .article-wrap {
		background-position: 14% bottom;
		background-size: 280%;
	}
	.from_module_group {
		flex-direction: column;
	}
	.form_group {
		width: 100%;
		margin: 35px auto 120% auto;
	}
	/*--- #about_support ---*/
	#about_support {
		margin: 0px auto 45px auto;
		width: 100%;
	}

}
@media screen and (max-width:768px){

}
@media screen and (max-width:640px){

}
@media screen and (max-width:480px){
	/*--- #about_who ---*/
	#about_who .who_img:before {
		height: 165px;
	}
}