/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea { color: #222;}
body { font-size: 1em; line-height: 1.4;}
a { color: #00e;}
a:visited { color: #551a8b;}
a:hover { color: #06e;}

/* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */

img { vertical-align: middle;}
video{ display: block; max-width: 100%; margin: 0 auto;}

/* Remove default fieldset styles. */

fieldset { border: 0; margin: 0; padding: 0;}

/* Allow only vertical resizing of textareas. */

textarea { resize: vertical;}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body{ background: #FFFFFF; padding: 0 10px;}
.title{ text-align: left; color: #262424; font-weight: bold; font-size: 1.4em; padding: 0px 0px 20px; border-bottom: 1px solid #e4e4e4;}
.news_manage{ text-align: left; color: #cacaca; font-size: 0.6em; margin: 10px 0 0;}
.infocontent{ color: #746b6b; font-size:0.95em; margin: 20px 0 20px; line-height:1.6em;}
.infocontent p{ }
.infocontent img{ margin: 0 auto; display: block; max-width: 100%;}
.video{ display: block; position: relative; margin: 0 auto; width: 300px; height: 169px;}
.poster{ }
.play{ position: absolute; top: 53px; right: 0; left: 0;}

section.content{ padding: 0px 18px 0px 18px;}
section.content .article{ color: #746b6b; font-size:0.95em; margin: 20px 0 20px; line-height:1.6em;}
/* ==========================================================================
   Helper classes
   ========================================================================== */

/* Prevent callout */

.nocallout { -webkit-touch-callout: none;}
.pressed { background-color: rgba(0, 0, 0, 0.7);}

/* A hack for HTML5 contenteditable attribute on mobile */

textarea[contenteditable] { -webkit-appearance: none;}

/* A workaround for S60 3.x and 5.0 devices which do not animated gif images if
   they have been set as display: none */

.gifhidden { position: absolute; left: -100%;}

/*
 * Image replacement
 */

.ir { background-color: transparent; background-repeat: no-repeat; border: 0; direction: ltr; display: block; overflow: hidden; text-align: left; text-indent: -999em;}
.ir br { display: none;}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden { display: none !important; visibility: hidden;}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */

.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible { visibility: hidden;}

/**
 * Clearfix helper
 * Used to contain floats: h5bp.com/q
 */

.clearfix:before,
.clearfix:after { content: ""; display: table;}
.clearfix:after { clear: both;}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 800px) {
    /* Style adjustments for viewports that meet the condition */
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {
    /* Style adjustments for viewports that meet the condition */
}

/* Pic Loading by xinjiantao */
*{ margin:0; padding:0;}
body{ font-size:16px; line-height:34px;}
.img-outer{ position:relative; margin:auto;}
.img-outer .wt-pr{ position:absolute; z-index:80; bottom:10px; right:10px; color:#fff; height:16px; width:24px; background:url(/img/wt-pr.png) no-repeat; background-size:100% auto;filter:alpha(opacity=60); -moz-opacity:0.6; opacity:0.6;}

.loading{ width:30px; height:30px; animation:myfirst 2s infinite; -moz-animation:myfirst 2s infinite; -webkit-animation:myfirst 2s infinite; -ms-animation:myfirst 2s infinite; }
@keyframes myfirst { 0% {transform:rotate(0)} 100% {transform:rotate(360deg)}}
@-moz-keyframes myfirst { 0% {transform:rotate(0)} 100% {transform:rotate(360deg)}}
@-webkit-keyframes myfirst { 0% {transform:rotate(0)} 100% {transform:rotate(360deg)}}
@-ms-keyframes myfirst { 0% {transform:rotate(0)} 100% {transform:rotate(360deg)}}
.page-pic{ margin:0 auto; display:block;}
.failed-pic:active{ opacity:.5;}

.ewm-box{ overflow:hidden; box-shadow:0 0 2px 1px rgba(255,108,0,.1); border:solid 1px #ff6000; padding:10px; box-sizing:border-box; margin:10px; border-radius:4px;}
.ewm-box a{ display:block;}
.ewm-box .txt{ float:left; width:60%; color:#ff6000; font-size:14px; text-align:center; padding-top:15px; line-height:24px; font-weight:bold;}
.ewm-box .pic{ float:left; width:40%; text-align:center;}
.ewm-box .pic img{ width:80%; display:block; margin:0 auto;}