
/*-- Right Menu --------*/

#right_menu {
    float:right;
    position:fixed;
    top: 4.0em;
	margin: 0 0 0 81.9em;
    width: 18.0em;
    color: black;
    border: 1px solid #2a406a;
    background-color: white;
}

.entries {
    padding: 0;
    position: relative;
    left: 0;
    right: 0;
    text-align: left;
}

.entries .right_title {
    padding: 0.4em 0.6em;
    box-sizing: border-box;
    width: 100%;
    background-color: #141E32;
    vertical-align: middle;
    color: white;
}

.entries ul {
    padding-left: 2.8em;
}
.entries ul li{
    padding-bottom: 0.6em;
    padding-right: 0.7em;
}
/** Contents(Right)  ------------------------------*/
#contents {
    padding: 0;
    top: 0em;
    margin-left:26.0em;
    background-color: white;
    position: relative
}

#contents #sub_title {
    position:absolute;
    background-color: #E6E6E6;
    width: 100%; 
    padding: 0.4em 0 0.4em 1.0em;
    box-sizing: border-box;
    text-align: left;
    font-size: 1.2em;
}

#contents .message {
    padding: 2.5em;
    padding-bottom: 6.8em;
    font-size:1.6em;
    min-height: 560px;
    position: relative;
    width: 48em;
}

#contents #message_list {
    position: relative;
    width: 82.0em;
    min-height: 750px;
}

#contents .message_date {
    font-size: 0.8em;
    margin-left: 4.6em;
    margin-top: -1.0em;
    margin-bottom: 0.6em;
}

#contents .messages,
#bottom_link_block {
    padding: 0 2.5em 2.5em 2.5em;
    font-size:1.6em;
    position: relative;
}

.haveEl{
    color: #1664AE;
    font-weight: bold;
    text-decoration: underline;
    margin-left: 15px;
}

.havenotEl{
    color: grey !important;
    margin-left: 15px;
}

.color_black {
    color: #000000;
}

#contents .monthes {
    padding: 2.5em 2.5em 1.0em 2.5em;
    font-size:1.6em;
    position: relative;
}

#monthesbox{
    word-wrap: break-word;
    overflow-wrap: break-word;
    border: #44AADD solid 1px;
    padding: 0.5em 3.5em;
}

#contents .go_message {
    width: 100%;
    text-align: right;
    color:#008;
    font-size: 0.9em;
}

#contents .messages_top {
    padding-top: 2.5em;
}

#contents .message_body {
    padding: 0 0.8em;
}

#contents .into_logo {
    padding-right: 0.6em;
    float:left;
}

#contents .message .info_title, #contents .messages .info_title {
    font-size: 1.5em;
    border-bottom: 2px solid #9AF;
    margin-bottom: 0.7em;
    padding: 0.3em 0;
}

.info_title_block{
	margin:0 0 0 60px;
}

#bottom_link {
    height:3.0em;
    position: absolute;
    bottom: 0;
    top:auto;
    width: 100%
}

#bottom_link_center {
    float:left;
    border-right: 1px solid #444;
    border-left: 1px solid #444;
    box-sizing: border-box;
    width: 5.0em;
    text-align: center;
    height: 1.5em;
    padding-top: 0.2em;
}

#bottom_link_left, #bottom_link_right {
    height: 1.5em;
    float:left;
    box-sizing: border-box;
    width: 18.2em;
    text-align: right;
    padding: 0.2em 0.8em 0 0.8em;
}

#bottom_link_right {
    text-align: left;
}

#top_info {
    width: 90.0em;
    height: 1.6em;
    padding: 3.2em 5.0em;
    overflow: hidden;
}

#top_info .font_size16 .color_gblue {
    display: inline-block;
    margin-right: 1.2em;
}

#new_products {
    width: 90.0em;
    padding: 3.2em 5.0em 7.0em 5.0em;
    background-color: #F2F2F2;
}

.new_product {
    height: 8.0em;
    padding: 0;
    border-bottom: solid 1px #141E32;
    cursor: pointer;
    transition: all .3s;
}

.new_product:hover {
    background-color: #DDD;
}

.content_first {
    margin-top: 2.4em;
    border-top: solid 1px #141E32;
}

.new_product .date {
    float:left;
    padding: 3.1em 0;
    height: 1.4em;
    width:11.0em;
}

.new_product .sat {
    float:left;
    padding: 1.3em 2.4em 1.3em 0.1em;
    height: 5.4em;
    width:12.5em;
}

.new_product .icon_sat {
    float:left;
    padding: 2.7em 1.0em 2.7em 0;
    height: 2.6em;
    width:2.6em;
}

.new_product .name_sat {
    float:left;
    padding: 2.8em 0;
    height: 2.4em;
    width:24.4em;
}

.new_product .sat_detail {
    float:left;
    padding: 3.1em 0;
    height: 1.4em;
    width: 20.0em;
}

.new_product .go {
    float:left;
    padding: 2.8em 3.3em 2.9em 3.2em;
    height: 2.3em;
    width:1.5em;
}

