﻿

/*** for PC Browser ***/
@media (min-width:401px)
{
#Header .contents_b
{
    display: flex;
}

#Header .logo {
    display: flex;
    height: auto;
    left: 0;
    position: relative;
    top: 0;
    width: auto;
    align-items: center;
    justify-content: left;
}

#over_view
{
    background: rgba(0, 0, 0, 0.7) url("../../../Images/background_stripe.png") repeat;
    position: fixed;
    display: none;
    top: 0;
    min-width: 1100px;
    width: 100%;
    z-index: 10000;
}

#over_view .B_GNavi
{
    margin: auto;
    position: relative;
    width: 1100px;
}

#over_view .B_GNavi .MenuListDiv ul
{
    background: #ffffff none repeat scroll 0 0;
    border-radius: 0;
    margin: 5px 0;
    padding: 0 10px 0 120px;
    position: relative;
    top: 0;
    width: 1080px;
}

#over_view .B_GNavi .MenuListDiv ul li a
{
    background: url("../../../Images/glnv_sep.png") no-repeat 0 4px;
    font-size: small;
    font-weight: normal;
    padding: 5px 10px 5px 15px;
}

#over_view .B_GNavi .MenuListDiv ul .firstnav a
{
    background: none;
}

#over_view .B_GNavi .MenuListDiv:before
{
    border-right: 2px solid #000000;
    content: "グローバルナビ";
    font-size: small;
    font-weight: bold;
    left: 10px;
    padding: 0 10px 0 0;
    position: absolute;
    top: 10px;
    z-index: 10000;
}

#over_view .GNaviFrame
{
    display: none;
}


#over_view .BreadCrumbs_Standard .ModuleReference
{
    margin: 0 auto 5px;
}

#over_view .BreadCrumbs_Standard .inside_b
{
    background: #ffffff;
}

#over_view .BreadCrumbs_Standard ol
{
    padding: 5px 10px 5px 110px;
}

#over_view .BreadCrumbs_Standard .inside_b li
{
    font-size: small;
}

#over_view .BreadCrumbs_Standard .bread a
{
    background: url("../../../Images/bread_sep.png") no-repeat right 0 !important;
    margin: 0;
    padding: 0 25px 0 0 !important;
}

#over_view .BreadCrumbs_Standard .p-right
{
    display: none;
}

#over_view .BreadCrumbs_Standard .inside_b:before
{
    border-right: 2px solid #000000;
    content: "現在の位置";
    font-weight: bold;
    left: 10px;
    padding: 0 10px 0 0;
    position: absolute;
    top: 6px;
    z-index: 10000;
}

.bk_off
{
}

#bookmark
{
    background: url("../../../Images/mypage.gif") no-repeat 5px center !important;
    border: 3px solid #E39643;
    box-shadow: 1px 1px 3px #888888;
    border-radius: 30px;
    box-sizing: border-box;
    padding: 5px 15px 3px 25px;
    color: #0084CC;
    font-weight: bold;
    cursor: pointer !important;
}

.bookmark_list
{
    text-align: center;
    left: 100px;
    top: 30px;
    background: #4DAADD;
    position: absolute;
    border: 1px solid #0086CE;
    padding: 5px;
    border-radius: 10px;
    color: #000000;
}

#FL .Flanguage
{
    margin: 3px;
}

.headbox {
    width: 100%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 300;
    position: relative;
    top: 0;
    background: #FFFFFF;
}

#Header {
    background: transparent;
    position: relative;
    width: 1100px;
    z-index: 1;
    display: inline-flex;
    margin: 0 auto;
}

.Support_Tool {
    background: transparent;
    padding: 5px 0;
    width: 100%;
    margin-left: auto;
    margin-bottom: 0;
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: right;
}

.support_box,
.search_box
{
    display: table;
    position: relative;
    margin: 3px;
    padding: 0;
    min-height: 50px;
    min-width: 70px;
    text-align: center;
    border-radius: 5px 5px;
}

.support_box:hover,
.search_box:hover,
.support_box:focus,
.search_box:focus
{
    box-shadow: 1px 1px 2px -1px #4d4d4d !important;
}

