/*
  JM / 365today visual refresh
  Conservative CSS-only theme. Keep the old PHP, SQL, links and layout structure intact.
*/

html,
body {
    background: #f4f8fc;
    color: #172b42;
    font-family: "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif;
}

body,
td,
th,
input,
button,
textarea,
select {
    font-family: "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif;
}

a {
    color: #133b66;
}

a:hover,
a:focus {
    color: #006fc9;
    text-decoration: none;
}

#wrap_sub {
    background: linear-gradient(180deg, #ffffff 0, #f6fbff 260px, #f4f8fc 100%);
}

/* Header: keep the original 978px grid so menus and banners do not drift. */
#header {
    width: 978px;
    height: 35px;
}

#header .tm {
    position: relative;
    color: #5d7188;
    font-size: 13px;
    line-height: 34px;
}

#header .tm .jm-top-link {
    display: inline;
    margin: 0;
    padding: 15px 3px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #5d7188;
    font-size: 13px;
    font-weight: 700;
    line-height: inherit;
}

#header .tm .jm-top-link:hover {
    color: #0f4f91;
    background: transparent;
}

#header .tm a {
    color: #5d7188;
    font-weight: 600;
}

#header .tm a:hover {
    color: #0f4f91;
}

#header .tm img {
    opacity: .35;
    vertical-align: middle;
}

#hd {
    width: 978px;
    height: 101px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#hd .tm_logo img {
    max-width: 220px;
    height: auto;
}

#hd_sch {
    border: 1px solid #c9dbea;
    border-radius: 6px;
    overflow: hidden;
    background: #ffffff;
}

#hd_sch #sch_stx {
    height: 32px;
    padding-left: 10px;
    background: #ffffff;
    color: #172b42;
    font-size: 14px;
    line-height: 32px !important;
}

#hd_sch #sch_submit {
    height: 32px;
    background: #0f4f91;
    color: #ffffff;
    font-weight: 700;
}

/* Navigation: preserve the original dimensions; only refresh colors around it. */
#gnb_sub {
    height: 50px;
    background: #0f2f57;
    box-shadow: 0 8px 18px rgba(18, 36, 59, .12);
    overflow: visible;
}

#main_nav {
    display: inline-block !important;
    width: 978px;
    height: 50px;
    position: relative;
    margin: 0 auto;
    top: 0;
}

#main_nav_wrapper {
    width: 684px;
}

.jm-text-nav #main_nav_wrapper div ul {
    margin: 0;
    padding: 0;
}

.jm-text-nav #main_nav_wrapper div ul li {
    box-sizing: border-box;
    position: relative;
    width: 114px;
    height: 50px;
    list-style: none;
    float: left;
    border-left: 1px solid rgba(255,255,255,.12);
    border-right: 1px solid rgba(0,0,0,.18);
}

.jm-text-nav #main_nav_wrapper > div > ul > li > a {
    display: block;
    width: 114px;
    height: 50px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
    line-height: 50px;
    text-align: center;
}

.jm-text-nav #main_nav_wrapper .jm-dropdown {
    box-sizing: border-box;
    display: none;
    position: absolute;
    top: 50px;
    left: 0;
    z-index: 10000;
    width: 150px;
    margin: 0;
    padding: 7px 0;
    background: #ffffff;
    border: 1px solid #d3e2ee;
    border-top: 0;
    border-radius: 0 0 7px 7px;
    box-shadow: 0 12px 22px rgba(18, 36, 59, .12);
    overflow: hidden;
}

.jm-text-nav #main_nav_wrapper div ul li:hover > .jm-dropdown,
.jm-text-nav #main_nav_wrapper div ul li:focus-within > .jm-dropdown {
    display: block;
}

.jm-text-nav #main_nav_wrapper .jm-dropdown li {
    box-sizing: border-box;
    display: block;
    float: none;
    width: 100%;
    height: auto;
    border: 0;
    background: #ffffff;
}

.jm-text-nav #main_nav_wrapper .jm-dropdown li a {
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: auto;
    padding: 8px 13px;
    color: #183b60;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    text-align: left;
    white-space: nowrap;
}

