.tabs { position: relative; margin: 0 auto 20px; width: 1000px; clear: both; position: relative; }

.tabs label { display: block; float: left; background: #F4F4F4; color: #6B6A6A; cursor: pointer; font: bold 14pt Arial; position: relative; top: 2px; width: 198px; height: 40px; line-height: 40px; text-align: center; z-index: 1; border: 1px solid #cccccc; margin: 0 auto; }

.icon_t::after { content: "◣"; color: #6B6A6A; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
.icon_t::before { content: "✚"; color: #6B6A6A; font: normal 9pt Arial; position: absolute; bottom: 7px; left: 7px; color: #ffffff; z-index: 999; }

.tabs input { position: absolute; left: -9999px; }

#tab1:checked  ~ #tab_l1 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #4D688B; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab1:checked  ~ #tab_l1::after { content: "◣"; color: #4D688B; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab1:checked  ~ #tab_l1::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }


#tab2:checked  ~ #tab_l2 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #C64645; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab2:checked  ~ #tab_l2::after { content: "◣"; color: #C64645; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab2:checked  ~ #tab_l2::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }



#tab3:checked  ~ #tab_l3 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #1C8193; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab3:checked  ~ #tab_l3::after { content: "◣"; color: #1C8193; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab3:checked  ~ #tab_l3::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }


#tab4:checked  ~ #tab_l4 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #D2952B; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab4:checked  ~ #tab_l4::after { content: "◣"; color: #D2952B; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab4:checked  ~ #tab_l4::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }


#tab5:checked  ~ #tab_l5 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #848C51; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab5:checked  ~ #tab_l5::after { content: "◣"; color: #848C51; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab5:checked  ~ #tab_l5::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }


#tab6:checked  ~ #tab_l6 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #B36C3E; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab6:checked  ~ #tab_l6::after { content: "◣"; color: #B36C3E; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab6:checked  ~ #tab_l6::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }


#tab7:checked  ~ #tab_l7 { background: #F9F9F9; background: linear-gradient(to bottom,#F9F9F9 70%,#C8C7C7 100%); color: #8E5163; top: 0; z-index: 3; border: 1px solid #cccccc; -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; position: relative; }
#tab7:checked  ~ #tab_l7::after { content: "◣"; color: #8E5163; font: bold 40pt Arial; position: absolute; bottom: -17px; left: -3px; }
#tab7:checked  ~ #tab_l7::before { content: "‒"; color: #ffffff; font: bold 12pt Arial; position: absolute; bottom: 4px; left: 7px; color: #ffffff; z-index: 999; }

.tabs_cont { margin: 0 auto; width: 945px; background: #EBEBEB; padding: 20px 25px; position: relative; z-index: 2; height: 230px; border: 1px solid #cccccc; font: normal 11pt Arial; color: #6B6A6A; }
.tabs_cont img { margin: 0 auto; padding: 0; }

.tabs_cont > div {  position: absolute; left: -9999px; top: 0; opacity: 0; -moz-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; }

#tab1:checked ~ .tabs_cont #tab_c1 , #tab2:checked ~ .tabs_cont #tab_c2 , #tab3:checked ~ .tabs_cont #tab_c3 , #tab4:checked ~ .tabs_cont #tab_c4 , #tab5:checked ~ .tabs_cont #tab_c5 , #tab6:checked ~ .tabs_cont #tab_c6 , #tab7:checked ~ .tabs_cont #tab_c7 { position: static; left: 0; opacity: 1; }


.showimgFalse { display: none; visibility: hidden; }