#support_menu,
#search_menu
{
    padding: 3px;
    display: table-cell;
    vertical-align: bottom;
    color: #FFFFFF;
    border-radius: 5px 5px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#support_menu
{
    background: url(../../../images/re2026/tool_w.png) no-repeat left 50% top 5px #007DB6;
}

#search_menu
{
    background: url(../../../images/re2026/search_w.png) no-repeat left 50% top 5px #007DB6;
}

#support_menu:hover,
#search_menu:hover
{
    cursor: pointer;
}

.support_b,
.search_b
{
    display: none;
    position: absolute;
    top: 50px;
    right: 0;
    z-index: 300;
    background: #CCEEFF;
    border: 5px solid #5EC1F1;
    border-radius: 8px 8px;
    padding: 5px;
    transition: max-height 0.5s ease-out, opacity 0.3s linear;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
}

.support_b > *,
.search_b > *
{
    padding: 5px;
    align-items: center;
    justify-content: center;
    font-size: 120%;
}

.support_b input,
.search_b input
{
    padding: 5px;
}

.Support_Tool ul.search_cat
{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.Support_Tool ul.search_cat li
{
    display: inline-table;
    margin: 0 auto 2%;
    padding: 0;
    width: 100%;
    max-width: 48%;
}

.Support_Tool ul.search_cat li a
{
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5% 1%;
}

.menu_on
{
    background-color: #343434 !important;
}

.box_on
{
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    max-height: 300px;
    opacity: 1;
}


/* ----------------------------------------------
 サポートツール
---------------------------------------------- */


.Support_Tool .tool_block
{
    margin-left: auto;
    position: relative;
    width: 100%;
}

.Support_Tool h2
{
    color: #000000;
    display: inline-block;
    font-size: small;
    font-weight: bold;
    margin: 0 0 5px;
    padding: 0;
    width: 40%;
}

#header_guide,
#furigana
{
    width: 100%;
}

.Support_Tool ul
{
    display: inline-flex;
    justify-content: space-around;
    list-style: none;
    margin: 0 0 5px;
    padding: 0;
    position: relative;
    vertical-align: middle;
    width: 60%;
    box-sizing: border-box;
}

.Support_Tool fieldset,
.Support_Tool ul.search_cat
{
    width: 100%;
    display: flex;
    justify-content: space-around;
    font-size: 100%;
}

.Support_Tool li
{
    display: inline-block;
    margin: 3px;
    padding: 0;
}

.Support_Tool a
{
    background-color: #ffffff;
    border-radius: 4px;
    display: inline-block;
    font-size: small;
    padding: 5px 10px;
    text-decoration: none;
}

.Support_Tool #sp_tool_l,
.Support_Tool #sp_tool_r,
#smart_mode_change,
#smart_mode_pagejump
{
    display: none;
}

#header_guide #ot
{
    display: none;
}

#fontsize #typical,
#fontsize #bigger
{
    display: inline-block !important;
    position: static;
    padding: 0;
    margin: 0;
}

#fontsize #typical
{
    left: 27px;
}

#fontsize #typical a,
#fontsize #bigger a
{
    text-decoration: none;
    width: 40px;
    text-align: left;
    margin: 0;
    padding: 0;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

#fontsize #typical a
{
    background: #FFFFFF;
    color: #343434;
    border: 1px solid #0088CC;
}

#fontsize #bigger a
{
    background: #007AC4;
    color: #ffffff;
}


#StyleChange li
{
    display: inline-block !important;
    position: static;
    padding: 0;
    margin: 0;
}

#StyleChange li a.sc_white,
#StyleChange li a.sc_black
{
    border: 1px solid #5E5E5E;
    border-radius: 5px;
    width: 24px;
    text-indent: 0px !important;
    margin: 0;
    padding: 3px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    box-sizing: border-box;
    text-decoration: none !important;
}

#StyleChange li a.sc_white
{
background: #FFFFFF;
color: #000000;
}

#StyleChange li a.sc_black
{
background: #000000;
color: #FFFFFF;
}

#furigana_anchor
{
    background: #ffffff;
    min-height: 17px;
    padding: 5px 10px;
    margin: 0;
    display: flex;
    align-items: center;
    text-decoration: none !important;
}
}


/*** for Smart Phone ***/
@media (max-width:400px)
{
#Header .contents_b
{
    display: flex;
}

#Header {
    height: 50px;
    padding: 0;
    margin: 0;
    border: none;
    display: block;
    position: relative;
    width: 320px;
    z-index: 1;
    justify-content: space-between;
    background: transparent;
    display: inline-flex;
}

#Header .logo
{
    display: inline-block;
    left: 10px;
    position: absolute;
    top: 10px;
}

#Header .logo a
{
    display: inline-block;
    left: 30px;
    position: absolute;
    top: 15px;
}

#Header .logo img
{
    width: 190px;
}


#Header .BrowserSearch
{
    background: rgba(0, 0, 0, 0) url("../../../Images/sp_menu2.png") no-repeat 0 -185px;
    height: 47px;
    position: absolute;
    top: 116px;
    width: 320px;
}


#Header .BrowserSearch .TextBox
{
    background-color: transparent !important;
    border: none !important;
    font-size: small;
    height: 23px;
    left: 40px;
    margin: 0;
    padding: 5px;
    position: relative;
    top: 7px;
    width: 177px;
}


#Header .BrowserSearch .SubmitBtn
{
    background: transparent !important;
    border: none !important;
    display: block;
    font-size: small;
    font-weight: bold;
    height: 31px;
    left: 232px;
    margin: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    top: 9px;
    width: 79px;
}


#Header .contents_b
{
    height: auto;
    margin: auto;
    padding: 0;
    width: 320px;
    position: relative;
}

#Header .logo {
    display: flex;
    height: auto;
    left: 0;
    position: relative;
    top: 0;
    width: auto;
    align-items: center;
    justify-content: left;
}

#Header .logo img
{
    vertical-align: bottom;
}

#Header .BrowserSearch
{
    bottom: 5px;
    position: absolute;
    right: 0;
}

#Header .BrowserSearch .TextBox
{
    background: rgba(1, 1, 1, 0.05) !important;
    border: 1px solid;
    margin: 0;
    padding: 5px;
}

#Header .BrowserSearch .SubmitBtn
{
    border: 1px solid #000000;
    margin: 0;
    padding: 5px 15px;
}

#over_view
{
    display: none;
}

.bk_off
{
}

#bookmark
{
    background: url("../../../Images/mypage.gif") no-repeat 5px center !important;
    border: 3px solid #E39643;
    box-shadow: 1px 1px 3px #888888;
    border-radius: 30px;
    box-sizing: border-box;
    padding: 5px 15px 3px 25px;
    color: #0084CC;
    font-weight: bold;
    cursor: pointer !important;
}

.bookmark_list
{
    text-align: center;
    left: 100px;
    top: 30px;
    background: #4DAADD;
    position: absolute;
    border: 1px solid #0086CE;
    padding: 5px;
    border-radius: 10px;
    color: #000000;
}

#FL .Flanguage
{
    margin: 3px;
}

.headbox {
    width: 320px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 300;
    position: fixed;
    top: 0;
    background: #FFFFFF;
}

#Header .logo img {
    width: 170px;
}

.support_box
{
    display: none !important;
}

.support_box,
.search_box
{
    display: table;
    position: relative;
    margin: 5px;
    padding: 0;
    min-height: 40px;
    min-width: 40px;
    text-align: center;
    border-radius: 5px 5px;
}

#support_menu,
#search_menu
{
    padding: 3px;
    display: table-cell;
    vertical-align: bottom;
    color: #FFFFFF;
    border-radius: 5px 5px;
    font-size: 7pt;
}

#support_menu
{
    background: url(../../../images/re2026/tool_w.png) no-repeat left 50% top 5px #343434;
}

#search_menu
{
    background: url(../../../images/re2026/search_w.png) no-repeat left 50% top 5px #343434;
}

.support_b,
.search_b
{
    display: none;
    position: absolute;
    top: 40px;
    right: 0;
    z-index: 300;
    background: #CCEEFF;
    border: 3px solid #5EC1F1;
    border-radius: 5px 5px;
    padding: 5px;
    width: 310px;
    box-sizing: border-box;
    line-height: 1.5;
    transition: max-height 0.5s ease-out, opacity 0.3s linear;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
}

.support_b > *,
.search_b > *
{
    padding: 5px;
    align-items: center;
    justify-content: space-around;
    font-size: 120%;
    width: 100%;
    box-sizing: border-box;
    display: flex;
}

.support_b input,
.search_b input
{
    padding: 5px;
}

