@charset "UTF-8";
body{background-color: #272727;}
.flexbox{display: -ms-flexbox;display: -webkit-flex;display: flex;-ms-flex-direction: row;flex-direction: row;flex-wrap: nowrap;-webkit-box-pack: justify;-ms-flex-pack: justify;-webkit-justify-content: space-between;justify-content: space-between;}
.sticky_top{
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: sticky;
    top: 0;
    left: 0;
    z-index: 999;
}
header.header{
    background-color: #ffe114;
    width: 100%;
    height: 1em;
    position: -webkit-sticky;
    position: -moz-sticky;
    position: -ms-sticky;
    position: sticky;
    top: 0;
    left: 0;
    z-index: 9980;
    font-size: 1rem;
}
header.header div.wraper{
    position: relative;
    width: 100%;
    text-align: center;
}
header.header div.wraper div.title{
    font-size: .4em;
    line-height: 2.5em;
    height: 2.5em;
    display: block;
    font-weight: bold;
}
header.header div.ias{
    position: absolute;
    font-family: sooqfont;
    left: 0;
    top: 0;
    font-size: .5em;
    line-height: 2em;
    padding-left: .4em;
}
header.header div.rs{
    position: absolute;
    font-family: sooqfont;
    right: 0;
    top: 0;
    font-size: .5em;
    line-height: 2em;
    padding-right: .4em;
}

div#login_panel {
	top: 0;
	font-size: 1rem;
	width: 5.2em;
	padding: 0 .3em;
}
.main_content{
	font-size:1rem;
}

.main_content .banner {
	height: 4.2em;
	background-color: #2D2E35;
	left: 0;
	z-index: 9980;
}
.main_content .nav{
	background-color:#000;
	position: -webkit-sticky;
	position: -moz-sticky;
	position: -ms-sticky;
	position: sticky;
	top: 1rem;
	left: 0;
	z-index: 9980;
	font-size: .25rem;
}
.main_content .nav .items {
	text-align: center;
	vertical-align: top;
	margin: auto;
}
.main_content .nav .items .item{
	display: block;
	text-align: center;
	width: 20%;
	margin: 0 .25em;
}
.main_content .nav .items .item a{
	font-size: 1em;
	line-height: 3em;
	display: block;
	color: #fff;
    white-space: nowrap;
}
.main_content .nav .items .item a.focus{
	color:#ffc34b;
}
.left-line { position: relative; }
.left-line:before{display: block;content: "";position: absolute;background-color: #555;width: 1px;height: 70%;left: -.25em;top: 15%;}


div#contents {
	min-height: 12rem;
	background-color: #ffffff;
}
div#contents .m_article{
    width: 100%;
    margin: 0;
    padding: .2rem;
}

div.live_box div.item{
	display: block;
	line-height: .88rem;
	font-size: .5rem;
	width: 7.1rem;
	margin-left: .2rem;
	color: #000;
}
div.live_box div.item span{
	/* font-size: .3rem; */
	font-weight: bold;
}
div#replay_box{font-size:1rem;padding-bottom: 1px;padding-top: 1px;}
div#replay_box div.video-item {
	line-height: .6em;
	width: 7.1em;
	height: 3.9em;
	margin: .3em auto;
}

div#player1 {
	width: 7.5rem;
}

#replay_box .item{position:relative;}
#replay_box .img {width: 7.1rem;height: 5.5rem;overflow:hidden;}
#replay_box .img img{width:100%;}
#replay_box .txt{float: right;width: 4rem;padding-top: .2rem;}

.contents .video-item .v-play {
	left: 3em;
	top: -.5em;
}

a#admin-link {
	position: absolute;
	top: 1.5em;
	right: 0;
	width: 1.1em;
	height: 1.1em;
	font-size: .4em;
	color: #e6e6e6;
}

div#live_box div.item a.link {
	color: #000;
	font-weight: bold;
}

.contents .video-item .v-play {
    width: .7em;
    height: .5em;
    top: -.2em;
    border-radius: .2em;
}

.contents .video-item .v-mask {
    position: absolute;
    width: 100%;
    height: 2.33em;
    bottom: 0;
    left: 0;
    z-index: 2;
    background: url('/static/mobile/images/shade.png') center center no-repeat;
    background-size: cover;
    box-sizing: border-box;
    padding: 0 .2em
}

.contents .video-item .v-head {
    width: 100%;
    bottom: .74em;
    line-height: .46em;
    padding: 0 .2em;
}

.contents .video-item .v-title {
    font-size: .34em;
}

.adv_ico_container{display:block;}
.adv_ico_container a{width: 100% !important;height:auto !important;float: none;}
.adv_ico_container a > img{width: 100% !important;height: auto !important;}

@media (min-device-width: 812px) {
    body {
        line-height: 1.5;
        width: 100%;
        height: auto;
        background-color:transparent;
    }
    header.header{
        font-size: 60px;
    }
    .main_content {
        font-size:60px;
    }
    .main_content .banner{
        position:static;
        height: auto;
        background-image: url("/CIIF2023/images/bg.jpg");
        background-size: cover;
    }
    div#player1 {
        margin:auto;
    }
    .main_content .nav{
        position: relative;
        top: 0;
        font-size: 20px;
    }
    div#replay_box, div.live_box{font-size: 30px;width: 812px;margin: auto;}
    div#replay_box div.video-item{
        float:left;
        margin-left: 9px;
        width: 260px;
        height: 146.25px;
        
    }
    div.live_box div.item{font-size:26px;}
    div#replay_box:after {
        content: ".";
        display: block;
        height: 0;
        visibility: hidden;
        clear: both
    }
	.contents .video-item .v-title{
		font-size: 16px;
		line-height: 1.5em;
	}
	.contents .video-item .v-play{
		width: 60px;
		height: 35px;
	}
    .main_content .fixedhack_ios_fixed_bottom{
        position:static;
    }
    div#login_panel {font-size:60px;}
    #index_header {font-size: 30px;margin: auto;}
    .m_photoset .m_photoset_title,.m_article .m_article_info .m_article_title{font-size:26px;}
    .adv_ico_container a{width: 50% !important;float:left;font-size:16px;}
    .adv_ico_container a.full{width: 100% !important;float:none;}

    .main_content .nav .items.flexbox{
        width:812px;
    }
    .main_content .nav .items.flexbox .item{
        /* width: 50%; */
    }

 
}
@media (min-width: 1200px) {
	div#contents,.main_content .adv_ico_container{
		width:1200px;
		margin:auto;
	}

}