.jm-text-nav #main_nav_wrapper .jm-dropdown li a:hover,
.jm-text-nav #main_nav_wrapper .jm-dropdown li a:focus {
    background: #eef7ff;
    color: #006fc9;
}

.jm-text-nav #main_nav_wrapper > div > ul > li.on > a,
.jm-text-nav #main_nav_wrapper > div > ul > li > a:hover,
.jm-text-nav #main_nav_wrapper > div > ul > li > a:focus {
    background: #0b2444;
    color: #ffffff;
}

#main_nav_login {
    float: right;
    width: 288px;
    height: 50px;
    padding: 0;
    text-align: right;
}

#main_nav_login > ul {
    display: table;
    float: right;
    height: 50px;
    margin: 0;
    padding: 0;
}

#main_nav_login > ul > li {
    display: table-cell;
    float: none;
    height: 50px;
    vertical-align: middle;
}

#main_nav_login .login {
    margin: 0;
    padding-right: 8px;
    white-space: nowrap;
}

.jm-login-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 26px;
    margin: 0 0 0 4px;
    padding: 0 8px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 4px;
    background: rgba(255,255,255,.12);
    color: #ffffff !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    vertical-align: middle;
}

.jm-login-btn:hover,
.jm-login-btn:focus {
    background: #ffffff;
    color: #0f2f57 !important;
}

#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon {
    display: inline-block !important;
    width: 32px;
    height: 32px;
    margin-left: 6px;
    padding: 0 !important;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 4px;
    background-color: rgba(255,255,255,.12);
    background-image:
        linear-gradient(#ffffff, #ffffff),
        linear-gradient(#ffffff, #ffffff),
        linear-gradient(#ffffff, #ffffff);
    background-position:
        center 9px,
        center 15px,
        center 21px;
    background-repeat: no-repeat;
    background-size: 17px 2px;
    text-indent: 0 !important;
    overflow: hidden !important;
    font-size: 0 !important;
    line-height: 0 !important;
    vertical-align: middle;
}

#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon span {
    display: none !important;
}

#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon:hover,
#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon:focus {
    background-color: #ffffff;
    background-image:
        linear-gradient(#0f2f57, #0f2f57),
        linear-gradient(#0f2f57, #0f2f57),
        linear-gradient(#0f2f57, #0f2f57);
}

#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon::before,
#rightsidebarmenu.sitemapmenu > ul li a.jm-menu-icon::after {
    display: none !important;
    content: none !important;
}

#rightsidebarmenu.sitemapmenu,
#rightsidebarmenu.sitemapmenu > ul,
#rightsidebarmenu.sitemapmenu > ul .btn {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
}

#rightsidebarmenu.sitemapmenu > ul {
    display: block;
    float: none;
}

#rightsidebarmenu.sitemapmenu > ul .btn {
    display: block;
}

#rightsidebarmenu.sitemapmenu ul li > div,
#rightsidebarmenu.sitemapmenu ul li > ul {
    top: 50px;
    right: 0;
    left: auto;
    width: 978px;
    margin-top: 0;
}

/* The old script opens a large submenu panel. Hide it to keep articles directly under the menu. */
#sub_nav_mask {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.sub_nav_wrapper {
    display: none !important;
}

.sub_nav_wrapper > div {
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 11px 16px 0 !important;
}

.sub_nav_wrapper ul {
    margin: 0;
    padding: 0;
}

.sub_nav_wrapper li {
    display: block;
    float: left;
    height: 18px;
    padding: 0 14px;
    border-right: 1px solid #dcebf6;
    line-height: 18px;
}

.sub_nav_wrapper li:first-child {
    padding-left: 0;
}

.sub_nav_wrapper li a {
    color: #183b60;
    font-size: 13px;
    font-weight: 700;
}

.sub_nav_wrapper li a:hover {
    color: #006fc9;
}

/* Critical: keep old fixed-height main area because lower blocks are absolutely placed. */
#wrapper {
    top: 24px;
    height: 1400px;
    min-height: 1400px;
    padding-bottom: 0;
}

#wrapper_new {
    top: 70px;
    margin-bottom: 70px;
}

.contain,
.contain_new {
    width: 977px;
}

.contain > ul,
.contain1,
.contain2 {
    padding-left: 0;
}