.menu_on
{
    background-color: #007DB6 !important;
}

.box_on
{
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    max-height: 300px;
    opacity: 1;
    font-size: 70%;
}

#keywordsh2,
#keywordsh3
{
    width: 200px;
}

.search_cat li
{
    padding: 3px;
}

.close_b1 {
    height: 60px;
    display: contents;
}

/* ----------------------------------------------
 サポートツール
---------------------------------------------- */
.Support_Tool
{
    height: 50px;
    margin: 0px;
    padding: 0;
    position: relative;
    display: block;
    width: auto;
    background: transparent;
    z-index: 2;
    align-items: center;
    justify-content: right;
}

.Support_Tool #sp_tool_l
{
    background: url("../../../Images/sp_config.png") no-repeat;
    background-size: 50px;
    height: 60px;
    width: 50px;
    position: absolute;
    top: 0;
    right: 50px;
    cursor: pointer;
    text-indent: -9999px;
    z-index: 10000;
}

.Support_Tool #sp_tool_r
{
    background: url("../../../Images/sp_menu.png") no-repeat;
    background-size: 50px;
    height: 60px;
    width: 50px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    text-indent: -9999px;
    z-index: 10000;
}

.sp_tool_l_on
{
    background: url("../../../Images/sp_tool_close.png") no-repeat !important;
    background-size: 50px !important;
    display: block !important;
}

.sp_tool_r_on
{
    background: url("../../../Images/sp_menu_close.png") no-repeat !important;
    background-size: 50px !important;
    display: block !important;
}

.Support_Tool h2
{
    display: none;
}

.Support_Tool ul
{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.Support_Tool fieldset,
.Support_Tool ul.search_cat
{
    width: 100%;
}

.Support_Tool li
{
    margin: 5px;
    padding: 5px;
    box-sizing: border-box;
    background: #ffffff;
    border-radius: 5px 5px;
    width: 45%;
}

#header_guide #en,
#header_guide #ch,
#header_guide #po,
#StyleChange,
#fontsize,
#furigana
{
    display: none;
}

#header_guide #ot
{
    background: url("../../../Images/sp_menu2.png") no-repeat 0 -139px;
    height: 46px;
    position: absolute;
    top: 70px;
    width: 186px;
}


#header_guide #ot a
{
    font-size: small;
    font-weight: bold;
    height: 24px;
    left: 10px;
    margin: 0;
    padding: 7px 10px 0 35px;
    position: absolute;
    text-decoration: none;
    top: 7px;
    width: 129px;
}

.Support_Tool .read_page
{
    background: url("../../../Images/sp_menu2.png") no-repeat -186px -139px;
    font-size: small;
    font-weight: bold;
    height: 32px;
    padding: 14px 10px 0 30px;
    position: absolute;
    right: 0;
    text-decoration: none;
    top: 70px;
    width: 94px;
}

#header_sub
{
    background: url("../../../Images/sp_menu2.png") no-repeat 0 -232px;
    height: 47px;
    position: absolute;
    top: 163px;
    width: 160px;
}

#header_sub li
{
}

#header_sub a
{
    display: block;
    font-size: small;
    font-weight: bold;
    height: 24px;
    left: 10px;
    padding: 8px 10px 0 40px;
    position: absolute;
    text-decoration: none;
    top: 8px;
    width: 98px;
}

#smart_mode_pagejump
{
    background: url("../../../Images/sp_menu2.png") no-repeat -160px -232px;
    height: 47px;
    left: 160px;
    position: absolute;
    top: 163px;
    width: 160px;
}

#smart_mode_pagejump a
{
    display: block;
    font-size: small;
    font-weight: bold;
    height: 25px;
    left: 2px;
    padding: 8px 10px 0 35px;
    position: absolute;
    text-decoration: none;
    top: 8px;
    width: 104px;
}

#smart_mode_change
{
    background: url("../../../Images/sp_menu2.png") no-repeat 0 -279px;
    height: 47px;
    position: absolute;
    top: 210px;
    width: 320px;
}

#smart_mode_change a
{
    font-size: small;
    font-weight: bold;
    height: 25px;
    left: 60px;
    padding: 7px 10px 0;
    position: absolute;
    text-align: center;
    text-decoration: none;
    top: 6px;
    width: 231px;
}
}
