@charset "utf-8";

.line_top { display: flex; margin-top: 10px;}
.line_top_left { width: 580px;}
.line_top_right { flex: 1; padding-left:20px;}
.line_img_none { width: 100%;}
.line_img_list { display: flex;}
.line_img_main { flex: 1; position: relative;}
.line_img_main img { display: block;}
#line_img_left img { height: 300px;}
.line_img_main p { background-color: rgba(0,0,0,.3); color: #fff; position: absolute; left: 0; bottom: 0; right: 0; width: 100%; height: 40px; line-height: 40px; text-overflow: ellipsis; overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 10px;}
.line_img_list .line_img_right { width: 75px; margin-left: 5px; display: flex; flex-direction: column;}
.line_img_list a { display: block;}
.line_img_list img { display: block; width: 100%; height: 100%;}
.line_img_list .line_img_right .line_img_smail { position: relative; height: 45px; margin: 4px 0;}
.line_img_list .line_img_right .line_img_smail::after { content: ""; display: none; position: absolute; width: 100%; height: 100%; left: 0; top: 0; right: 0; bottom: 0; border: 2px solid var(--color-primary-7); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.line_img_list .line_img_right .line_img_smail.active::after { display: block;}
.line_img_list .line_img_right .line_img_smail:hover::after { display: block; background-color: rgba(255, 255, 255, 0.5);}
.line_img_list .line_img_btn { height: 25px; background-color: var(--color-primary-7); display: flex; justify-content: center; align-items: center;}
.line_img_list .line_img_btn::before { display: block; content: ""; height: 6px; width: 6px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg);}
.line_img_list .line_img_btn:hover { background-color: var(--color-primary-5);}
.line_img_list .line_img_btn.line_img_end { background-color: #ddd; cursor: default;}
.line_img_list .line_img_up::before { border-left: 2px solid #fff; border-bottom: 2px solid #fff; margin-top: 2px;}
.line_img_list .line_img_down::before { border-top: 2px solid #fff; border-right: 2px solid #fff; margin-bottom: 2px;}
.line_img_list .line_img_item { overflow: hidden; height: 250px;}

.line_top_right h1 { font-size: 22px;}
.line_top_right h2 { font-size: 16px;}
.line_top_right h3 { color: var(--color-text-default); font-size: 14px; padding: 20px 0;}
.line_top_right h3 span { padding: 0 20px; border-left: 1px solid #ccc; margin-left: 20px;}
.line_top_right h3 i { color: var(--color-warning-7); padding-right: 10px;}
.line_price_wrap { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 20px 0;}
.line_price_wrap dfn { color: #f60; font-size: 28px;}
.line_price_wrap a { display: block; padding-left: 50px; color: var(--color-text-default); padding-top: 10px;}
.line_price_wrap a:hover { color: var(--color-warning-7);}
.line_top_right_item { display: flex; margin-top: 10px;}
.line_top_right_item h6 { text-align: right; width: 100px; font-size: 16px; font-weight: bold; padding-right: 10px; color: var(--color-text-default); line-height: 30px;}
.line_top_right_item div { flex: 1; line-height: 30px;}
.line_top_right_item span { background-color: var(--color-primary-1); color: var(--color-primary-7); border-radius: 3px; margin-right: 10px; padding:3px 8px; white-space: nowrap; line-height: 30px;}
.line_top_right_item em { background-color: #ffe4c4; color: #f60; border-radius: 3px; padding:3px 8px;}

.line_submit {display: flex; padding: 40px 0;}
.line_submit p { flex: 1; text-align: center;}
.line_submit p span { padding: 0 10px; color: var(--color-primary-7);}
.line_submit div { width: 150px;}
.line_submit a { color: #fff; background-color: var(--color-warning-7); border-radius: 4px; padding:12px 15px;}
.line_submit a:hover { opacity: .7;}

.line_master_wrap { display: flex;}
.line_master_icon img { display: block; border-radius: 50%; width: 64px;}
.line_master_text { flex: 1; display: flex; line-height: 1.5;}
.line_master_text::before { content: "“";}
.line_master_text::after { content: "”"; display: grid; align-content: end;}
.line_master_text::before,
.line_master_text::after { display: block; font-size: 64px; color: var(--color-primary-7); padding: 0 10px; margin-top: 10px;}
.line_master_text div { flex: 1;}
.line_master_text div::before { content: "产品经理推荐"; display: block; font-weight: bold; padding-bottom: 10px;}

#line_date { position: relative; margin-top: 5px;}
#line_date.load::after { display: grid; content: "数据加载中……"; position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: #fff; opacity: 0.3; text-align: center; align-content: center;}
#line_date h6 { display: flex; background-color: var(--color-primary-7);}
#line_date h6 span { display: block; flex: 1; font-size: 16px; color: #fff; text-align: center; padding: 10px 0;}
#line_date h6 a { display: block; padding: 0 15px;}
#line_date h6 a::before { display: block; content: ""; border-left: 2px solid #fff; border-bottom: 2px solid #fff; height: 10px; width: 10px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); margin-top: 15px;}
#line_date h6 a.cal_right::before { border: none; border-right: 2px solid #fff; border-top: 2px solid #fff;}
#line_date h6 a:hover { background-color: var(--color-primary-5);}
#line_date h5 { background-color: var(--color-primary-1); display: flex;}
#line_date h5 span { flex: 1; padding: 10px 0; text-align: center; font-weight: bold; font-size: 14px;}
#line_date h5 span:first-child { color: var(--color-error-7);}
#line_date h5 span:last-child { color: var(--color-success-7);}
/*.line_calendar_wrap { border-top: 1px solid #ddd;}*/
.line_calendar_row { display: flex; border-left: 1px solid #ddd;}
.line_calendar_cell { flex:1; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; height: 80px; position: relative;}
.line_calendar_cell::before { content: attr(d); display: block; position: absolute; top: 3px; right: 3px; color: #999; font-size: 12px;}
.line_calendar_cell a { display: block; height: 100%; cursor: pointer; font-size: 14px; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color: var(--color-text-default);}
.line_calendar_cell a:hover { background-color: var(--color-primary-1);}
.line_calendar_cell a p { line-height: 1.2;}
.line_calendar_cell a p span { padding: 0 5px; color: var(--color-primary-7);}
.line_calendar_cell a dfn { display: block; color: #f60; margin-top: 10px;}

.line_content_wrap { display: flex; margin-top: 20px;}
.line_content_wrap .line_content_icon { padding-right: 20px;}
.line_content_wrap .line_content_icon div { background-color: var(--color-primary-7); color: #fff; width: 80px; font-size: 16px; text-align: center; padding: 20px 0;}
.line_content_wrap .line_content_data { font-size: 14px; color: var(--color-text-default); flex: 1; line-height: 1.5;}
.line_content_wrap .line_content_ext { word-wrap: break-word; word-break: break-all; overflow: hidden;}
.line_content_wrap .line_content_outline { display: flex; flex-wrap: wrap; border-left: 1px solid #ddd; border-top: 1px solid #ddd;}
.line_content_wrap .line_content_outline div { width: 33.33%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 10px;}
.line_content_wrap .line_content_outline div::before { font-family: 'icofont'; content: attr(icon); color: var(--color-primary-7); font-size: 24px; vertical-align: middle; padding-right: 10px;}

.line_content_trip { border: 1px solid #ddd; margin-bottom: 20px;}
.line_content_trip h2 { background-color: var(--color-primary-1); font-size: 18px; padding: 10px; border-bottom: 1px solid #ddd;}
.line_content_trip h2 span { padding-right: 20px;}
.line_content_trip dl { display: flex;}
.line_content_trip dt { width: 80px; border-right: 1px dashed #ddd; text-align: center; padding: 10px 0; font-size: 18px; position: relative;}
.line_content_trip dt span { font-family: 'icofont'; position: absolute; font-size: 18px; top: 10px; right: -10px; color: var(--color-primary-7);}
.line_content_trip dd { flex: 1; padding: 10px 10px 10px 20px;}

.line_content_trip2 { border-left: 1px solid #ddd; border-top: 1px solid #ddd;}
.line_content_trip2 table { border-collapse: collapse; width: 100%;}
.line_content_trip2 td { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; vertical-align: top; padding: 10px;}
.line_content_trip2 thead td { background-color: #eee; text-align: center; font-weight: bold; white-space: nowrap;}