@charset "utf-8";
/* css document */

/*注：ie6用にスターハック使ってるところはその他のブラウザ用にhtml>body付けてるところがあります*/

/* リセット＆調整　-----------------------------------------------*/
body, div, dl, dt, dd, ul, h1, h2, h3, h4, h5, h6, pre, form, fieldest, input, textarea, p, blockquote, th, td
{margin: 0; padding: 0; list-style: none;}
fieldset, img {border: 0;}
abbr, acronym {border: 0;}
address, caption, cite, code, dfn, em, strong, th, var
{font-style: normal; font-weight: normal;}
h1, h2, h3, h4, h5, h6 {font-size: 100%; font-weight: normal;}
h1 {display: none;}
.right {text-align: right;}
.center {text-align: center;}
.clear {clear: both;}
.clear:after {content: ""; clear: both; height: 0; display: block; visibility: hidden;}
strong {font-weight: normal;}
/*----------------------------------------------------------------*/

body {list-style: none; line-height: 1.6em; font-size: 13px; background-image: url(../image/top/bg.jpg); background-repeat: repeat-x; color: #404142;}

/* 画像位置中央 */
img.tel {vertical-align: middle;}
/*ie6*/* html img.tel {vertical-align: middle; margin-top: 2px;}
/* ie7 */*:first-child + html img.tel {vertical-align: middle;}

/* 右寄せ */
.right {text-align: right; clear: both;}

/* 注意書き */
.atten {font-size: 10px; line-height: 1.6em;}

/* 注意書き */
.atten_s {font-size: 9px; line-height: 1.6em; display: block;}

a:link {color: #00253C; text-decoration: none;}
a:active {color: #00253C;}
a:visited {color: #00253C; text-decoration: none;}
a:hover {color: #005964;}

/* 共通 ----------------------------------------------------------*/
#wrapper {width: auto; height: auto;}
#box {width: 850px; height: auto; background-color: #ffffff; margin-left: auto; margin-right: auto;}
#header {width: 850px; height: 34px; padding: 0;}
#header_l {width: 579px; height: 60px; float: left;}
#header_r {width: 271px; height: 35px; text-align: right; float: left; padding-top: 25px;}
/* トップメッセージ ----------------------------------------------*/
.mes {font-size: 14px; margin-left: auto; margin-right: auto; padding: 80px 120px 80px 120px;}
/*----------------------------------------------------------------*/
#main_img {width: 850px; height: auto;}
#main_txt {color: #ffffff; font-weight: bold; font-size: 14px; background-color: #000000; text-align: center;}
.disnone {display: none;}
.detail {width: 62px; height: 26px; display: block; margin-right: 40px; margin-bottom: 20px; text-align: left; color: #ffffff; letter-spacing: 0.4em;
         padding-left: 25px; padding-top: 5px; background-image: url(../image/watchguard/detail_go.gif); background-repeat: no-repeat;}
/* プルダウンメニュー --------------------------------------------*/
#menu {width: 850px; height: 70px;}
*+html body #menu {width: 852px; height: 70px;}
* html #menu {width: 850px; height: 70px; margin-top: 0px; margin-bottom: 12px;}
#menu ul {display: block; list-style-type: none; margin: 0; padding: 0; font-size: 12px;}
/* サブメニュー1段目 */#menu ul ul{display: none;  position: absolute; top: 100%; left: 0; line-height: 2.4em;}
/* サブメニュー2段目以降 */#menu ul ul ul {top: 0; left: 100%;}
/* リスト */#menu li {float: left; text-align: center;}
#menu li li {clear: both;}
#menu li a{display: block; width: 170px; background-color: #E6E6E6; text-decoration: none; color: #333; padding: 0;}
#menu li a.right{display: block; width: 170px; background-color: #E6E6E6; text-decoration: none; color: #333; padding: 0;}
* html #menu li a.right{display: block; width: 170px; background-color: #E6E6E6; text-decoration: none; color: #333; padding: 0; margin-left: -2px;}
#menu li a:hover {background-color: #BFC0C0;}
#menu li:hover {position: relative; background-color: #4b4f45; color: #333;}
#menu li:hover > ul {display: block;}
/* IE6用 */
* html #menu li {   behavior: expression(this.onmouseover=new Function("this.className='column1'"),      this.onmouseout=new Function("this.className=''"),      this.style.behavior = 'none'   );}
* html #menu li li {   behavior: expression(      this.onmouseover=new Function("this.className='column2'"),      this.onmouseout=new Function("this.className=''"),      this.style.behavior = 'none'   );}
* html #menu li li li {   behavior: expression(      this.onmouseover=new Function("this.className='column3'"),      this.onmouseout=new Function("this.className=''"),      this.style.behavior = 'none'   );}
#menu .column1 {position:relative;}
#menu .column1 ul {display: block;}
#menu .column1 * ul {display: none;}
#menu .column2 {position: relative;}
#menu .column2 ul {display: block;}
#menu .column2 * ul {display: none;}
#menu .column3 {position: relative;}
#menu .column3 ul {display: block;}
#menu .column3 * ul {display:none;}
/*----------------------------------------------------------------*/
.disnone {display: none;}
#contents {width: 850px; height: auto; margin: 10px 0px;}
.main_l {width: 558px; height: auto; float: left;}
.main_news {width: 550px; height: 220px; color: #ffffff; font-size: 14px; background-image: url(../image/top/cnt_bg.jpg); background-repeat: repeat-x;
            background-position: bottom; border: solid 1px #2d2d2d;}
.main_tit {width: 537px; height: 18px; font-size: 13px; color: #ffffff; padding-left: 15px; padding-top: 2px; margin-top: 6px; background-color: #595757;}
.main_bar {width: 530px; height: 26px; font-size: 13px; font-weight: bold; background-image: url(../image/top/main_bar.gif); background-repeat: no-repeat;
           background-color: #595757; padding-top: 6px; padding-left: 20px;}
.main_bar:hover {width: 530px; height: 26px; font-size: 13px; font-weight: bold; background-image: url(../image/top/main_bar1.gif); background-repeat: no-repeat;}           
.main_cnt {width: 530; height: auto; border: solid 1px #595757;}
.main_pr {width: 550px; height: auto;}
.product_bg {width: 552px; height: 160px; background-image: url(../image/top/product_bg.gif); background-repeat: repeat; margin-top: 6px;}
.detail_bg {width: 134px; height: 74px; text-align: center; background-image: url(../image/top/detail_bg.png); background-repeat: no-repeat; float: left; margin: 4px 0 0 3px;}
.detail2_bg {width: 273px; height: 44px; line-height: 1.2em; text-align: center;
             background-image: url(../image/top/detail2_bg.png); background-repeat: no-repeat; float: left; padding-top: 30px; margin: 4px 0 0 3px;}
.top_r {width: 290px; height: auto; float: right;}
.top_li img {border: solid 1px #9FA0A0; margin-bottom: 1px;}
/* 変更後バナー  -------------------------------------------------*/
.top_banner {width: 289px; height: 60px; border: solid 1px #9FA0A0; background-image: url(../image/top/banner_bg.gif); background-repeat: no-repeat; margin-bottom: 1px;}
.banner_txt {width: 180px; height: 46px; color: #ffffff; line-height: 1.2em; padding: 7px 0 3px 3px; float: left;}
* html .banner_txt {width: 170px; height: 46px; line-height: 1.2em; padding: 7px 0 3px 3px; float: left;}
.banner_img {width: 100px; height: 60px; float: left;}
/*----------------------------------------------------------------*/
.top_rtit {width: 286px; height: 23px; font-weight: bold; color: #ffffff; background-image: url(../image/top/top_sl.jpg); background-repeat: no-repeat; text-align: center; padding-top: 4px;}
.top_rcnt {width: 270px; padding: 7px; border: solid 1px #C8161E;}
.top_rcnt1 {width: 272px; padding: 7px;}
.top_rcnt img {border-bottom: solid 4px #666666; border-right: solid 4px #666666; border-left: solid 1px #666666; border-top: solid 1px #666666; margin-bottom: 2px;}
.top_rcnt1 img {border: solid 1px #666666; margin-bottom: 2px;}
.right_tit {width: 176px; height: 18px; color: #ffffff; text-align: center; padding-top: 12px; margin-bottom: 20px;}
.main_r img {border: solid 1px #2d2d2d;}
.info_tit {width: auto; height: 24px; padding-left: 30px; padding-top: 3px; background-image: url(../image/top/info_bg.jpg); background-repeat: no-repeat;}
.banner_box {width: 289px; height: auto; text-align: center; border: solid 1px #A40000; margin-top: 5px;}
.banner_box img {margin-top: 2px; padding: 1px;}
.banner_tit {color: #ffffff; font-weight: bold; text-align: center; background-image: url(../image/top/banner_tit_bg.gif); background-repeat: no-repeat;}
.sub_box {width: 850px;}
/* SSL VPNバージョン情報  ----------------------------------------*/
.vpn_box {width: auto; height: 50px; padding: 10px; border: solid 1px #C8161E; margin-bottom: -20px;}
/* インフォメーション --------------------------------------------*/
.news {height: 30px; padding: 10px 20px; font-size: 0.9em; color: #000000;}
* html .news {height: 30px; padding: 10px 20px; font-size: 0.9em; color: #000000; margin-bottom: -60px;}
.news_tit {width: 440px; color: #ffffff; background-color: #014C7A; font-size: 14px; margin-top: 4px; padding: 2px 0px 2px 4px; margin-bottom: 15px;}
/* 共通のサブ特徴-------------------------------------------------*/
ul.sub_feature ul {width: 850px; background-color: #000000;}
ul.sub_feature li {width: 210px; height: 40px; color: #ffffff; font-weight: bold; font-size: 11px; text-align: center; border-right: dotted 1px #d3d3d3;
                   padding-top: 20px; background-color: #000000; float: left;}
/* 最新ファームウェア情報  ---------------------------------------*/
.os {width: auto; padding: 20px; color: #000000; font-size: 0.8em; line-height: 1.1em;}
.os_box {width: auto; padding: 10px; border: solid 1px #C8161E;}
.box {width: auto; height: 80px;}
.box1 {width: auto; height: 65px;}
.os_tit {width: 450px; color: #C8161E; font-weight: bold; border-bottom: dotted 1px #C8161E; margin: 5px 0;}
.small {width: 440px; height: auto; font-size: 0.8em; border-bottom: dotted 1px #d3d3d3; line-height: 1.4em; margin-bottom: 8px;}
.imgbox {width: 785px; height: auto; padding-top: 10px; margin-bottom: 10px; border-top: solid 2px #014C7A;}
.cont_box {width: 183px; height: auto; float: left; margin-right: 15px; border: solid 1px #d3d3d3; padding: 0px;}
.cont_box:hover {width: 183px; height: auto; float: left; margin-right: 15px; border: solid 1px #014C7A; padding: 0px;}
.in_box {width: 183px; height: 72px;}
.txt_box {width: 179px; height: auto; border-top: solid 2px #d3d3d3; padding: 2px; font-size: 0.6em;}
.strong {height: 15px; color: #014C7A; font-size: 0.9em; background-image: url(../image/top/under_arrow.gif); background-repeat: no-repeat;
         padding-left: 20px; padding-top: 2px; margin-bottom: 3px;}     
/* フッター  -----------------------------------------------------*/          
.pro_txt {text-align: center; font-size: 9px;}
.pro_txt a {color: #ffffff;}
#footer {width: 850px; height: auto; color: #ffffff; text-align: center; font-size: 0.8em; padding-top: 10px;}
#footer_r {width: 850px; height: auto; color: #C8161E; text-align: right; font-size: 0.8em; margin-top: 20px; border-bottom: solid 1px #C8161E;}
#footer_sp {width: auto; height: auto; color: #C8161E; text-align: right; font-size: 0.8em; margin-top: 20px; border-bottom: solid 1px #C8161E;}
#footer_info {width: auto; height: 150px; background-color: #ED6C00; margin-top: 10px;}
#footer_in {width: 850px; height: auto; margin-left: auto; margin-right: auto;}
.footer_box {width: 132px; height: 40px; font-size: 0.9em; float: left; text-align: left; padding-left: 8px; margin-top: 20px; border-right: dotted 1px #ffffff;}
.footer_box ul {margin: 0px; padding: 0px; color: #ffffff;}
.footer_box ul li a {color: #ffffff;}
#f_top {width: auto; text-align: right; border-bottom: solid 1px #d3d3d3;}
#f_under {width: auto; text-align: right;}
/* 共通コンテンツ詳細 --------------------------------------------*/
.topbar {width: 824px; height: 27px; font-size: 16px; font-weight: bold; background-image: url('../image/contents/top_bar.gif'); background-repeat: no-repeat; 
         padding-left: 20px; padding-top: 8px;}
#ccont {width: 850px; margin-left: auto; margin-right: auto; margin-top: 3px; padding-top: 10px;}
.incont {width: 750px; padding: 20px 0 20px 60px; margin-top: 3px;}
.incont_t {width: 750px; padding: 20px 0 20px 60px; margin-top: 3px;}
* html .incont_t {width: auto; padding: 20px 0; margin-top: 3px;}
.jag_tit {width: 200px; height: 24px; background-image: url('../image/contents/jag_icon.gif'); background-repeat: no-repeat; padding-top: 4px; 
          padding-left: 33px; font-size: 14px; margin-bottom: 10px;}
.square_tit {width: 54px; height: 49px; text-align: center; color: #ffffff; background-image: url('../image/contents/square_icon.gif'); background-repeat: no-repeat;
          padding-top: 6px; padding-left: 1px; font-size: 13px; float: left;}
.strong_tit {width: 500px; height: 34px; color: #403900; font-size: 15px; font-weight: bold; padding-top: 15px; float: left; padding-left: 8px;}
table.func {width: auto; height: auto; margin-top: 20px; margin-left: 20px;}
table.func td {vertical-align: top;}
table.func td.txt {width: 40em; padding-top: 10px; padding-right: 10px; padding-left: 20px;}
table.func td img {border: solid 1px #d3d3d3; margin-top: 10px;}
table.func td.space {height: 10px;}
table.func td.func_tit {height: 10px; border-bottom: solid 1px #000000; font-size: 15px; font-weight: bold;}
.comp_l {width: 240px; height: auto; float: left;}
.comp_r {width: 486px; height: auto; font-size: 12px; float: left; margin-bottom: 50px; margin-left: 10px;}
.str {color: #403900; font-size: 12px; font-weight: bold;}
ol.wts li {width: 460px; margin-left: -25px;}
/*----------------------------------------------------------------*/

/* footer画像-----------------------------------------------------*/
.l_normal{float: left;}
.r_normal{float: left;}
.l_change{display: none;}
/*----------------------------------------------------------------*/

/* 製品仕様 ------------------------------------------------------*/
.incont_t {width: 850px; padding: 20px 0 20px 0; margin-top: 3px;}
table.kp_spec {border: solid 1px #666666; border-spacing: 0; border-collapse: collapse; font-size: 12px; 
               line-height: 1.3em; margin-top: -20px;}
table.kp_spec tr {border: solid 1px #666666;}
table.kp_spec tr.top {border: solid 1px #666666;}
table.kp_spec td {border: solid 1px #666666; padding: 5px;}
table.kp_spec td.l {width: 195px;}
table.kp_spec td.icolor {border: solid 1px #666666; background-color: #efefef; padding: 5px;}
/* 動作環境 ------------------------------------------------------*/
table.kp_env {border: solid 1px #666666; border-spacing: 0; border-collapse: collapse; font-size: 0.9em; 
              line-height: 1.3em; margin-top: 10px;}
table.kp_env tr {border: solid 1px #666666;}
table.kp_env tr.top {border: solid 1px #666666; background-color: #d3d3d3;}
table.kp_env td {border: solid 1px #666666; padding: 5px;}
/*----------------------------------------------------------------*/

/* テスト環境 ----------------------------------------------------*/
.entest {width: auto; height: 18px; font-size: 11px; padding: 2px; margin: 0 2px; text-align: center; border: solid 1px #666666;
         background-image: url(../image/contents/test_bg.gif); background-repeat: repeat-x; float: left;}
* html .entest {width: auto; font-size: 10px; margin: 0 2px; text-align: center; border: solid 1px #666666;
                float: left;}
/*----------------------------------------------------------------*/

/* 製品価格 ------------------------------------------------------*/
table.kp_pr {border: solid 1px #666666; border-spacing: 0; border-collapse: collapse; font-size: 12px; 
             line-height: 1.3em; margin-bottom: 5px; margin-top: -15px;}
table.kp_pr td {width: auto; height: 20px; line-height: 1.4em; padding: 10px; border: solid 1px #898989;}
table.kp_pr td.st {width: auto; height: 20px; line-height: 1.4em; padding: 10px; border: solid 1px #898989;
                   background-image: url(../image/contents/support_bg.gif); background-repeat: repeat-x;}
table.kp_pr td.p {width: auto; height: 20px; text-align: center; font-size: 14px; font-weight: bold; line-height: 1.4em; padding: 10px; border: solid 1px #898989;}
table.kp_pr td.pv {width: auto; height: 20px; text-align: center; font-size: 14px; font-weight: bold; line-height: 1.4em; padding: 10px; border: solid 1px #898989;
                   background-color: #FFFBC7;}
table.kp_pr td.vlm {width: auto; height: auto; background-color: #FFFBC7; line-height: 1.4em; padding: 10px; border: solid 1px #898989;}                        
table.kp_pr td.tit {width: 220px; height: 30px; color: #666666; font-weight: bold; text-align: center; padding: 0 0 0 0;
                    background-image: url(../image/contents/price_tit.gif); background-repeat: repeat-x;}                     
/* 機能一覧 ------------------------------------------------------*/
.fc_box {width: 240px; height: auto;  background-color: #DFDEDE; float: left; margin-left: 10px; margin-bottom: 10px;}
.fc_tit {width: 240px; height: 20px; color: #ffffff; text-align: center; background-color: #403900;
         background-image: url(../image/contents/fc_bar.gif); background-repeat: no-repeat;}
.fc_incont {height: 310px; padding: 7px 0px 7px 9px; font-size: 10px;}
.fc_incont1 {height: 210px; padding: 7px 0px 7px 9px; font-size: 10px;}
.vlm_cnt {width: 756px; height: 161px; background-image: url('../image/contents/vlm_bg.gif'); background-repeat: no-repeat; margin-left: 30px; margin-top: 20px; margin-bottom: 20px; padding: 0 15px 0 15px;}
.vlm_icon {width: 64px; height: 53px; float: left;}
.vlm_tit {width: 650px; height: 34px; float: left; font-size: 16px; font-weight: bold; padding-top: 19px; padding-left: 10px;}
.vlm_txt {width: auto; height: auto;}
/*----------------------------------------------------------------*/

/* faq -----------------------------------------------------------*/
.str_tit {width: 680px; font-size: 16px; font-weight: bold; color: #ffffff; background-color: #2d2d2d; padding: 5px;}
.mid_tit {width: 450px; font-size: 14px; font-weight: bold; border-left: solid 6px #000000; padding-left: 10px; margin-left: 5px; margin-top: 10px;}
.q_txt {width: 670px; font-size: 12px; margin-top: 5px; margin-left: 10px;}
.a_txt {width: 670px; font-size: 12px; border-top: solid 3px #6e6e6e; border-left: solid 6px #6e6e6e; margin-left: 10px; padding: 5px;}
.b_tit {width: 670px; font-size: 16px; font-weight: bold; margin-top: 20px;}
.disnone {display: none;}
.show {display: block; width: 670px; font-size: 12px; margin-top: 5px; margin-left: 10px;}
.show1 {display: block; width: 450px; font-size: 14px; font-weight: bold; border-left: solid 6px #000000; padding-left: 10px; margin-left: 5px; margin-top: 10px;}
/*----------------------------------------------------------------*/

/* お問い合わせ入り口 --------------------------------------------*/
div#common_box {width: 600px; height: 300px; overflow: auto; padding: 10px; margin: 20px 0px 20px 0px; border: solid 1px #999999; font-size: 0.9em;}
/*----------------------------------------------------------------*/ 
/* お問い合わせフォーム ------------------------------------------*/
#incont1 {width: 650px; background-color: #EFEFEF; padding: 20px 0px 0px 180px; margin-top: 3px;}
table.kp_form {border-spacing: 0; border-collapse: collapse; font-size: 0.9em; 
               line-height: 1.3em; margin-left: 280px; margin-top: 30px;}
table.kp_form td {padding: 5px; height: 60px;}
table.kp_form td.left {width: 120px; height: 60px; padding: 5px;}
/*----------------------------------------------------------------*/

/* ドキュメント --------------------------------------------------*/
table.doc {text-align: center; font-size: 11px;}
table.doc td.i {width: 200px;}
/*----------------------------------------------------------------*/

/* 記事　---------------------------------------------------------*/
.topic {width: 650px; font-size: 0.9em; margin-left: auto; margin-right: auto; margin-top: 20px; padding: 30px 50px; border: solid 1px #d3d3d3; background-color: #ffffff;}
.topic_title {text-align: center; font-size: 1.4em; font-weight: bold; margin: 20px 0;}
.topic_txt {width: 340px; float: left;}
.topic_img {width: 300px; margin-left: 10px; float: left;}
.topic_img img {border: solid 1px #000000;}
.topic_subtitle {font-weight: bold; border-bottom: solid 3px #000000;}
/*----------------------------------------------------------------*/