@CHARSET "UTF-8";

.sp{
	display:none;
}
.pc{
	display:block;
}
/* body */
body {
  padding-top: 80px;
}
a {
	color: #2c68ff;
	text-decoration: underline;
}

/* 画面ヘッダー */
.header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1030;
  padding-right: 0;
  padding-left: 0;
  width: 970px;
  min-width: 970px;
  height: 50px;
  margin: 0px auto;
}

#common-button {
  height: 10px;
}

#secom-item {
  width: 970px;
  min-width: 970px;
  height: 240px;
  border-color: #55ffff;
  border-style: solid;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 3px;
  border-left-width: 0px;
  margin: 0px auto;
}

.contents {
  margin-top: 0px;
  padding-top: 30px;
  background-image: url(../image/top/bg.gif);
  background-position: center 0px;
  background-repeat: repeat-x;
}

/* 電子メールお知らせとは */
div.gaiyo {
  float: left;
  margin-left: 10px;
}
div.catch {
  padding: 0px;
/*  height: 380px; */
  height: 590px;
  width: 500px;
}

div.catch div {
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 0px;
  padding: 0px;
}

div.catch div font {
  font-size: 12pt;
}
div.catch div span{
  font-size: 12pt;
}

/* ログイン */
.login {
  text-align: center;
  width: 368px;
  margin: 0 auto;
  float: right;
}

/* [お客様IDをお忘れの場合]ボタン */
#msgIdBt {
  /*margin-left: 170px;*/
  text-align:right;
  vertical-align: bottom;
  cursor: pointer;
  color:#32529b;
  text-decoration:none;
  padding-right:15px;
}

/* [パスワードをお忘れの場合]ボタン */
#msgPwsBt {
  /*margin-left: 170px;*/
  text-align:right;
  vertical-align: bottom;
  cursor: pointer;
  color:#32529b;
  text-decoration:none;
  padding-right:15px;
}

/* ログインフォーム */
.login-form {
  padding-top: 7px;
  width: 338px;
  background-image: url(../image/top/tbl_loginS_m.png);
}

/* ログインフォームトップ画像(テスト) */
#imgLoginTop {
  margin-left: -30px;
  margin-bottom: -7px;
}

/* ログインフォームボトム画像(テスト) */
#imgLoginBot {
  margin-left: -30px;
}

#loginTable {
  width: 320px;
  margin: 0px auto 22px;
}

#loginTable td.text {
  width: 30%;
  font-size: 10pt;
}

#loginTable td.inputform {
  width: 70%;
}

/* ログインフォーム入力(パスワード表示チェックボックスを除く) */
.login-form input:not(.defaultInputStyle) {
  width: 160px;
}

/* パスワード表示行 */
.passwordDisplayTr td {
  padding-top: 0px;
}

/* ログインボタン装飾 */
#loginbutton {
  cursor: pointer;
}

