/*--------------------------------------
    Base
--------------------------------------*/
body { color; #666; }
h1 { margin: 0; }
ul { margin-bottom: 0; }
li { list-style: none; }
dd { margin: 0; }
dl { margin: 0; }
table,p { font-size: 13px; }

/* Frame
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#container { position: relative; }
#header { width: 100%; min-width: 1040px; background: #F2F2F2; border-bottom: 2px solid #B2B2B2; }
.column-left { float: left; position: relative; }
.column-right { float: right; }
#contents { min-width: 960px; }
#contents #sidebar { width: 220px; position: relative; }
#contents #main { margin-top: 20px; margin-left: 240px; margin-right: 20px; }
#footer { position: fixed; bottom: 0; left: 0; width: 100%; min-width: 960px; height: 40px; background: #F2F2F2; z-index: 9999; border-top: 2px solid #B2B2B2; }

/*--------------------------------------
    Header
--------------------------------------*/
#header .column-left { text-align: left; height: 45px; padding: 17px 15px 15px 15px; padding-right: 0; vertical-align: middle; display: table-cell; }
#header .column-left .hd-logo img { width: 100%; padding: 6px 0 0; }
#header .column-right { width: 45%; text-align: right; height: 45px; padding: 17px 15px 15px 15px; padding-left: 0; }
#header .column-right .submenu li { display: inline-block; }
#header .column-right .submenu li:last-child { margin-left: 10px; }
#header .column-right .submenu li:first-child { margin-left: 0; }
#header .column-right .name { font-size: 100%; }
#header .column-right .last-time { font-size: 80%; }

/*--------------------------------------
    Footer
--------------------------------------*/
#footer .floatleft { margin-left: 15px; }
#footer .floatright { margin-right: 15px; }
#footer .logo { line-height: 40px; margin-right: 10px; }
#footer .logo img { vertical-align: middle; }
#footer small { font-size: 13px; line-height: 40px; font-family: Arial; }
#footer .logo-img { margin: 5px 15px 5px 0; }
#footer .submenu li { float: right; margin-left: 15px; list-style: none; line-height: 40px; }
#footer .submenu li:before { content: "▶"; padding-right: 4px; font-size: 40%; }
#footer .submenu li a { font-size: 12px; color: #666; text-decoration: none; }
#page-top { position: fixed; bottom: 60px; right: 15px; font-size: 77%; }
#page-top a { display: table-cell; vertical-align: middle; text-decoration: none; color: #FFF; background: rgba(169,203,2,0.8) url(../wide_img/icon-arrow-pagetop.png) no-repeat 5px bottom; padding: 10px 0 10px 40px; font-size: 13px; text-align: center; display: block; border-radius: 2px; letter-spacing: 0.1em; font-size: 13px; width: 80px; text-align: left; }
.system-version { color: #999; }

/* Sidebar
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#sidebar .bg { position: absolute; top: 0; left: 0; border-right: 2px solid #B2B2B2; width: 218px; height: 100%; min-height: 900px; z-index: 0; }
#sidebar .menu { position: absolute; top: 0; left: 0; width: 220px; }
#sidebar ul { display: none; color: #7F7F7F; background: #FFF; margin-bottom: -5px; padding-bottom: 15px; }
#sidebar li { list-style: none; }
#sidebar li span { cursor: pointer; padding-left: 20px; background: #CCC; border-radius: 0 6px 6px 0; line-height: 40px; color: #808080; }
#sidebar ul > li { margin-bottom: 5px; font-size: 13px; }
#sidebar ul li ul li { background: #CCC; margin: 0 10px 0 20px; background: #DCEA9A; text-align: right; padding: 5px 10px; line-height: 1.2em; }
#sidebar ul li ul li.on { background: #EDF4CC; }
#sidebar ul li ul li a { display: block; color: #808080; text-decoration: none; font-size: 13px; letter-spacing: 0.01; }
#sidebar .category-top-link { cursor: pointer; display: block; line-height: 60px; border-top: 2px solid #B2B2B2; border-right: 2px solid #B2B2B2; background: #FFF; background-position: 14px center; background-repeat: no-repeat; position: relative; z-index: 9999; transition-duration:0.2s; padding-left: 55px; }
#sidebar .category-top { display: block; line-height: 60px; border-top: 2px solid #B2B2B2; border-right: 2px solid #B2B2B2; background: #f2f2f2; background-position: 14px center; background-repeat: no-repeat; position: relative; z-index: 9999; transition-duration:0.2s; }
#sidebar .category-top > a { padding-left: 55px; }
#sidebar .on.icon-arrow-right:after { margin: -3px 0 0 0; border-top: solid 2px #7F7F7F; border-right: solid 2px #7F7F7F; -webkit-transform: rotate(315deg); transform: rotate(315deg); }
#sidebar span.icon-arrow-right:after { display: block; content: ""; position: absolute; top: 50%; right: 15px; width: 8px; height: 8px; margin: -8px 0 0 0; border-top: solid 2px #7F7F7F; border-right: solid 2px #7F7F7F; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
#sidebar span a { cursor: pointer; display: block; color: #808080; text-decoration: none; }
#sidebar .on span a { color: #FFF; }
#sidebar .subcategory-top,#sidebar .link { line-height: 1em; padding-top: 5px; padding-bottom: 5px; border-radius: 0 4px 4px 0; background: #CCC; display: block; position: relative; }
#sidebar .on.category-top { color: #A9CB02; border-right: 2px solid #FFF; border-bottom: 2px solid #FFF; background-color: #FFF; }
#sidebar .on .subcategory-top:after { margin: -3px 0 0 0; border-top: solid 2px #FFF; border-right: solid 2px #FFF; -webkit-transform: rotate(315deg); transform: rotate(315deg); }
#sidebar .on-other .subcategory-top:after { margin: -3px 0 0 0; -webkit-transform: rotate(315deg); transform: rotate(315deg); }
#sidebar .on .subcategory-top { background: #A9CB02; color: #FFF; }
#sidebar .on-other .subcategory-top {  }
#sidebar .sidebar-menu-home { background-image: url(../wide_img/sidebar-menu-home-off.png); border-top: none; }
#sidebar .sidebar-menu-home.on { background-image: url(../wide_img/sidebar-menu-home-on.png); }
#sidebar .sidebar-menu-user { background-image: url(../wide_img/sidebar-menu-user-off.png); }
#sidebar .sidebar-menu-user.on { background-image: url(../wide_img/sidebar-menu-user-on.png); }
#sidebar .sidebar-menu-device { background-image: url(../wide_img/sidebar-menu-device-off.png); }
#sidebar .sidebar-menu-device.on { background-image: url(../wide_img/sidebar-menu-device-on.png); }
#sidebar .sidebar-menu-profile { background-image: url(../wide_img/sidebar-menu-profile-off.png); }
#sidebar .sidebar-menu-profile.on { background-image: url(../wide_img/sidebar-menu-profile-on.png); }
/* #sidebar .sidebar-menu-apps { background-image: url(../wide_img/sidebar-menu-apps-off.png); } */
/* #sidebar .sidebar-menu-apps.on { background-image: url(../wide_img/sidebar-menu-apps-on.png); } */
#sidebar .sidebar-menu-operation { background-image: url(../wide_img/sidebar-menu-operation-off.png); }
#sidebar .sidebar-menu-operation.on { background-image: url(../wide_img/sidebar-menu-operation-on.png); }
#sidebar .sidebar-menu-agreement { background-image: url(../wide_img/sidebar-menu-agreement-off.png); border-bottom: 2px solid #B2B2B2; }
#sidebar .sidebar-menu-agreement.on { background-image: url(../wide_img/sidebar-menu-agreement-on.png); }
#sidebar .sidebar-menu-id { background-image: url(../wide_img/sidebar-menu-id-off.png); }
#sidebar .sidebar-menu-id.on { background-image: url(../wide_img/sidebar-menu-id-on.png); }
#sidebar .sidebar-menu-entry { background-image: url(../wide_img/sidebar-menu-entry-off.png); }
#sidebar .sidebar-menu-entry.on { background-image: url(../wide_img/sidebar-menu-entry-on.png); }
#sidebar .sidebar-menu-system { background-image: url(../wide_img/sidebar-menu-system-off.png); border-bottom: 2px solid #B2B2B2; }
#sidebar .sidebar-menu-system.on { background-image: url(../wide_img/sidebar-menu-system-on.png); }
#sidebar .sidebar-banner:first-of-type { margin-top: 20px; }
#sidebar .sidebar-banner { text-align: center; margin-top: 10px; }
#sidebar .sidebar-banner-png { width: 180px; opacity: 1; vertical-align: bottom; }

/* Others
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/*--------------------------------------
    Contents
--------------------------------------*/
.container { min-width: 800px; }
.contents-headder { margin-bottom: 15px; width: 800px; box-sizing: border-box; }
.contents-headder .contents-title { height: 60px; border: 4px solid #D4E580; text-align: center; font-weight: bold; float: left; margin-right: 20px; }
.contents-headder .contents-title h1 { width: 180px; height: 60px; display: table-cell; vertical-align: middle; text-align: center; line-height: 1.2em; padding: 2px 10px 0; font-size: 16px; }
.contents-headder .contents-description { display: table-cell; vertical-align: middle; height: 60px; border: 4px solid #FFF; text-align: left; font-size: 13px; float: left; width: 550px; }
.contents-headder .contents-description div { height: 60px; display: table-cell; vertical-align: middle; }
.contents-main { width: 800px; box-sizing: border-box; }
#login { width: 900px; margin: 100px auto; padding-bottom: 50px; }
#login .logo { margin-bottom: 15px; }
#login .text { font-size: 16px; text-align: center; line-height: 1.5em; margin-bottom: 0; }
#login .table-cell { display: table-cell; vertical-align: middle; height: 330px; }
#login .form { background: #E5E5E5; width: 320px; padding: 20px; margin-bottom: 15px; }
#login .form input { background: #FFF; width: 100%; }
#login .form dl { margin-bottom: 20px; }
#login .form dl dt { font-weight: bold; font-size: 14px; width: 100%; font-weight: lighter; margin-bottom: 4px; }
#login .form dl dd { margin: 0 0 15px 0; width: 100%; }
#login .form .btn-login { width: 260px; margin: 0 auto 20px; display: block; }
#login .form .btn-login:hover { opacity: 0.95; }
#login .form ul { margin-bottom: 0; }
#login .form li { list-style: none; }
#login .form li:before { content: "▶"; padding-right: 4px; font-size: 40%; }
#login .form li a { font-size: 13px; color: #666; text-decoration: none; }
#login .form li a:hover { text-decoration: underline; }
#login .mac_form { width: 320px; padding: 20px; margin-bottom: 15px; }
#login .mac_form input { background: #FFF; width: 100%; }
#login .mac_form th,#login .mac_form td { border-bottom: none; }
#login .mac_form dl { margin-bottom: 20px; }
#login .mac_form dl dt { font-weight: bold; font-size: 14px; width: 100%; font-weight: lighter; margin-bottom: 4px; }
#login .mac_form dl dd { margin: 0 0 15px 0; width: 100%; }
#login .mac_form ul { margin-bottom: 0; }
#login .mac_form li { list-style: none; }
#login .mac_form li:before { content: "▶"; padding-right: 4px; font-size: 40%; }
#login .mac_form li a { font-size: 13px; color: #666; text-decoration: none; }
#login .mac_form li a:hover { text-decoration: underline; }
#contents .column-left { width: 230px;margin-right: -230px; }
#contents .column-right { width: 100%; padding-bottom: 150px; }
#contents .contents-main-border { border: 1px solid #B2B2B2; padding: 15px; margin-bottom: 15px; box-sizing: border-box; }
#contents .required { color: #C74F4F; vertical-align: super; }
#contents .table-header div { display: inline-block; }
#contents .table-header span { font-size: 13px; line-height: 30px; }
#contents .devicelist-searcharea { border: 1px solid #B2B2B2; padding: 15px; }
#contents .devicelist-searcharea .first-line { padding-bottom: 15px; }
#contents .devicelist-searcharea .second-line { border-bottom: 1px dotted #B2B2B2; padding: 0 0 15px; }
#contents .devicelist-searcharea .third-line { padding-top: 15px; }
#contents .devicelist-searcharea input[type="button"] { font-weight: lighter; }
#contents .devicelist-searcharea input[type="button"].active { background: #A9CB02; color: #FFF; border-color: #A9CB02; }
#contents .table-devicelist .status { text-align: center; min-width: 50px; }
#contents .table-devicelist th:not(.status) { min-width: 110px; }
#contents .table-devicelist th a { color: #7F7F7F; text-decoration: none; }
#contents .table-devicelist .arrow{ position: relative; display: inline-block; padding: 0 0 0 16px; color: #000; vertical-align: middle; text-decoration: none; font-size: 15px; margin-top: -3px; }
#contents .table-devicelist .arrow::before,
#contents .table-devicelist .arrow::after{ position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }
#contents .table-devicelist .arrow-square.up::before{ width: 12px; height: 12px; -webkit-border-radius: 25%; border-radius: 25%; background: #A9CB02; -webkit-transform: rotate(270deg); transform: rotate(270deg); }
#contents .table-devicelist .arrow-square.up::after{ top: -3.5px; left: 3px; box-sizing: border-box; width: 3px; height: 3px; border: 3px solid transparent; border-left: 3px solid #fff; -webkit-transform: rotate(270deg); transform: rotate(270deg); }
#contents .table-devicelist .arrow-square.down::before{ width: 12px; height: 12px; -webkit-border-radius: 25%; border-radius: 25%; background: #A9CB02; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
#contents .table-devicelist .arrow-square.down::after{ top: 3px; right: 2.5px; box-sizing: border-box; width: 3px; height: 3px; border: 3px solid transparent; border-left: 3px solid #fff; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
#contents .dashboard .topics dl { margin-bottom: 10px; position: relative; }
#contents .dashboard .topics dt,#contents .dashboard .topics dd { font-size: 13px; line-height: 1.2em; }
#contents .dashboard .topics dt { position: absolute; width: 90px; top: 0; left: 0; }
#contents .dashboard .topics dd { margin-left: 90px; }
#contents .dashboard .topics .new { color: #BD6363; margin-left: 5px; }
#contents .dashboard .otherstopics li { font-size: 13px; line-height: 1em; }
#contents .dashboard .otherstopics li.red { color: #BD6363; }
.situation ul.situation-tab { padding:0; height: 35px; margin-bottom: 0; position: relative; border-bottom: 4px solid #A9CB02; }
.situation ul.situation-tab li { list-style-type:none; height:34px; float:left; font-size: 12px; }
.situation ul.situation-tab li a { outline:none; display:block; line-height:34px; text-align:center; border-radius: 6px 6px 0 0; background: #FFF; border: 1px solid #B2B2B2; border-bottom: none; text-decoration: none; color: #666; }
.situation ul.situation-tab li a.selected { text-decoration:none; color:#FFF; cursor:default; background: #A9CB02; }
.situation .situation-panel { clear:both; border:1px solid #B2B2B2; border-top:none; padding: 15px; position: relative; }
.situation .situation-panel input.btn-update { position: absolute; right: 15px; top: 15px; background: #A9CB02; color: #FFF; border: 1px solid #A9CB02; }
.device ul.device-tab { padding:0; height: 35px; margin-bottom: 0; position: relative; border-bottom: 4px solid #A9CB02; }
.device ul.device-tab li { list-style-type:none; height:34px; float:left; font-size: 12px; }
.device ul.device-tab li a { outline:none; display:block; line-height:34px; text-align:center; border-radius: 6px 6px 0 0; background: #FFF; border: 1px solid #B2B2B2; border-bottom: none; text-decoration: none; color: #666; }
.device ul.device-tab li a.selected { text-decoration:none; color:#FFF; cursor:default; background: #A9CB02; }
.device ul.device-panel { clear:both; border:1px solid #B2B2B2; border-top:none; padding:0; }
.device ul.device-panel > li { list-style-type:none; padding:10px;  color:#333; }
.navigation-bar { min-width: 690px; }
.navigation-bar .navi { width: 100%; max-width: 240px; position: relative; float: left; }
.navigation-bar span { display: inline-block; border: 1px solid #B2B2B2; box-sizing: border-box; padding: 8px 0 5px 0; text-align: center; width: 100%; border-radius: 3px; }
.navigation-bar ul li.navi { display: table; }
.navigation-bar ul li.navi span { height: 55px; display: table-cell; vertical-align: middle; line-height: 1.2em; }
.navigation-bar .navigation-bar-arrow { width: 100%; max-width: 40px; height: 55px; position: relative; float: left; }
.navigation-bar .navigation-bar-arrow::after { content: "▶"; position: absolute; left: 50%; top: 50%; margin-top: -8px; margin-left: -7px; color: #B2B2B2; }
.navigation-bar li:last-child { padding-right: 0; }
.navigation-bar li:last-child span::after { display: none; }
.navigation-bar li.selected span { background: #DCEA9A; border: 1px solid #DCEA9A; }
.profile .navigation-bar .navi { width: calc((100% / 9) - 10px); position: relative; float: left; }
.profile .navigation-bar .navigation-bar-arrow { max-width: 25px; width: 3%; height: 55px; position: relative; float: left; }
.easy-setting .left-column { width: 20%; }
.easy-setting .left-column li { width: 100%; border: 1px solid #B2B2B2; border-right: none; border-radius: 6px 0 0 6px; margin-bottom: -1px; line-height: 50px; text-indent: 15px; position: relative; }
.easy-setting .left-column li a { display: block; text-align: left; color: #7F7F7F; text-decoration: none; position: relative; }
.easy-setting .left-column li a.selected { background: #A9CB02; color: #FFF; }
.easy-setting .left-column li.check a { background: url(../wide_img/icon-check-gray.png) no-repeat right 15px center; }
.easy-setting .left-column li.check a.selected { background: #A9CB02 url(../wide_img/icon-check-white.png) no-repeat right 15px center; color: #FFF; }
.easy-setting .right-column { width: 80%; }
.easy-setting .right-column .panel { border: 1px solid #B2B2B2; border-left: 4px solid #A9CB02; padding: 15px; min-height: 500px; }
.easy-setting .right-column .panel .title { font-size: 15px; font-weight: bold; margin-bottom: 10px; color: #A9CB02; line-height: 32px; }
.easy-setting .right-column .panel .no-set { min-height: 500px; height: 500px; }
.easy-setting .right-column .panel .no-set2 .title { font-size: 18px; }
.easy-setting .right-column .panel .no-set2 .title img { margin-top: -4px; }
.easy-setting .right-column .panel .btn-close { line-height: 30px; width: 30px; border: 1px solid #7F7F7F; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; color: #FFF; background: #7F7F7F; border-radius: 3px; }
.easy-setting.ios { display: flex !important; margin-bottom: 50px !important; }
.easy-setting.ios .right-column>.panel { height: 100%; }
.easy-setting.ios .right-column>.panel>div[id*=set] { height: 100% !important; }
.security-policy .table-tate th,.confirm-contract-information .table-tate th { width: 200px; }
#agent-software-download { width: 960px; margin: 20px auto; padding-bottom: 100px; }
#agent-software-download td { text-align: center; }
#agent-software-download th,#agent-software-download td { width: 33%; }
.profile-management .list { padding: 12px 15px; background: #FFF; border-radius: 3px; border: 1px solid #B5B5B5; margin-bottom: 15px; }
.profile-management .list li { background: url(../wide_img/icon-arrow-lightgreen.png) no-repeat left center; padding-left: 35px; line-height: 2.4em; font-size: 13px; }
.circle-graph-area { position: relative; margin: -65px 0 0; }
.justgage { max-width: 170px; width: 100%; margin: 0 auto; height: 200px; }
.circle-graph-area .icon-device { width: 100%; text-align: center; margin-top: -90px; }
.circle-graph-area .data { width: 100%;  }
.circle-graph-area .data div { text-align: center; border-bottom: 1px solid #E1E1E1; margin: 0 10px; padding-bottom: 10px; }
.circle-graph-area .data dt { font-size: 14px; display: inline-block; /* min-width: 50px; */ width: 100%; }
.circle-graph-area .data dd { font-size: 10px; display: inline; }
.circle-graph-area .data dd .numd-large { font-size: 28px; }
.no-agreement { line-height: 42px; font-size: 14px; }
.circle-graph-area2 { position: relative; margin-bottom: 15px; }
.circle-graph-area2 .icon-device { position: absolute; top: 50%; left: 50%; width: 120px; margin: -57px 0 0 -59px; z-index: 1; }
.circle-graph-area2 .icon-device img { width: 100%; }
.circle-graph-area2 .device-type { position: absolute; bottom: 34px; text-align: center; width: 30px; left: 50%; width: 100px; margin: 0 0 0 -48px; z-index: 100; font-size: 14px; }
.circle-graph-area2 .data { margin: 0 10px; }
.circle-graph-area2 .data table { max-width: 260px; width: 100%; margin: 0 auto; }
.circle-graph-area2 .data table td { padding: 6px 0; }
.circle-graph-area2 .data table tr:first-child td { padding-top: 0; }
.circle-graph-area2 .data dl { display: table; width: 100%; }
.circle-graph-area2 .data dt { display: table-cell; width: 60%; padding-top: 12px; padding-bottom: 10px; vertical-align: middle; font-size: 13px; line-height: 1.2em; word-wrap: break-word; }
.circle-graph-area2 .data .icon-circle::before { margin-top: -9px; }
.circle-graph-area2 .data dd { display: table-cell; min-height: 24px; width: 40%; vertical-align: middle; font-size: 12px; text-align: right; padding-top: 4px; }
.circle-graph-area2 .data .line3 { padding-top: 3px; padding-bottom: 0; margin: 0 0; }
.circle-graph-area2 .data dd span { font-size: 28px; line-height: 24px; }
.profile-status-summary .status li { float: left; margin-right: 15px; font-size: 12px; line-height: 24px; }
.profilesamary-table .statusbar .complete { background: #9FD1DB; }
.profilesamary-table .statusbar .applying { background: #F4DB63; }
.profilesamary-table .statusbar .statusbar-error { background: #BD6363; }
.profilesamary-table .statusbar span { display: inline-block; float: left; text-align: center; color: #FFF; font-size: 12px; line-height: 20px; }
.profilesamary-table .statusbar .column-1 { width: 20%; }
.profilesamary-table .statusbar .column-2 { width: 40%; }
.profilesamary-table .statusbar .column-3 { width: 60%; }
.profilesamary-table .statusbar .column-4 { width: 80%; }
.profilesamary-table .statusbar .column-5 { width: 100%; }
.profilesamary-table .statusbar .column-50 { width: 50%; }
.profilesamary-table th,.profilesamary-table td { word-break: break-all; }
.profilesamary-table td:first-child { min-width: 120px; }
.lock-manage .status li { float: left; margin-right: 15px; font-size: 12px; line-height: 24px; }
.list-topics dl { margin-bottom: 15px; border-bottom: 1px dotted #CCC; padding-bottom: 10px; }
.list-topics dt,.list-topics dd { font-size: 13px; line-height: 1.2em; }
.list-topics dt { margin-bottom: 5px; font-weight: bold; }
.list-topics dd { line-height: 1.5em; }
.list-topics .new { color: #BD6363; margin-left: 5px; }
.profileconfigurator ul.vpn-tab { padding:0; height: 35px; margin-bottom: 0; position: relative; border-bottom: 4px solid #A9CB02; }
.profileconfigurator ul.vpn-tab li { list-style-type:none; height:34px; float:left; font-size: 12px; }
.profileconfigurator ul.vpn-tab li a { outline:none; display:block; line-height:34px; text-align:center; border-radius: 6px 6px 0 0; background: #FFF; border: 1px solid #B2B2B2; border-bottom: none; text-decoration: none; color: #666; }
.profileconfigurator ul.vpn-tab li a.selected { text-decoration:none; color:#FFF; cursor:default; background: #A9CB02; }


/*--------------------------------------
    Common
--------------------------------------*/
h3 { font-size: 14px; }
p { margin: 0; }
.floatleft { float: left; }
.floatright { float: right; }
.lineheight { line-height: 24px;}
.red { color: #BD6363; }
.bold { font-weight: bold; }
.lighter { font-weight: lighter !important; }
.left { text-align: left !important; }
.right { text-align: right !important; }
.center { text-align: center !important; }
.relative { position: relative; }
.fs-large { font-size: 120% !important; }
.fs-small { font-size: 90% !important; }
.error { margin-top: 10px; margin-bottom: 0;}
.attention { font-size: 12px; text-indent: -1em; padding-left: 1em; margin-bottom: 0; }
.border { border: 1px solid #B2B2B2; }
.border-bottom {border-bottom: 1px solid #CCC; }
.border-bottom-dotted {border-bottom: 1px dotted #CCC; }
.border-gray { border-color: #CCC; }
.pagination li { float:left; margin-left:5px; line-height:30px; vertical-align: middle; list-style: none; }
.pagination li a, .pagination li span { display:block; padding:0 8px; border-radius:3px; height:23px; line-height:25px; font-size: 13px; }
.pagination li a { color:#7F7F7F; text-decoration:none; border:1px solid #B2B2B2; background: #fefefe; }
.pagination li a:hover, .pagination li span { border:1px solid #A9CB02; color:#fff; background: #A9CB02; }
.pagination li.arrow a { line-height: 24px;}
#div_overlay { width: 100%; height: 120%; position: fixed; top: 0px; left: 0px; background-color: rgb(0, 0, 0); opacity: 0.5; z-index: 99999; visibility: visible; }
#popup { border: 4px solid #D4E580; min-width: 800px; border-radius: 4px; top: 50%; left: 50%; transform: translate(-50%,-50%); position: fixed; z-index: 999999; visibility: visible; background-color: rgb(255, 255, 255); }
.no-set { min-height: 350px; width: 100%; background: #F8F8F8; border: 1px solid #CCC; display: table; }
.no-set-container,.no-set2 { display: table-cell; vertical-align: middle; text-align: center; }
.list-tate li { padding-top: 3px; padding-bottom: 3px; line-height: 25px; }
.easy-setting .navigation-bar .navi { width: 228px; }
.sub { vertical-align: sub; font-size: 90%; margin-right: -10px; padding-left: 2px; }

/*--------------------------------------
    Link
--------------------------------------*/
a { color: #036EB7; }
a:hover { text-decoration: underline; }
a:hover img { opacity: 0.6; }

/*--------------------------------------
    Title
--------------------------------------*/
.title-corner { display: block; background: #7F7F7F; color: #FFF; font-size: 14px; padding: 10px 15px; line-height: 1.2em; border-radius: 3px; margin-bottom: 10px; }
.title-corner a { display: inline-block; color: #FFF; }
.title-bold { font-weight: bold; font-size: 16px; }
.title-corner2 { display: block; background: #b4c8ff; color: #FFF; font-size: 14px; padding: 10px 15px; line-height: 1.2em; border-radius: 3px; margin-bottom: 10px; }
.title-corner2 a { display: inline-block; }
.title-corner-arrow { height: 16px; margin-left: 5px; vertical-align: middle; margin-bottom: 2px; }

/*--------------------------------------
    Tabpanel
--------------------------------------*/
.bcdm-tab-box { min-width: 800px; max-width: 100%; }
.bcdm-tab-box ul.bcdm-tab li { min-width: 110px; }
.bcdm-tab-panel { clear:both; border:1px solid #B2B2B2; border-top:none; padding:0; padding:10px; }
.bcdm-tab-panel li { list-style-type:none; }
ul.bcdm-tab { padding:0; border-bottom: 3px solid #A9CB02; }
ul.bcdm-tab > li { list-style-type:none; height:40px; float:left; border: 1px solid #B2B2B2; box-sizing: border-box; border-radius: 6px 6px 0 0; }
ul.bcdm-tab > li a { outline:none; display: flex; height:40px; line-height: auto; text-align:center; font-size: 13px; text-decoration: none; color: #666; align-items: center; justify-content: center;}
ul.bcdm-tab > li a:hover,ul.bcdm-tab li a.selected { text-decoration:none; border-radius: 6px 6px 0 0; color:#333; cursor:default; background: #A9CB02; color: #FFF; }
ul.bcdm-tab > li a:hover img { opacity: 1; }
.bcdm-tab2-panel { clear:both; border:1px solid #B2B2B2; border-top:none; padding:0; padding:10px; }
.bcdm-tab2-panel li { list-style-type:none; }
ul.bcdm-tab2 { padding:0; border-bottom: 3px solid #A9CB02; }
ul.bcdm-tab2 li { list-style-type:none; height:40px; float:left; border: 1px solid #B2B2B2; box-sizing: border-box; border-radius: 6px 6px 0 0; }
ul.bcdm-tab2 li a { outline:none; display:block; height:40px; line-height: 40px; text-align:center; font-size: 13px; text-decoration: none; color: #666; }
ul.bcdm-tab2 li a:hover,ul.bcdm-tab2 li a.selected { text-decoration:none; border-radius: 6px 6px 0 0; color:#333; cursor:default; background: #A9CB02; color: #FFF; }

/*--------------------------------------
    List
--------------------------------------*/
.list { text-indent: -1em; padding-left: 1em; }
.list li { margin: 4px 0 4px 0 }
.list-checkbox .checkbox-parts { padding-left: 26px !important; }
.list-checkbox li img { vertical-align: middle; }
.list-attention li { font-size: 12px; text-indent: -1em; padding-left: 1em; margin-bottom: 0; }
.list-checkbox li { margin-bottom: 10px; }
.list-checkbox li img { vertical-align: middle; }
.list-circlearrow-green { padding: 12px 15px; background: #F8F8F8; border-radius: 3px; border: 1px solid #B5B5B5; margin-bottom: 15px; }
.list-circlearrow-green li { background: url(../wide_img/icon-arrow-lightgreen.png) no-repeat left center; padding-left: 25px; line-height: 2.4em; font-size: 13px; }
.list-float li { float: left; margin-right: 20px; padding: 3px 0; line-height: 25px;}
.list-float li .select-box01 { line-height: 20px; }

/*--------------------------------------
    Table
--------------------------------------*/
/* table-tate */
.table-tate { border-collapse: separate; border-spacing: 5px; width: 100%; box-sizing: border-box; margin: -5px; width: calc(100% + 10px); height: calc(100% + 10px); }
.table-tate th,.table-tate td { padding: 10px; font-size: 13px; word-break: break-all; }
.table-tate > tbody > tr > th { background: #E5E5E5; border: 1px solid #E5E5E5; font-weight: bold; color: #7F7F7F; width: 200px; }
.table-tate th { word-wrap:break-word;word-break:normal }
.table-tate img { vertical-align: bottom; }
.table-tate td { border: 1px solid #AFAFAF; color: #7F7F7F; word-wrap: break-word;word-break: break-all; }
.table-tate-th300px > tbody > tr > th { width: 300px; }
.table-tate-3r { border-collapse: separate; border-spacing: 5px; width: 100%; box-sizing: border-box; margin: -5px; width: calc(100% + 10px); height: calc(100% + 10px); }
/* .table-tate-3r th,.table-tate-3r td { padding: 10px; font-size: 13px; word-break: break-all; } */
.table-tate-3r th,.table-tate-3r td { padding: 10px; font-size: 13px; word-wrap:break-word; word-break:normal; }
.table-tate-3r th { background: #E5E5E5; border: 1px solid #E5E5E5; font-weight: bold; color: #7F7F7F; }
.table-tate-3r th:first-child { }
.table-tate-3r th:nth-child(2) { width: 200px; }
.table-tate-3r th img { vertical-align: bottom; }
.table-tate-3r td { border: 1px solid #AFAFAF; color: #7F7F7F; word-wrap: break-word;word-break: break-all; }
/* table-yoko */
.table-yoko { border-collapse: collapse; margin-right: 50px; width: 100%; box-sizing: border-box; }
.table-yoko th,.table-yoko td { padding: 10px; font-size: 13px; word-break: break-all; }
.table-yoko th { background: #E5E5E5; border: 1px solid #AFAFAF; text-align: center; font-weight: bold; color: #7F7F7F; word-break: keep-all; min-width: 100px; }
.table-yoko td { border: 1px solid #AFAFAF; word-wrap: break-word;word-break: break-all; }
.table-yoko th a { color: #7F7F7F; }
.table-yoko .arrow{ position: relative; display: inline-block; padding: 0 0 0 16px; color: #000; vertical-align: middle; text-decoration: none; font-size: 15px; margin-top: -3px; }
.table-yoko .arrow::before,
.table-yoko .arrow::after{ position: absolute; top: 0; bottom: 0; left: 0; margin: auto; content: ""; vertical-align: middle; }
.table-yoko .arrow-square.up::before{ width: 12px; height: 12px; -webkit-border-radius: 25%; border-radius: 25%; background: #A9CB02; -webkit-transform: rotate(270deg); transform: rotate(270deg); }
.table-yoko .arrow-square.up::after{ top: -3.5px; left: 3px; box-sizing: border-box; width: 3px; height: 3px; border: 3px solid transparent; border-left: 3px solid #fff; -webkit-transform: rotate(270deg); transform: rotate(270deg); }
.table-yoko .arrow-square.down::before{ width: 12px; height: 12px; -webkit-border-radius: 25%; border-radius: 25%; background: #A9CB02; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.table-yoko .arrow-square.down::after{ top: 3px; right: 4px; box-sizing: border-box; width: 3px; height: 3px; border: 3px solid transparent; border-left: 3px solid #fff; -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.table-yoko.center td { text-align: center; }
/* テーブル内フォームパーツ */
.table-yoko label.radiobtn { margin-right: 0 !important; }
.table-yoko label.radiobtn { padding: 0 !important; }
.table-yoko label.radiobtn:before { top: 50%; margin-top: -10px; left: 50%; margin-left: -10px; }
.table-yoko label.radiobtn:after { left: -4px !important; }
.table-yoko .checkbox-parts { padding: 0; width: 30px; height: 20px; display: block; }
.table-yoko .checkbox-parts::before { top: 50%; margin-top: -10px; left: 50%; margin-left: -9px; }
.table-yoko .checkbox-parts::after { left: 11px !important; }
/* table-yoko-ひとつめのセルが30px */
.table-yoko-fc-30px th:first-child{ min-width: 30px; width: 30px; }
.table-yoko-fc-30px td:first-child{ text-align: center; }
/* table-yoko-ふたつめのセルが30px */
.table-yoko-nth2-30px th:nth-child(2){ min-width: 30px; width: 30px; }
.table-yoko-nth2-30px td:nth-child(2){ text-align: center; }
/* table-yoko-みっつめのセルが30px */
.table-yoko-nth3-30px th:nth-child(3){ min-width: 30px; width: 30px; }
.table-yoko-nth3-30px td:nth-child(3){ text-align: center; }
/* table-yoko-よっつめのセルが30px */
.table-yoko-nth4-30px th:nth-child(4){ min-width: 30px; width: 30px; }
.table-yoko-nth4-30px td:nth-child(4){ text-align: center; }
/* table-yoko-最後のセルが30px */
.table-yoko-lcd-30px th:last-child{ min-width: 30px; width: 30px; }
.table-yoko-lcd-30px td:last-child{ text-align: center; }

/* table-tateyoko */
.table-tateyoko { border-collapse: separate; border-spacing: 5px; width: 100%; box-sizing: border-box; margin: -5px; width: calc(100% + 10px); height: calc(100% + 10px); }
.table-tateyoko th,.table-tateyoko td { padding: 10px; font-size: 13px; word-break: break-all; }
.table-tateyoko > tbody > tr > th { background: #E5E5E5; border: 1px solid #E5E5E5; font-weight: bold; color: #7F7F7F; }
.table-tateyoko tr:first-child th { min-width: 160px; }
.table-tateyoko tr th:first-child { width: 240px; }
.table-tateyoko th img { vertical-align: bottom; }
.table-tateyoko td { border: 1px solid #AFAFAF; color: #7F7F7F; word-wrap: break-word;word-break: break-all; }
/*--------------------------------------
    Icon
--------------------------------------*/
.icon-check { background: url(../wide_img/icon-check.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-question { background: url(../wide_img/icon-question.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-attention { background: url(../wide_img/icon-attention.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-safetynet { background: url(../wide_img/renew_icon_consistency_check.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-red { background: url(../wide_img/icon-circle-red.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-yellow { background: url(../wide_img/icon-circle-yellow.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-green { background: url(../wide_img/icon-circle-green.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-green2 { background: url(../wide_img/icon-circle-green2.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-blue { background: url(../wide_img/icon-circle-blue.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-blue2 { background: url(../wide_img/icon-circle-blue2.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon-blue3 { background: url(../wide_img/icon-circle-blue3.png) no-repeat left center; padding-left: 20px; background-size: 15px 15px; }
.icon { width: 25px; height: 25px; vertical-align: middle; }
.icon-large { width: 57px; height: 57px; vertical-align: middle; }
.icon-iosversion { height: 18px; }
/*.icon-help {display:inline-block; padding:0px 4px; border:1px solid #7F7F7F; cursor: help;}*/
.icon-help {display:inline-block; cursor: help; background-image: url(/wide_img/hatena_icon.png); background-size: contain; width: 18px; height: 18px; color: rgb(0,0,0,0);}

/*--------------------------------------
    Form & buttons
--------------------------------------*/
.btn-contentsfooter { margin-top: 15px; }
.btn-contentsfooter .floatleft input { margin-right: 10px; margin-bottom: 10px; }
.btn-contentsfooter .floatright { text-align: right;}
.btn-contentsfooter .floatright input { margin-left: 10px; margin-bottom: 10px; }
.btn-newregist { display: inline-block; padding-right: 10px; height: 36px; line-height: 36px; background: #f7aa6b url(../wide_img/icon-newregist.png) no-repeat; background-position: 7px 7px; display: inline-block; border-radius: 2px; text-indent: 30px; font-size: 14px; text-decoration: none; color: #FFF; margin-top: 1px; }
.btn-newregist:hover { text-decoration: none; }
.btn-handle { width: 25px; margin: 0 auto; display: table; height: 25px; vertical-align: middle; }
.btn-handle a { display: table-cell; height: 25px; vertical-align: middle; cursor: grab; }
.btn-handle a img { vertical-align: middle; }
.btn-accordion { display: block; background: #E5E5E5 !important; color: #FFF !important; border-radius: 4px; width: 30px; height: 30px; text-align: center; vertical-align: middle; line-height: 30px; font-size: 16px; text-decoration: none; }
.btn-accordion:hover { text-decoration: none !important; background: #A9CB02 !important; }
.btn-fileupload { display: inline-block; border-radius: 2px; border: 0; background: #FFF; cursor: pointer; box-sizing: border-box; }
.btn-fileupload input { width: 100%; border: 1px solid #CCC; background: #E5E5E5; font-size: 14px; border-radius: 3px; padding: 3px 0px 3px 3px; box-sizing: border-box; }
.relative .btn-change { position: absolute; height: 25px; right: 5px; top: 50%; margin-top: -12px; color: #7F7F7F !important; background: #FFF !important; border: none; }
.relative .btn-change input { color: #7F7F7F !important; background: #FFF !important; border: none; position: absolute; top: 0; right: 0; }
.btnset input { font-size: 13px; }
.btn-green { background: #AACC03 !important; color: #FFF; border-color: #AACC03; }
.btn-gray { background: #808080 !important; color: #FFF; border-color: #808080; }
.form-text { padding: 15px 0; }
input[type="text"],input[type="number"],input[type="password"],input[type="submit"],input[type="button"],button[type="button"] { height: 25px; }
input[type="text"],input[type="number"],input[type="password"],textarea { border: 1px solid #CCC; background: #FFF; font-size: 14px; border-radius: 3px; color: #666; padding: 0 6px; box-sizing: border-box; display: inline-block; }
input[type="submit"],input[type="button"],button[type="button"] { background: #FFF; border: 1px solid #CCC; text-align: center; font-weight: lighter; min-width: 90px; padding: 0 10px; display: inline-block; text-align: center; letter-spacing: .1rem; text-decoration: none; white-space: nowrap; border-radius: 2px; cursor: pointer; box-sizing: border-box; font-size: 12px; }
input[type="radio"]{ display: none; }
label.radiobtn{ display: inline-block; position: relative; cursor: pointer; padding: 2px 0 0 24px; border-radius: 3px; color: #3e4956; font-size: 13px; text-align: left; vertical-align: middle; background: #FFF; margin: 0 10px 0 0; color: #666; font-weight: lighter; }
label.radiobtn:last-child { margin-bottom: 0; }
label.radiobtn:before{ position: absolute; content: ""; top: 50%; left: 0; width: 16px; height: 16px; margin-top: -10px; background: #FFF; border: 2px solid #CCC; border-radius: 25%; }
input[type="radio"]:checked + label.radiobtn:before { background: #FFF; border: 2px solid #A9CB02; }
input[type="radio"]:checked + label.radiobtn:after { position: absolute; content: ""; top: 50%; left: 6px; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: #A9CB02; }
input[type="submit"].btn-gray,input[type="button"].btn-gray { background: #7F7F7F; color: #FFF; border-color: #7F7F7F; }
select { background: #FFF; border-radius: 2px; font-size: 13px; }
button { border: none; }
.checkbox-input{ display: none; }
.checkbox-parts{ padding-left: 22px; position:relative; }
.checkbox-parts .icon { padding: 0 0 0 2px; margin-top: -3px; }
label.checkbox { padding: 10px 0; margin-bottom: 5px; font-size: 13px; color: #666; }
label.checkbox:last-child { margin-bottom: 0; }
.checkbox-parts::before{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 15px; height: 15px; border: 2px solid #CCC; border-radius: 3px; background: #FFF; }
.checkbox-input:checked + .checkbox-parts::before{ background: #A9CB02; border-color: #A9CB02; }
.checkbox-input:checked + .checkbox-parts::after{ content: ""; display: block; position: absolute; top: 1px; left: 5px; width: 6px; height: 10px; transform: rotate(40deg); border-bottom: 3px solid #FFF; border-right: 3px solid #FFF; }
.select-group { position: relative; display: inline-block; overflow: hidden; box-sizing: border-box; padding: 0; vertical-align: middle; border: 1px solid #B5B5B5; border-radius: 4px; background-color: #fff; background-repeat: no-repeat; }
.select { position: relative; z-index: 1; display: block; width: 90%; padding: 0; text-indent: 15px; border: none; border-radius: 0; background-color: transparent; background-image: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 13px; }
.select-group:after { display: block; content: ""; position: absolute; top: 50%; right: 15px; width: 8px; height: 8px; margin: -8px 0 0 0; border-top: solid 2px #7F7F7F; border-right: solid 2px #7F7F7F; -webkit-transform: rotate(135deg); transform: rotate(135deg); }
.radio-toggle { display: inline-block; vertical-align: bottom; }
.radio-toggle input { display: none; }
.radio-toggle label{ display: block; float: left; cursor: pointer; min-width: 50px; margin: 0; padding: 4px 10px; background: #FFF; color: #7F7F7F; font-size: 13px; text-align: center; transition: .2s; border: 1px solid #B2B2B2; }
.radio-toggle label:first-of-type{ border-radius: 3px 0 0 3px; }
.radio-toggle label:last-of-type{ border-radius: 0 3px 3px 0; }
.radio-toggle input[type="radio"]:checked + .switch-on { background-color: #A9CB02; border: 1px solid #A9CB02; color: #fff; }
.radio-toggle input[type="radio"]:checked + .switch-off { background-color: #A9CB02; border: 1px solid #a1b91d; color: #fff; }
.select-box01 select { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 24px; padding: 2px 30px 2px 5px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 1px solid #B2B2B2; background: #FFF url(../wide_img/icon-arrow-select.png) right 50% no-repeat; }
select::-ms-expand { display: none; }
/* disabled */
input[disabled],input[disabled]+label,.disabled,button[disabled],textarea[disabled] { opacity: 0.5; }
.disabled .checkbox-parts::before,label.disabled:before { opacity: 0.5; }
::-webkit-input-placeholder { color: #999 !important; font-size: 90%; }

/*--------------------------------------
    Padding
--------------------------------------*/
.pb5 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.p10 { padding: 10px; }
.p15 { padding: 15px; }
.pl20 { padding-left: 20px !important; }

/*--------------------------------------
    Margin
--------------------------------------*/
.mb0 { margin-bottom: 0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.ml5 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px;}
.ml20 { margin-left: 20px;}
.ml25 { margin-left: 25px; }
.ml30 { margin-left: 30px; }
.mr0 { margin-right: 0px !important; }
.mr5 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mt5 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }

/*--------------------------------------
    Width
--------------------------------------*/
.w10per { width: 10% !important; }
.w15per { width: 15% !important; }
.w20per { width: 20% !important; }
.w30per { width: 30% !important; }
.w50per { width: 50% !important; }
.w100per { width: 100% !important; }
.w30px { width: 30px !important; min-width: 30px !important; }
.w50px { width: 50px !important; min-width: 50px !important; }
.w80px { width: 80px !important; min-width: 80px !important; }
.w100px { width: 100px !important; min-width: 100px !important; }
.w140px { width: 140px !important; min-width: 140px !important; }
.w160px { width: 160px !important; min-width: 160px !important; }
.w180px { min-width: 180px !important; width: 180px !important; }
.w200px { width: 200px !important; min-width: 200px !important; }
.w300px { width: 300px !important; min-width: 300px !important; }
.mw200px { min-width: 200px !important; }
.mw250px { min-width: 250px !important; }
.mw500px { min-width: 500px !important; }
.mw600px { min-width: 600px !important; }
.mw800px { min-width: 800px !important; }
.mw1000px { min-width: 1000px !important; }
/*--------------------------------------
    height
--------------------------------------*/
.h65px { height: 65px !important; min-height: 65px !important;}

/*--------------------------------------
    clearfix
--------------------------------------*/
.clearfix:after { content: ""; display: block; clear: both; }
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */