/************************************************************************
 * 通用组件
************************************************************************/

/* 分类列表 */
.catalogues_wrap { top: 0; left: 0; z-index: 1000; display: none; width: 100%; background-color: #4a221a; font-size: .75rem; color: #fff; }
.catalogues_title { padding-left: .5rem; height: 40px; line-height: 40px; border-bottom: 1px solid #55352f; }
.catalogues_title .back { display: block; width: 2rem; height: 100%; background: url(../img/arrow_l1.png) no-repeat center center; -webkit- background-size: 26px 12px;  background-size: 26px 12px; }
.catalogues_tit dt { width: 26%; max-height: 100%; }
.max_list, .min_list_box { max-height: 590px; overflow-x: auto; }
.max_list { max-height: 564px; overflow-x: auto; }
.max_list li { display: block; height: 45px; line-height: 45px; text-align: center; overflow:hidden; }
.max_list li.sel { background-color: #55352f; }
.catalogues_tit dd { padding: .35rem; box-sizing: border-box; width: 74%; min-height: 600px; background-color: #55352f; overflow-x: auto; }
.catalogues_tit dd h2 { height: 30px; line-height: 30px; border-bottom: 1px solid #6d514b; font-size: .75rem; }
.min_list li { float: left; width: 33.33%; height: 36px; line-height: 36px; text-align: center; overflow:hidden;color: #fff }
.min_list li a { display:block; width:100%; height:100%; font-size: .7rem; color: #eee; }

/* 顶部导航栏 */
.nav_top { top: 0; left: 0; width: 100%; height:65px; line-height:65px; background-color: #4a221a; }
.nav_top a { width: 20%; height: 100%; overflow: hidden; }
.nav_top a i { position: relative; display: inline-block; width: 60px; height: 60px; overflow: hidden; }
.nav_L .msg { position: absolute; top: 15px; right: 13px; width: 8px; height: 8px; border-radius: 50%; background-color: #a02407; }
.nav_tit { width: 100%; height: 100%; background: url(../img/logo1.png) no-repeat center center; -webkit- background-size: 276px 55px;  background-size: 276px 55px; overflow: hidden; }

/* 底部导航栏 */
.nav_bot { bottom: 0; left: 0; width: 100%; height:80px; }
.nav_bot a { float: left; box-sizing: border-box; width: 25%; height: 100%; border-right: 1px solid #210e0a; border-left: 1px solid #6a3328; background-color: #4a221a; background-repeat: no-repeat; background-position: center center; -webkit-background-size: contain; background-size: contain; }
.nav_bot a  img{width:auto;height:auto;margin:6px auto 0;display:block;}
.nav_bot a span{display:block;text-align:center;font-size:12px;color:#fff;line-height:25px;}
/**.nav_bot a:nth-child(1) { background-image: url(../img/nav2.1.png); border-left: 0; }
.nav_bot a:nth-child(2) { background-image: url(../img/nav2.2.png); }**/
.nav_bot a.num2 { background-image: url(../img/nav2.2_1.png); }
/**.nav_bot a:nth-child(3) { background-image: url(../img/nav2.3.png); }
.nav_bot a:nth-child(4) { background-image: url(../img/nav2.4.png); border-right: 0; }**/
.nav_bot a.sel { opacity: .9; }

.nav_bot1 a { border: 0; text-align: center; font-size: .7rem; color: #fff; }
.nav_bot1 a img { margin: 6px 0 4px; width: 22px; height: 20px; }
.nav_bot1 a span { display:block; }
.nav_bot1 a:nth-child(1) { background: #ed8a19; }
.nav_bot1 a:nth-child(2) { background: #57a914; }
.nav_bot1 a:nth-child(3) { background: #4bb3ea; }
.nav_bot1 a:nth-child(4) { background: #d69438; }

/* 面包屑导航 */
.crumbs_nav { padding: 14px .5rem 10px; font-size: .7rem; color: #666; }
.crumbs_nav a { color: #666; }

/* 图片 */
.pic { display: block; margin-right: .5rem; overflow: hidden; text-align: center; }
.pic img { vertical-align: middle; }
.pic1 { float: left; width: 70px; height: 70px; }
.pic2 { float: left; width: 64px; height: 64px; line-height: 60px; border-radius: 50%; }
.pic3 { float: left; width: 49px; height: 49px; line-height: 49px; border-radius: 50%; }

/* 切换 */
.switch_tag { padding: 4px .5rem 8px; box-sizing: border-box; height: 52px; }
.switch_tag a { position: relative; float: left; margin-right: 3.2%; display: block; width: 22.5%; height: 40px; line-height: 40px; text-align: center; background-color: #ccc; font-size: .35rem; color: #333; }
.switch_tag a:last-child { margin-right: 0; }
.switch_tag a:after { content: ''; display: none; position: absolute; bottom: -4px; right: 50%; margin-right: -4px; width: 8px; height: 4px; background: url(../img/arrow_b1.png) no-repeat center center; -webkit-background-size: 100%; background-size: 100%; }
.switch_tag a.sel:after { display: block; }
.switch_tag a.sel { background-color: #4a221a; color: #fff; }

/* .switch_con { display: none; }
.switch_con.sel { display: block; } */

.switch_list1 li { padding: .5rem; border-bottom: 1px solid #d9d9d9; }
.switch_list1 .tit { padding: 0 .5rem; height: 50px; line-height: 50px; border-bottom: 1px solid #d9d9d9; font-size: .85rem; color: #333; }
.switch_list1 .con { float: left; width: 72%; height: 100%; }
.switch_list1 .con h2 { display: block; height: .8rem; font-size: .8rem; color: #333; }
.switch_list1 .con h3 { margin-top: .4rem; display: block; height: .7rem; font-size: .7rem; color: #999; }
.switch_list1 .other { position: absolute; bottom: 0; right: 0; text-align: right; }
.switch_list1 .other span { margin-left: .6rem; padding-left: 20px; font-size: .6rem; color: #999; background-size: 16px 12px; }
.switch_list1 .other .num1 { background: url(../img/icon4.1.png) no-repeat 0 center; background-size: 16px 12px; }
.switch_list1 .other .num2 { background: url(../img/icon4.2.png) no-repeat 0 center; background-size: 16px 12px; }

.switch_list2 .con h2 { height: auto; font-size: .65rem; }
.switch_list2 .con h2 span { margin-right: .75rem; }
.switch_list2 .con .name { font-size: .8rem; }
.switch_list2 .con { line-height: 1.5; font-size: .7rem; }
.switch_list2 .con .msg0 { color: #999; }
.switch_list2 .con .msg1 { margin-top: 5px; color: #666; }
.switch_list2 .con .msg2 { color: #999; }
.switch_list2 .con .msg2 span { display: inline-block; margin: 4px 6px 0 0; padding: 0 6px; background-color: #d69438; border-radius: 6px; color: #fff; }

.star { margin-top: 6px; }
.star i { float: left; margin: 2px 2px 0 0; display: block; width: 13px; height: 13px; background-image: url('../img/icon_stars.png'); background-repeat: no-repeat; }
.star i.sel { background-position: 0 -14px; }
.star span { vertical-align: top; margin-left: 8px; font-size: 12px; color: #eb7c2b; }

.switch_list2 .other1 { color: #999; }
.switch_list2 .other1 span { margin-right: 12px; line-height: .65rem; font-size: .65rem; }
.switch_list2 .other1 .follow { margin-right: 0; padding-left: 20px; background: url(../img/icon8.png) no-repeat 0 1px; }

.switch_list2 .link i { float: left; margin-left: .35rem; width: 38px; height: 26px; background-color: #4a221a; background-image: url('../img/link_icon.png'); background-repeat: no-repeat; border-radius:5px; }
.switch_list2 .link i.icon1 { background-position: 0 -60px; }
.switch_list2 .link i.icon2 { background-position: 0 5px; }
.switch_list2 .link i.icon3 { background-position: 0 -28px; }

.switch_list3 li { padding: .8rem .5rem; }
.switch_list3 li .other .num2 { background: url(../img/icon4.3.png) no-repeat 0 center; background-size: 16px 12px; }
.switch_list3 .con { width: 82%; }

.switch_list4 li .name,
.switch_list4 li .con .msg1 { color: #fff; }
.switch_list4 li .con .msg2 { color: #fff; }
.switch_list4 li { border-bottom: 0; }
.switch_list4 li .con { width: 75%; text-align: justify; }
.switch_list4 li .con1 { width: 84%; }

/* 按钮 */
.btn { box-sizing: border-box; font-size: 18px; color: #fff; }
.btn3 { width: 100px; height: 26px; line-height: 24px; background-color: #ea7c2c; font-size: 14px; }
.btn7 { width: 80px; height: 26px; line-height: 24px; background-color: #ea7c2c; border-radius: 5px; font-size: 14px; }
.btn7_1 { width: 65px; font-size: .75rem; }
.btn8 { width: 120px; height: 26px; line-height: 24px; border: 1px solid #5ccf49; background-color: #fff; border-radius: 5px; font-size: 14px; color: #5ccf49; }
.btn9 { margin: 0 6px; height: 40px; line-height: 40px; background-color: #d69438; border-radius: 5px; font-size: 1rem; }
.btn9_2 { width: 54%; }
.btn9_3 { width: 28%; background-color: #4a221a; }
.btn10 { width: 240px; height: 34px; line-height: 34px; background-color: #d69438; font-size: .75rem; }

/* 选择框 + 输入框
============================================= */
.frame_box { font-size: .75rem; color: #333; }
.frame_box.num1 { padding: 1.35rem 0; border-top: 1px solid #d9d9d9; border-bottom: 1px solid #d9d9d9; background-color: #fff; }
.frame_box .tit { float: left; padding-right: 10px; box-sizing: border-box; width: 27.46%; height: 36px; line-height: 36px; border: 1px solid transparent; text-align: right; overflow: hidden; }
.frame_box .hints { margin-left: 6px; display: inline-block; height: 36px; line-height: 36px; }
.frame_box .box { position: relative; float: left; padding: 0 6px; box-sizing: border-box; width: 42%; height: 36px; line-height: 36px; border: 1px solid #b3b3b3; outline: 0 none; background-color: #fbfcfc; font-size: .75rem; color: #333; }
.frame_box .box.box1 { width: 64%; }
.frame_box .box.box2 { padding: 7px 6px; width: 64%; height: 130px; line-height: 1.5; overflow-y: auto; text-align: justify; }
.frame_box .box.box3 { width: 28%; }
.frame_box .size1 { padding-right: 34px; }
.frame_box .box .icon { position: absolute; top: 0; right: 0; width: 34px; height: 100%; background: url(../img/arrow_b1.2.png) no-repeat center center; -webkit-background-size: 9px 5px; background-size: 9px 5px; }
.frame_box .list { margin-bottom: 10px; }
.frame_box .list:last-child { margin-bottom: 0; }

.menu { position:absolute; top:34px; left:-1px; z-index: 6; display: none; width: 100%; border: 1px solid #b3b3b3; background-color: #fbfcfc; }
.menu li { box-sizing: border-box; padding: 0 6px; line-height: 34px; border-bottom: 1px solid #ddd; background: none; overflow: hidden; }
.menu li:last-child { border-bottom: 0; }

/* 单选
============================================= */
.select_tag .item { margin-top: 13px; display: inline-block; width: 40%; text-align: left; }
.select_tag1 .item { width: 26%; }
.select_tag .item i { margin-right: 7px; display: inline-block; box-sizing: border-box; width: 12px; height: 12px; border: 1px solid #9c9c9c; border-radius: 50%; background-color: #ddd; }
.select_tag .item.sel i { background: #ddd url(../img/dot3.png) no-repeat center center; }

/* 状态提示
============================================= */
.status_hint { font-size: .8rem; color: #333; }
.status_hint .hint { margin-right: .5rem; display: inline-block; width: 28px; height: 28px;  background: url(../img/iocn_ok.png) no-repeat 0 0; -webkit-background-size: 100%; background-size: 100%; vertical-align: middle; }

/* 搜索
============================================= */
.search_box { position: relative; margin: .5rem; }
.search_box .icon { position: absolute; top: 0; right: 0; width: 32px; height: 100%; background: url(../img/icon_search.png) no-repeat center center; -webkit-background-size: 14px 15px; background-size: 14px 15px; }
.search_box .box { padding: 0 32px 0 10px; box-sizing: border-box; width: 100%; height: 32px; line-height: 32px; border: 0; background-color: #e6e6e8; text-align: center; border-radius: 5px; font-size: .75rem; color: #333; outline: 0 none; }

/* 加载更多
============================================= */
.load_box img { width:27px; height:27px; -webkit-animation:loading-anim 1s infinite;animation:loading-anim 1s infinite; }
@-webkit-keyframes loading-anim{
	from{-webkit-transform:rotate(0deg)}
	8.32%{-webkit-transform:rotate(0deg)}
	8.33%{-webkit-transform:rotate(30deg)}
	16.65%{-webkit-transform:rotate(30deg)}
	16.66%{-webkit-transform:rotate(60deg)}
	24.99%{-webkit-transform:rotate(60deg)}
	25%{-webkit-transform:rotate(90deg)}
	33.32%{-webkit-transform:rotate(90deg)}
	33.33%{-webkit-transform:rotate(120deg)}
	41.65%{-webkit-transform:rotate(120deg)}
	41.66%{-webkit-transform:rotate(150deg)}
	49.99%{-webkit-transform:rotate(150deg)}
	50%{-webkit-transform:rotate(180deg)}
	58.32%{-webkit-transform:rotate(180deg)}
	58.33%{-webkit-transform:rotate(210deg)}
	66.65%{-webkit-transform:rotate(210deg)}
	66.66%{-webkit-transform:rotate(240deg)}
	74.99%{-webkit-transform:rotate(240deg)}
	75%{-webkit-transform:rotate(270deg)}
	83.32%{-webkit-transform:rotate(270deg)}
	83.33%{-webkit-transform:rotate(300deg)}
	91.65%{-webkit-transform:rotate(300deg)}
	91.66%{-webkit-transform:rotate(330deg)}
	99.99%{-webkit-transform:rotate(330deg)}
	to{-webkit-transform:rotate(360deg)}
}