/* パスワードをお忘れの方 */
.password-info {
  float: right;
  margin: 5px 65px 10px 0px;
}
/* ログインボタン*/
a#loginbutton{
	padding:0;
	margin:0 auto;
	position: relative;
	display: block;
	width: 96px;
	height: 28px;
  	border: 1px solid rgba(0,0,0,0.5);
	border-radius: 10px;
	background: -moz-radial-gradient(50% 80%, #00D1F2, #0055C1);
	background: -webkit-radial-gradient(50% 80%, #00D1F2, #0055C1);
	background: radial-gradient(50% 80%, #00D1F2, #0055C1);
	box-shadow: 0 2px 6px rgba(0,0,0,0.5);
	box-shadow: 0 2px 6px rgba(0,0,0,0.5),
		0 2px 10px rgba(0,100,255, 0.7);
}
a#loginbutton .glare {
	position: absolute;
	border-radius: 14px;
	width: 100%;
	height: 100%;
	/*background-image: -webkit-linear-gradient(top, rgba(250, 250, 255, 1) 0%, rgba(250, 250, 255, 0.7) 10%, rgba(250, 250, 255, 0) 100%);
	background-image: -moz-linear-gradient(top, rgba(250, 250, 255, 1) 0%, rgba(250, 250, 255, 0.7) 10%, rgba(250, 250, 255, 0) 100%);*/

	background: -moz-linear-gradient(top, rgba(250, 250, 255, 1) 0%, rgba(250, 250, 255, 0.7) 10%, rgba(250, 250, 255, 0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(250, 250, 255, 1) 0%, rgba(250, 250, 255, 0.7) 10%, rgba(250, 250, 255, 0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(250, 250, 255, 1) 0%, rgba(250, 250, 255, 0.7) 10%, rgba(250, 250, 255, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	z-index: 3;
	top: -6px;
	-moz-transform: scale(0.95, 0.6);
	-webkit-transform: scale(0.95, 0.6);
	transform: scale(0.95, 0.6);
}
a#loginbutton .text {
	display: block;
	color: rgba(255, 255, 255, 0.9);
	font-family: sans-serif;
	font-weight: 700;
	font-size: 14px;
	letter-spacing:-1px;
	text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5) ,
		0px 0px 4px rgba(255, 255, 255, 1);
	position: absolute;
	text-align: center;
	top: 5px;
	width: 96px;
	height: 28px;
	z-index: 1;
}


/* 体験コーナー(修正前) */
.trial-corner {
  width: 550px;
  height: 110px;
  background-color: #eeffee;
  float: left;
  border-style: solid;
  border-color: #9d9;
  border-width: 2px;
  margin-left: 10px;
  margin-top: 2.1em;
}

/* 体験コーナー(修正後) */
.trial-user {
  text-align: left;
  width: 338px;
  height: auto;
  margin-top: 20px;
  padding-bottom: 5px;
  background-color: #eeffee;
  border: solid #9d9 2px;
}

.trial-user:AFTER {
  content: '';
  display: block;
  clear: both;
}

/* 体験版画像エリア */
#trial-button {
  float: left;
  width: 45%;
  position: relative;
}
#trial-button a{
	text-decoration:none;
}

/* 体験版スタートボタン */
a#trialBt{
	border:solid 1px #a1a1a1;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f2eee5+0,ffffff+28,ffffff+54,e2dfd5+100 */
	background: #f2eee5; /* Old browsers */
	background: -moz-linear-gradient(top, #f2eee5 0%, #ffffff 28%, #ffffff 54%, #e2dfd5 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, #f2eee5 0%,#ffffff 28%,#ffffff 54%,#e2dfd5 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #f2eee5 0%,#ffffff 28%,#ffffff 54%,#e2dfd5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	box-shadow: 0 2px 3px rgba(0,0,0,0.2);
	color:#0d5505;
	font-size:14px;
	font-weight:bold;
	letter-spacing:-1px;
	text-align:center;
	width:105px;
	height:28px;
	line-height:28px;
	border-radius:5px;
	padding-left:7px;
	cursor: pointer;
	z-index: 1!important;
	display: block;
	position: absolute;
	top: 72px;
	left: 30px;
}

/* 体験版メッセージエリア */
#trial-info {
  width: 55%;
  float: left;
  margin-top: 10px;
  padding-right: 1%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 0.9em;
  color: #050;
  text-align: left;
}

/* リニューアルボタン */
/* .renewal {
  margin-top: 10px;
  text-align: left;

} */
/* .renewal a{
	width:341px;
	height:32px;
	line-height:32px;
	color:#fff;
	text-align:center;
	background:#0070cb;
	border-radius:5px;
	box-shadow: 0 2px 2px rgba(0,0,0,0.2);
	display:block;
	font-weight:bold;
	text-decoration:none;
} */

/* パソコン持っている人 */
#person {
  display: block;
  /* margin-top: 6px; */
  position: relative;
  top: 4px;
  /* height: 104px;
  width: auto; */
}

/* 体験スタートボタン */
#trialBt {
  display: block;
  position: absolute;
  top: 72px;
  left: 30px;
}

/* はがき画像 */
#trialMailImg {
  display: block;
  /* margin-top: -95px;
  margin-left: 107px; */
  position: absolute;
  top: 5px;
  left: 107px;
}

/* 新規ご登録 */
.regist-user {
  text-align: left;
  width: 338px;
/*  height: 160px; */
  height: 180px;
  background-color: #ffffff;
  border-style: solid;
  border-color: #ffaaaa;
  border-width: 2px;
  margin-top: 20px;
}

#registButton {
  margin-left: 55px;
  cursor: pointer;
}

/* 新規ご登録案内 */
#regist-info {
  width: 310px;
  margin: 10px auto;
}

/* お知らせエリア */
.information {
  width: 930px;
  margin: 0 auto;
}

/* お知らせ一覧 */
.information-info {
  height: 150px;
  overflow-y: scroll;
  border-style: solid;
  border-color: #404040;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 0px;
  border-right-width: 0px;
  display: block;
  word-break: normal;
  word-wrap: break-word;;
  text-overflow: ellipsis;
}

