body {background-color:#f1f1f1;}

table.tbl-list{width:100%;border-collapse:collapse;font-size:13px;}
table.tbl-list .t-center{text-align:center;}
table.tbl-list .t-left{text-align:left;}
table.tbl-list .t-right{text-align:right;}
table.tbl-list .hand{cursor:pointer;}
table.tbl-list tr{ height:45px; }
table.tbl-list th, table.tbl-inp td{ padding:7px; }
table.tbl-list th{ background-color:#111; color:#fff; font-weight:500; }
table.tbl-list tr.line-b th, table.tbl-list tr.line-b td{ border-bottom:1px dotted #ccc; }
table.tbl-list .btn-e{padding:7px 12px;}

.headline-short h1 {font-size:26px;}
.eyoom-form label.input input {font-size:13px;}
.eyoom-form label.select select {font-size:13px;}
.eyoom-form label.textarea textarea {font-size:13px;}
.eyoom-form label.checkbox {font-size:13px;}
.eyoom-form label.checkbox i {top:5px;}

/* header */
.top-header {width:100%;height:35px;background-color:#373737;}
.top-header .top-header-nav {font-size:12px;color:#eee;}
.top-header .top-header-nav a {height:35px;line-height:35px;color:#eee;}
.top-header .top-header-nav a:hover {text-decoration:underline;}
.top-header .top-header-nav a i {color:#eee;}
.header-title {height:75px;padding:0px;background-color:#fff;border-bottom:1px solid #16abc1;}
.header-title .title-logo {float:left;margin:18px 0px 0px 0px;}
.header-title .title-logo img {height:40px;}
.header-title .title-logo span {font-size:27px;font-weight:700;vertical-align:-8px;}
.header-title .nav {float:right;margin:0px;}
.header-title .nav .nav-pc {margin:30px 0px 0px 0px;}
.header-title .nav .nav-pc li {float:left;}
.header-title .nav .nav-pc li a {font-weight:500;}
.header-title .nav .nav-pc li span.bar {margin:15px;font-size:10px;color:#555;vertical-align:2px;}
.header-title .navbar {display:none;}

/* page-top */
.page-top {width:100%;}
.page-top .page-top-l {float:left;width:72.6%;}
.page-top .page-top-l img {width:100%;}
.page-top .page-top-l img.p {display:block;}
.page-top .page-top-l img.m {display:none;}
.page-top .page-top-r {float:right;width:26.2%;}
.page-top .page-top-r .main_bn1 {width:100%;}
.page-top .page-top-r .main_bn2 {width:100%;margin-top:10px;}
.page-top div.both {clear:both;width:100%;height:1px;padding:0px 0px 30px 0px;margin:0px;border:0px;}

/* login */
.eb-login {padding:100px 0px 250px 0px;}
.eb-login .login-box {max-width:420px;margin:0 auto;}
.eb-login .login-box .ol-account {margin-top:8px;}
.eb-login .login-box .ol-account a {font-size:14px;}

/* sub */
.sub {width:100%;margin:0 auto;padding:0px;}
.sub-side {float:left;width:230px;}
.sub-con {float:right;width:calc(100% - 280px);padding:25px 30px;border:1px solid #ccc;background-color:#fff;}
.sub-con-1{border-top:5px solid #091d42;}
.sub-con-2{border-top:5px solid #ff7f27;}
.sub-con-3{border-top:5px solid #4b5caf;}
.sub-con-4{border-top:5px solid #091d42;}
.sub-con-5{border-top:5px solid #ffa620;}
.sub-con-6{border-top:5px solid #4b5caf;}
.sub-con .headline {position:relative;}
.sub-con .page-dir {position:absolute;top:10px;right:0px;}
.sub-con .page-dir span {font-size:12px;font-weight:400;}
.sub-con .page-dir span.on {color:#2054ca;font-weight:600;}
.sub-con .page-dir i {margin:5px;font-size:10px;color:#999;vertical-align:1px;}

.subside {width:100%;border:1px solid #bbb;border-radius:0px 0px 10px 10px;background-color:#fff;}
.subside li.tit {width:100%;padding:10px 18px;font-size:16px;color:#fff;}
.subside li.tit-1 {background-color:#091d42;}
.subside li.tit-2 {background-color:#ff7f27;}
.subside li.tit-3 {background-color:#4b5caf;}
.subside li.tit-4 {background-color:#091d42;}
.subside li.tit-5 {background-color:#ffa620;}
.subside li.menu {position:relative;width:calc(100% - 36px);margin:0px 18px;padding:11px 0px 10px 0px;font-size:14px;color:#000;}
.subside li.menu.bar {border-top:1px dotted #ccc;}
.subside li.menu.on a{color:#2054ca;}
.subside li.menu i {position:absolute;top:15px;right:0px;font-size:11px;}

.subside1 {width:100%;padding:0px 18px;border:1px solid #bbb;border-top:5px solid #555;margin-top:20px;border-radius:0px 0px 10px 10px;background-color:#fff;}
.subside1 li {position:relative;padding:15px 0px 14px 0px;}
.subside1 li.bar {border-top:1px solid #ccc;}
.subside1 li h3{width:100%;margin-bottom:10px;font-size:17px;font-weight:500;}
.subside1 li p{width:100%;font-size:14px;font-weight:300;font-weight:400;font-family:HelveticaNeue,AppleSDGothicNeo-Regular,Arial,sans-serif;}
.subside1 li .btn-e{position:absolute;top:13px;right:0px;padding:3px 5px 2px 5px;background-color:#bbb;font-size:10px;}

.subcon {width:100%;}
.subcon img.pic{width:100%;}
.subcon .tx {padding:15px 0px;font-size:13px;}

.aboutus .titlebox {text-align:center;padding:30px 0px;}
.aboutus .titlebox img.logo {width:60px;}
.aboutus .titlebox span {font-size:36px;font-weight:700;vertical-align:middle;}

/* board */
.board-info .float-start {display:none;}
.blbw-left .btn-e {display:none;}
.webzine-desc h4 a {font-size:17px;}
.webzine-cont {font-size:13px;height:65px;letter-spacing:1px;}
.webzine-info {font-size:13px;}

/* main */
.main-contents .rowsp {margin-top:50px;}
.main-box {position:relative;width:100%;padding:20px 15px;border:1px solid #ccc;border-top:5px solid #ccc;border-radius:0px 0px 8px 8px;background-color:#fff;}
.main-box-1 {border-top:5px solid #ff7f27;}
.main-box-2 {border-top:5px solid #62ce2a;}
.main-box-3 {border-top:5px solid #880015;}
.main-box-4 {border-top:5px solid #3f48cc;}
.main-box-5 {border-top:5px solid #3f48cc;}
.main-box-6 {border-top:5px solid #22b14c;}
.main-box .headline-short h4 {margin-bottom:20px;font-size:20px;font-weight:600;}
.main-box a.ico {display:block;position:absolute;top:30px;right:20px;color:#999;font-size:11px;z-index:11;}

.recol1 .imgbox {width:100%;height:562px;}
.recol1 .thumb {width:100%;display:none;}
.recol1 {width:35%;}
.recol2 {width:65%;}

.main-box-3 .bxslider img {width:100%;}
.main-box-3 .slide h3 {width:100%;height:80px;padding-top:15px;font-size:16px;font-weight:700;text-align:center;font-family:HelveticaNeue,AppleSDGothicNeo-Regular,Arial,sans-serif;}


/* footer */
.footer {background-color:#fff;border-top:1px solid #16abc1;}
.footer a{font-size:13px;}
.footer .footer-top {padding:20px 0px 10px 0px;}
.footer .footer-cont-info {font-size:12px;padding:0px 0px 30px 0px;}
.footer .footer-cont-info-left {float:left;}
.footer .footer-cont-info-right {float:left;text-align:left;margin-left:45px;}
.footer .footer-cont-info span.f {color:#333;}
.footer .footer-cont-info span.c {color:#555;}
.footer .footer-cont-info span.bar {margin:5px;}
.footer .footer-cont-info span.bar1 {margin:5px;font-size:8px;color:#aaa;font-weight:300;}
.footer .footer-cont-info span.copyright {font-size:11px;}
.footer .title-logo {float:left;width:270px;}
.footer .title-logo img {width:100%;}
.footer .title-logo2 {float:left;width:270px;display:none;}
.footer .title-logo2 img {width:100%;;}
.footer .footer-cont-familysite {width:100%;padding:0 0 20px 0}
.footer .footer-cont-familysite .fam{width:180px;margin-right:20px;}
.footer .footer-cont-familysite .fam3{width:180px;margin-right:0px;}
.footer .footer-cont-familysite .fam1{width:220px;margin-right:70px;}
.footer .footer-cont-familysite-m {display:none;}

@media (max-width:1399px) {
	.header-title .nav .nav-pc li span.bar {margin:10px;}

	.recol1 {width:40%;}
	.recol2 {width:60%;}

	.main-box-3 ul li .imgbox {height:180px;}
}
@media (max-width:1199px) {
	.header-title .nav .nav-pc li span.bar {margin:5px;}
	
	.recol1 .imgbox {height:461px;}
	.recol1 {width:40%;}
	.recol2 {width:60%;}

	.page-top .page-top-l {float:none;width:100%;}
	.page-top .page-top-r {display:none;}
	
	.aboutus .titlebox img.logo2 {width:250px;}
	.aboutus .titlebox img.logo {width:40px;}
	.aboutus .titlebox span {font-size:24px;}
}
@media (max-width:991px) {
	.headline-short h1 {font-size:20px;}

	.top-header {display:none;}
	.header-title {height:55px;}
	.header-title .title-logo {margin:10px 0px 0px 0px;}
	.header-title .title-logo img {height:35px;}
	.header-title .title-logo span {font-size:18px;vertical-align:-5px;}
	.header-title .nav .nav-pc {display:none;}
	.header-title .navbar {display:block;}
	.header-title-mobile-btn {top:14px;}

	.page-top .page-top-l img.p {display:none;}
	.page-top .page-top-l img.m {display:block;}

	.eb-login {padding:20px 0px 200px 0px;}

	.sub-side {display:none;}
	.sub-con {float:none;width:100%;padding:25px 15px;}
	.sub-con .page-dir {position:absolute;top:-23px;right:0px;}
	.sub-con .page-dir span {font-size:11px;font-weight:400;}
	.sub-con .page-dir i {margin:1px;font-size:9px;color:#999;vertical-align:1px;}

	table.tbl-list{font-size:12px;}

	.main-contents .rowsp {margin-top:0px;}
	.main-contents .col-4 {float:none;width:100%;padding-bottom:50px;}
	.main-contents .col-6 {float:none;width:100%;padding-bottom:50px;}
	.main-contents .col-8 {float:none;width:100%;padding-bottom:50px;}
	
	.main-box-1 .imgbox {display:none;}
	.main-box-1 .thumb {display:block;}
	
	.footer .title-logo {width:50%;}
	.footer .title-logo2 {width:50%;display:block;}
	.footer .footer-cont-familysite {display:none;}
	.footer .footer-cont-familysite-m {clear:both;width:100%;padding:10px 0px;text-align:left;display:block;}
	.footer .footer-cont-familysite-m .fam {margin-left:0px;}
	.footer .footer-cont-familysite-m .fam1 {width:40%;}
	.footer .footer-cont-familysite-m .fam2 {width:33%;}
	.footer .footer-cont-familysite-m .fam3 {width:23%;}
}
@media (max-width:768px) {
	table.tbl-list{font-size:12px;}

	.main-contents .rowsp {margin-top:0px;}
	.main-contents .col-4 {float:none;width:100%;padding-bottom:50px;}
	.main-contents .col-6 {float:none;width:100%;padding-bottom:50px;}
	.main-contents .col-8 {float:none;width:100%;padding-bottom:50px;}

	.main-box-3 .bxslider .imgbox {height:320px;}

	.aboutus .titlebox img.logo2 {width:300px;}
	.aboutus .titlebox img.logo {width:30px;}
	.aboutus .titlebox span {font-size:22px;}

	.footer .footer-cont-info-right {width:100%;margin:20px 0px 0px 10px;}
}
@media (max-width:576px) {
	.main-box-3 .bxslider .imgbox {height:250px;}
	.main-box-3 .slide h3 {font-size:13px;}
}
@media (max-width:420px) {
	.main-box-3 ul li .imgbox {height:180px;}
	.aboutus .titlebox img.logo2 {width:150px;}
	.aboutus .titlebox img.logo {width:26px;}
	.aboutus .titlebox span {font-size:14px;}
	
	.main-box-3 .bxslider .imgbox {height:210px;}
	.main-box-3 .slide h3 {font-size:12px;}
}
@media (max-width:360px) {
	.main-box-3 .bxslider .imgbox {height:190px;}
	.main-box-3 .slide h3 {font-size:11px;}
}