.new_product .dl {
    float:left;
    padding: 0;
    height: 8.0em;
    width:8.0em;
}

/** Contents(Right) Cases  ------------------------------*/
#cases {
    width: 90.0em;
    padding: 3.2em 5.0em 10.0em 5.0em;
    background-color: white;
}

.case {
    height: 20.0em;
    padding: 0;
    border-bottom: solid 1px #141E32;
    cursor: pointer;
    transition: all .3s;
}

.case:hover {
    background-color: #EEE;
}

.case .eyec {
    width: 20.0em;
    margin: 0 4.0em 0 0;
    float: left;
}

.case > div{
    float:left;
}

.case > img.go {
    padding: 8.8em 0 8.8em 8.4em;
    float:left;
}

.case .disc {
    margin: 3.0em 0 2.0em 0;
    height: 5.7em;
    width: 56.0em;
}

.prd_type {
    margin-bottom: 0.5em;
}

.prd_type img{
    vertical-align: middle;
    margin-right: 1.0em;
}

#go_allcase {
    width:20.0em;
    padding: 2.2em 35.0em;
    text-align: center;
    vertical-align: middle;
    display: table;
    border-bottom: solid 1px #141E32;
    cursor: pointer;
    transition: all .3s;
}

#go_allcase:hover {
    background-color: #EEE;
}

#go_allcase .font_size12, #go_allcase img {
    display: table-cell;
    vertical-align: middle;
    padding: 0 1.0em;
}

/*******************************************
 * for Tablet 
 *******************************************/

@media ( max-width: 1259px) and (min-width: 768px) {
    #right_menu {
        -ms-writing-mode: tb-lr; /*IE*/
        -o-writing-mode: vertical-lr; /*Opera*/
        -webkit-writing-mode: vertical-lr; /*Chrome, Safari*/
        writing-mode: vertical-lr; /*Firefox, Edge*/
        right: 0;
        width: 3em;
        min-height: 11em;
        z-index: 1;
    }

    #right_menu:hover {
        -ms-writing-mode: lr-tb; /*IE*/
        -o-writing-mode: horizontal-tb; /*Opera*/
        -webkit-writing-mode: horizontal-tb; /*Chrome, Safari*/
        writing-mode: horizontal-tb; /*Firefox, Edge*/
        width: 15em;
        min-height: 24.0em;
    }
    
    #contents #message_list {
        width: 100%;
    }
    
    #contents .monthes {
        max-width: 48em;
    }
    
    #contents .messages,
    #bottom_link_block {
        max-width: 48em;
        
    }
    
    #contents .message {
        padding: 2.5em 0 6.0em;
        margin: 0 2.5em;
        width: auto;
        max-width: 48em;
    }
    
}
/*******************************************
 * for Smartphone 
 *******************************************/

@media ( max-width:767px) {
    
    #contents #message_list {
        position: relative;
        width: auto;
    }
    
    #contents .monthes {
        padding: 2.5em 1.0em 1.0em 1.0em;
        position: relative;
    }
    
    #monthesbox{
        padding: 0.5em 1.0em;
    }
    
    #contents .messages,
    #bottom_link_block {
        padding: 0 1.0em 2.5em 1.0em;
        position: relative;
    }
    
    #contents .go_message {
        margin-top: 2.0em;
    }
    
    #right_menu {
        -ms-writing-mode: tb-lr; /*IE*/
        -o-writing-mode: vertical-lr; /*Opera*/
        -webkit-writing-mode: vertical-lr; /*Chrome, Safari*/
        writing-mode: vertical-lr; /*Firefox, Edge*/
        right: 0;
        width: 3em;
        min-height: 11em;
        z-index: 1;
    }
    
    #right_menu:hover {
        -ms-writing-mode: lr-tb; /*IE*/
        -o-writing-mode: horizontal-tb; /*Opera*/
        -webkit-writing-mode: horizontal-tb; /*Chrome, Safari*/
        writing-mode: horizontal-tb; /*Firefox, Edge*/
        width: 15em;
        min-height: 24.0em;
    }
    
    .entries {
        margin: 0;
    }
    
    .entries:hover {
        margin: 0 0 1.0em 0;
    }
    
    #contents .message {
        padding: 2.5em 1.0em 6.0em;
        width: auto;
    }

    #bottom_link {
        height:3.0em;
        position: absolute;
        bottom: 0;
        top:auto;
        left: 0;
        right:auto;
        margin: auto;
        width: 100%;
    }

    #bottom_link_center {
        float:left;
        border-right: 1px solid #444;
        border-left: 1px solid #444;
        box-sizing: border-box;
        width: 30%;
        text-align: center;
        height: 1.5em;
        padding-top: 0.2em;
    }

    #bottom_link_left, #bottom_link_right {
        height: 1.5em;
        float:left;
        box-sizing: border-box;
        width: 35%;
        text-align: right;
        padding: 0.2em 0.8em 0 0.8em;
    }

    #bottom_link_right {
        text-align: left;
    }
    
    .prd_type img{
        vertical-align: middle;
        margin-right: 0.3em;
    }
    
}