/* お知らせ日付 */
.date {
  margin-left: 10px;
  width: 100px;
  float: left;
}

/* お知らせ詳細 */
.message {
  margin-left: 40px;
  float: left;
  max-width: 750px;
  display: block;
  word-break: normal;
  word-wrap: break-word;
  text-overflow: ellipsis;
}

/* 質問一覧部分の設定 */
.question {
  margin: 10px 5px;
  padding: 10px;
}

/* 質問の表題 */
.question-title {
  font-weight: bold;
}

/* 質問リストの設定 */
.question-list {
  padding-left: 20px;
}

/* 回答一覧の設定 */
.answer-title {
  font-weight: bold;
  margin: 10px 5px;
  padding: 10px;
  border: grey 1px solid;
  font-size: 1em;
}

/* 回答の設定 */
.answer-list {
  margin-left: 25px;
  padding-left: 10px;
}

/* 回答の表題 */
#answer1,#answer2 {
  font-weight: bold;
}

/* 内容の配置 **/
.summary {
  padding-left: 10px;
}
/* 表題 */
.sub-title {
  font-weight: bold;
}

/* リスト */
.list {
  padding-left: 10px;
}

#header-border {
  display: block;
  margin: 15px auto;
}

.control-title-line-s {
  border-color: #f00;
  border-left-width: 10px;
}

div#common_error {
  width: 930px;
  margin: 10px auto;
  margin-bottom: 0px;
  padding: 10px 10px;
}

#h2_email_q {
  margin-top: 3px;
}

#h3_service_title {
  margin-left: 20px;
  margin-bottom: -1.4em;
}

#attention {
  width: 970px;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
}

/* 体験版ログインメッセージ */
.trialLoginMessage {
  color: #ff0000;
  font-size: 13px;
  text-align: left;
  margin-top: 10px;
  margin-left: 50px;
}

#introduction {
  margin-top:-24px;
}

#secom-item-space {
 margin-bottom:11em;
}

/* セコム商品のご案内 */
.categoryLinkAreaWrap{border:4px solid #e7e7e7;padding:1px;width:895px;margin:0 auto;}
.categoryLinkArea {
  width: 724px;
  margin: 25px auto 10px;
}
section.categoryLink {
  content: '';
  display: block;
  clear: both;
}
section.categoryLink #personal {
  float: left;
  width: 50%;
  padding-right: 5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
section.categoryLink #business {
  float: left;
  width: 50%;
  padding-left: 5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
section.categoryLink #personal .h2area {
  background: url(../image/top/bg_btn_personal.gif) top right no-repeat;
}
section.categoryLink #business .h2area {
  background: url(../image/top/bg_btn_business.gif) top left no-repeat;
}
section.categoryLink #personal .h2area div {
  margin: 0;
  padding-bottom: 7px;
  /* padding: 7px 0 0 128px; */
  font-size: 17px;
  position: relative;
  top: 7px;
  left: 128px;
}
section.categoryLink #business .h2area div {
  margin: 0;
  padding-bottom: 7px;
  /* padding: 7px 0 0 35px; */
  font-size: 17px;
   position: relative;
  top: 7px;
  left: 35px;
}
section.categoryLink #personal .h2area div a{color:#d2391f;font-weight:bold;text-decoration:none;}
section.categoryLink #business .h2area div a{color:#004696;font-weight:bold;text-decoration:none;}
section.categoryLink #personal .h2area div a:hover,section.categoryLink #business .h2area div a:hover{text-decoration:underline;}
section.categoryLink a:hover img{filter:alpha(opacity=80);-moz-opacity:.8;opacity:.8;}
img {border: none;}
section.categoryLink #personal .img-footer {
  position: absolute;
  left: 94px;
}

/* レスポンシブデザイン */
@media screen and (max-width: 767px) {
  /* 体験版タイトルメッセージ */
  #attention {
    width: auto;
    margin-top: 0;
  }
  /* 体験版ログインボタン上メッセージ */
  .aboveTrialBtn {
    margin-bottom: 10px
  }
  /* 体験版ログインメッセージ */
  .trialLoginMessage {
    width: auto;
    margin-left: 0;
    margin-bottom: 10px;
    text-align: center;
  }
  /* 入力フォーム幅 */
  #loginTable input.topcoat-text-input {
    width: 90%;
  }
}