/* News boxes: visual polish only, no width/position overrides. */
.contain .cl .news,
.contain .cl .news_total,
.contain .cc .contest,
.contain .cr .photonews,
.contain .cr .food,
.contain .cr .dt,
.contain2 .cl .life,
.contain2 .cr .room {
    background: #ffffff;
    border-color: #dcebf6;
    border-radius: 7px;
    box-shadow: 0 10px 24px rgba(18, 36, 59, .05);
}

.contain .cl .news_total h2,
.contain .cc .contest_total h2,
.contain .cc .ysin h2,
.contain .cc .movie h2,
.contain .cr .photonews h2,
.contain .cr .food h2,
.contain .cr .dt h2,
.contain2 .cl .life h2,
.contain2 .cr .room h2,
.contain1 .cl .photo h2 {
    border-bottom: 1px solid #dcebf6;
    color: #0f2f57;
    letter-spacing: 0;
}

.contain h2 a,
.contain1 h2 a,
.contain2 h2 a {
    color: #0f2f57;
    font-weight: 800;
}

.contain h2 a:hover,
.contain1 h2 a:hover,
.contain2 h2 a:hover {
    color: #006fc9;
}

.contain2 .gt {
    background: #0f2f57;
    border-radius: 6px;
    color: #ffffff;
    letter-spacing: 0;
}

.contain1 {
    border-top-color: #dcebf6;
}

.latest a,
.lt a,
.tbl_head01 a,
.tbl_head02 a {
    color: #183b60;
}

.latest a:hover,
.lt a:hover,
.tbl_head01 a:hover,
.tbl_head02 a:hover {
    color: #006fc9;
}

/* Board/list/read pages: restrained newspaper-like cleanup. */
#board .bo_tit {
    border-bottom-color: #dcebf6;
}

#board .bo_tit .bo_img {
    color: #0f2f57;
    font-size: 30px;
    letter-spacing: 0;
}

.tbl_wrap table,
.tbl_head01,
.tbl_head02,
.tbl_frm01 {
    background: #ffffff;
}

.tbl_head01 thead th,
.tbl_head02 thead th {
    border-top: 2px solid #0f2f57;
    border-bottom: 1px solid #dcebf6;
    background: #f0f6fb;
    color: #0f2f57;
    letter-spacing: 0;
}

.tbl_head01 td,
.tbl_head02 td {
    border-top-color: #edf3f8;
    color: #354b63;
}

.tbl_frm01 th {
    background: #f0f6fb;
    color: #0f2f57;
}

.tbl_frm01 td {
    background: #ffffff;
}

.frm_input,
.tbl_frm01 textarea,
select {
    border: 1px solid #c9dbea;
    border-radius: 4px;
    background: #ffffff;
    color: #172b42;
}

.btn_submit,
.btn_b01,
.btn_b02,
.btn_b03,
.btn_admin,
a.btn_b01,
a.btn_b02,
a.btn_b03 {
    border-radius: 4px !important;
    font-weight: 700;
}

.btn_submit,
a.btn_b02,
.btn_b02 {
    border-color: #0f4f91 !important;
    background: #0f4f91 !important;
    color: #ffffff !important;
}

a.btn_b01,
.btn_b01 {
    border-color: #c9dbea !important;
    background: #ffffff !important;
    color: #0f4f91 !important;
}

#bo_v_title {
    color: #0f2f57;
    line-height: 1.35;
    letter-spacing: 0;
}

#bo_v_con {
    color: #1f334a;
    font-size: 16px;
    line-height: 1.8;
}

/* Footer: keep it below the original wrapper height. */
#ft_tb {
    clear: both;
    margin-top: 60px;
    background: #ffffff;
}

#ft {
    border-top: 1px solid #dcebf6;
}

#ft ul {
    border-bottom-color: #edf3f8;
}

#ft p {
    color: #5d7188;
}

#ft a {
    color: #183b60;
}

#ft a:hover {
    color: #006fc9;
}

@media (max-width: 990px) {
    #header,
    #hd,
    #main_nav,
    .contain,
    .contain_new,
    #ft,
    #ft div {
        width: 96%;
    }
}
