@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Frank+Ruhl+Libre&display=swap');

@media screen and (max-width:700px)
{
body{
	margin:0; float:left; width:100%; text-align:center; font-family: 'Frank Ruhl Libre', serif; font-family: Garamond;
}

#cont-body{
	float:none; width:100%; max-width:1400px; display:inline-block; text-align:left; margin:0; padding:0;
}
#wel-msg{width:100%; float:left;}
#wel-img{
	width:50%; float:left; height:auto; overflow:hidden; display:none;
}

#wel-img img{
	width:100%;
}

#wel-txt{
	width:90%; margin-left:5%; float:left;
}

#wel-txt #para{
	font-size:14px; line-height: normal;
}

#wel-txt h1{
	color:#5e1237; margin-top:50px;
}
#wel-txt ul{
	font-size:14px;
	padding-left: 17px;
line-height: normal;
}


#hm-committee{
	width:100%; float:left; margin-top:35px; text-align:center;
}

#comm-b2{
	width:25%; float:left; height:325px; overflow:hidden; vertical-align:middle;padding-top:7%;text-align:center;
}

/*#comm-b2 h1{
	width:90%; float:left; height:325px; margin:0px 5%; line-height:325px; color:#5e1237;
}*/

#comm-b1{
	width:325px; float:none; display:inline-block; height:275px; overflow:hidden;
}

#comm-b-more{
	width:25%; float:left; height:325px; 
}

#c-photo{
	width:100%; height:auto; float:left;
}
#c-photo img{
	width:100%;
}
#c-name{
	width:90%; height:100%; padding:5%; margin-top:-100%; line-height:575px; float:left; color:white; transition:1s;
}
#c-name:hover{
	background:#327db7; opacity:0.7;
}
#comm-b-more #c-tab{
	width:100%; float:left; height:100%; text-align:center;
}
#comm-b-more #c-tab input[type=button]{
	width:auto; padding:10px 20px; font-size:15px; margin-top:45%; background:none; color:#77214b; border:2px solid #77214b;
}

#hm-program{ 
	width:90%; margin-left:5%; float:left; margin-top:35px; background:#fff;
}
.work1, .work2{ width:100%; float:left;}
.work1{}
.work2{ background:#fff;}

#prog-txt{
	width:92%; padding:25px 4%; margin-left:0%; float:left; height:auto; background-size:auto 100%; background-position:right;
}

#prog-txt h3{
	margin-top:0px;color:#5e1237;
}
#prog-txt ol{
	font-size:12px;
	padding-left:20px;
line-height: 25px;
}

#wel-txt ul li div{
	width:45px; height:45px; background:#7b3557; border-radius:100%;
}

#wel-txt ul li p{
	font-size:15px; color:#333; margin:0; margin-top:0px; width:100%;  
}


#hm-contact{width:100%; float:left; margin-top:0px;}
#hm-contact div{width:100%; background:#327db7; padding:20px 0; text-align:center; float:left;}
#hm-contact div a{text-decoration:none; color:#ffffff; font-size:20px; border-bottom:3px solid none; padding-bottom:5px;}
#hm-contact div:hover{background#0a66ae; cursor:default;}
#hm-contact div:hover a{ border-bottom:3px solid #ffffff;}



footer{
	/*background:#fbe1e2; */ color:#77214b; text-align:center; width:100%; float:left; padding:15px 0px;
}
footer a{text-decoration:none; color:inherit;}


header{}

/************************************************menu*/
#menu{margin:0px; padding:5px 0; width:100%; float:left; position:relative; z-index:99959; background:#327db7; color:#ffffff;}

#head-title{float:left; width:90%; margin:5px 5%; text-align:center;}
#head-title #title-icon{float:none; height:40px; width:40px; border-radius:100%; background:url(../images/icon/icon.jpg) center no-repeat; background-size:100%; display:inline-block;}
#head-title #title-text{font-size:25px; float:none; height:40px; margin-left:0px; line-height:40px;}

#navbar {float:left; width:auto; margin:0px; margin-left:35px; height:40px; display:none;}
#navbar ul{padding:0; list-style:none; text-align:left; float:left; height:40px; margin:0;}
#navbar ul li{display: inline; float:left; height:40px; line-height:40px;}
#navbar ul li a{text-decoration:none; margin:0px 15px; color:#ffffff;}

#head-social {float:right; width:auto; margin:0px; margin-right:5%; height:40px; width:90%; text-align:center;}
#head-social ul{padding:0; list-style:none; text-align:center; float:left; height:40px; margin:0; width:100%;}
#head-social ul li{display: inline-block; float:none; height:34px; line-height:40px; border:1px solid #ffffff;}
#head-social ul li a{}
#head-social ul li a img{width:24px; margin:5px 5px;}
#head-social ul li a img:hover{transform:scale(1.1);}


.sticky{position:relative !important; top:0; z-index:9998998989;;}


/***********************************************menu closed*/

#banner{
	width:100%; float:left; height:auto; margin:0px; padding:0px;  position:relative; margin-top:0px;
}
#banner #banner-size{
	width:100%; height:auto; float:left; margin:0px;
}
#banner #banner-inn{height:100%; overflow:hidden; width:100%; margin-top:0px; position:absolute; float:left; padding:0;}
#banner #banner-inn img{height:auto; width:100%; float:left; padding:0;}



#banner-mobile{
	display:none;
}
@import url('https://fonts.googleapis.com/css?family=Quicksand:700&display=swap');

/*#banner #img{width:100%; height:100%; margin:0; float:left; margin-top:-50%; position:relative; overflow:hidden; background:blue;} 
#banner #img img{width:100%; float:left;}*/
#banner-text{width:90%; padding-left:5%; height:auto; text-align:left; margin:0; margin-top:-40%; float:left; position:relative;} 
#banner-text h2{color:#5e1237; margin:0; letter-spacing:1px; padding:0; font-size:35px; font-family: 'Quicksand', sans-serif; font-weight:800;}
#banner-text h3{color:#5e1237; font-style:italic; font-weight:600; margin:0; font-size:38px; font-family: 'Quicksand', sans-serif;  line-height:38px; letter-spacing:1px; display:none;}
#banner-text h3 #bcc{color:#5e1237; font-size:30px; font-style: normal; margin:0;}

.jcarousel-wrapper
{width: 350px;}

.jcarousel ul li
{margin:0;}


#hm-social{padding:30px 0; background-size:auto 100%;}

#hm-social #feed{width:90%; margin:0px 5%;}

}