@charset "utf-8";

@import "normalize.css";

/* ===================================================

 01.BASE

 02.DESIGN STRUCTURE

 03.NAVIGATION

 04.LINKTEXT DECOTAIOTN
 
 05.DOCUMENT STRUCTURE

==================================================== */

/* 01 BASE
---------------------------------------------------- */

/*\*/ a { overflow:hidden; }/**/

/*html {
	filter: expression(document.execCommand("BackgroundImageCache", false, true));
}*/



.imgRight{
	float:right;
	margin-left:20px;
}

.imgLeft{
	float:left;
	margin-right:20px;
}

.imgCenter{
	text-align:center;
}

.textRight{
	text-align:right;
}

.imgArea{
	padding-left:20px;
}
.imgArea img{
	border:solid 1px #ccc;
}

.clear{ clear:both; height:1px; overflow: hidden; }

.clearfix{ /zoom : 1; }
.clearfix:after{ content : ''; display : block; clear : both; height:0; }


hr{
	margin-top:60px;
	border:none;
	clear:both; height:1px; overflow: hidden;
}

/* 02 DESIGN STRUCTURE
---------------------------------------------------- */

body{
	color:#333333;
	text-align:center;
	letter-spacing:0.03em;
}


.wrapper{
	width:1000px;
	margin:auto;
	text-align:left;
	
}

/* ヘッダー
------------------------------------*/

#headerArea{
	padding-bottom:30px;
}

#logoArea p{
	font-size:65%;
	margin-top:20px;
	font-weight:normal;
}

#logoArea p img{
	float:left;
	margin-right:20px;
}

/* パンクズ
------------------------------------*/

.breadArea{
	margin-top:10px;
	background-color:#f5f5f5;
	border-bottom:solid 1px #cbcbcb;
	border-top:solid 1px #cbcbcb;
	text-align:center;
	padding:5px 0;
}

.breadArea p{
	width:1000px;
	margin:auto;
	text-align:left;
}


/*メインエリア・サブエリア
------------------------------------*/	

#mainArea{
	width:720px;
	float:left;
	margin-top:40px;
}


#subArea{
	width:250px;
	float:right;
	margin-top:40px;
}



/* フッター
------------------------------------*/


#footerArea{
	background-color:#e0e0e0;
	margin-top:60px;
}

#footerLinkArea{
	width:1000px;
	margin:auto;
	text-align:left;
	padding-bottom:40px;
}

.link01 , .link02 , .link03{ float:left;}

.link01{ width:330px; }
.link02{ width:480px; margin-left:20px; }
.link03{ width:150px; margin-left:20px; }



#footerLinkArea p{ 
	padding-left:20px;
	background:url(../images/common/img_arrow01.png) no-repeat 0 0;
	padding-bottom:7px;
	border-bottom:solid 1px #c5c5c5;
	margin-top:20px;
	color:#d53400;
}

#footerLinkArea ul{
	float:left;
	margin-left:20px;
	margin-top:10px;
}

#footerLinkArea li{
	padding-left:15px;
	background:url(../images/common/img_arrow03.png) no-repeat 0 0.5em;
	margin-bottom:7px;
}	

#footerLinkArea .link03 ul{ float:none; }

#footerLinkArea a{ color:#d53400; text-decoration:none; }
#footerLinkArea li a{ color:#202020; text-decoration:none; }
#footerLinkArea li a:hover{ color:#d53400; text-decoration:none; }

#footer {
	padding:25px 0 30px 0;
	background-color:#000;
	color:#b1b1b1;
}

#footer .footerIn{
	width:1000px;
	margin:auto;
	text-align:left;
}
#footer .footerL {
	width:50%;
	float:left;
}
#footer .footerR {
	width:50%;
	float:right;
}

#footer p { margin-top:0; }
#footer p.footerLogo { float:left; }
#footer p.footerAddress {
	padding-left:60px;
}
#footer address{ float:left; font-size:75%; font-weight:normal; font-style:normal; margin-top:25px; }

#footer ul{ float:right; border-right: solid 1px #b1b1b1; }

#footer li{
	float:left;
	margin-right:20px;
	border-left: solid 1px #b1b1b1;
	padding-left:15px;
}	

#footer a{
	color:#b1b1b1;
}

#footer p.isms_rogo{
	float:right;
	margin-top:25px;
}
#footer p.isms_rogo img {
	width:auto;
	height:85px;
}


/* 03 NAVIGATION
---------------------------------------------------- */	

/* メインナビ
------------------------------------*/

#mainNaviArea ul{
	width:1000px;
	height:41px;
	margin:auto;
	text-align:left;
	background-color:#FFF;
	
}

#mainNaviArea li{ float:left; width:125px; height:41px; text-indent:-9999em;  position: relative;}
#mainNaviArea li a{ display:block; height:100%; }

li.navi-home a{ background:url(../images/common/mainNavi01_n.png) no-repeat 0 0; }
li.navi-feature a{ background:url(../images/common/mainNavi02_n.png) no-repeat 0 0; }
li.navi-spec a{ background:url(../images/common/mainNavi03_n.png) no-repeat 0 0; }
li.navi-option a{ background:url(../images/common/mainNavi04_n.png) no-repeat 0 0; }
li.navi-result a{ background:url(../images/common/mainNavi05_n.png) no-repeat 0 0; }
li.navi-support a{ background:url(../images/common/mainNavi06_n.png) no-repeat 0 0; }
li.navi-contact a{ background:url(../images/common/mainNavi07_n.png) no-repeat 0 0; }
li.navi-saas a{ background:url(../images/common/mainNavi08_n.png) no-repeat 0 0; }

li.navi-home a:hover{ background:url(../images/common/mainNavi01_r.png) no-repeat 0 0; }
li.navi-feature a:hover{ background:url(../images/common/mainNavi02_r.png) no-repeat 0 0; }
li.navi-spec a:hover{ background:url(../images/common/mainNavi03_r.png) no-repeat 0 0; }
li.navi-option a:hover{ background:url(../images/common/mainNavi04_r.png) no-repeat 0 0; }
li.navi-result a:hover{ background:url(../images/common/mainNavi05_r.png) no-repeat 0 0; }
li.navi-support a:hover{ background:url(../images/common/mainNavi06_r.png) no-repeat 0 0; }
li.navi-contact a:hover{ background:url(../images/common/mainNavi07_r.png) no-repeat 0 0; }
li.navi-saas a:hover{ background:url(../images/common/mainNavi08_r.png) no-repeat 0 0; }

body.home li.navi-home a{ background:url(../images/common/mainNavi01_r.png) no-repeat 0 0; }
body#feature li.navi-feature a{ background:url(../images/common/mainNavi02_r.png) no-repeat 0 0; }
body#spec li.navi-spec a{ background:url(../images/common/mainNavi03_r.png) no-repeat 0 0; }
body#option li.navi-option a{ background:url(../images/common/mainNavi04_r.png) no-repeat 0 0; }
body#result li.navi-result a{ background:url(../images/common/mainNavi05_r.png) no-repeat 0 0; }
body#support li.navi-support a{ background:url(../images/common/mainNavi06_r.png) no-repeat 0 0; }
body#contact li.navi-contact a{ background:url(../images/common/mainNavi07_r.png) no-repeat 0 0; }
body#saas li.navi-saas a{ background:url(../images/common/mainNavi08_r.png) no-repeat 0 0; }


/* サブナビ
------------------------------------*/

#subNaviList{
	border:solid 1px #d0d0d0;
	border-bottom:none;
	margin-bottom:30px;
}

#subNaviList dt{
	font-size:100%;
}

#subNaviList dt a{
	display:block;
	height:100%;
	background:url(../images/common/img_arrow01.png) no-repeat 10px 50% #ffefea;
	border-bottom:solid 1px #d0d0d0;
	text-align:center;
	padding:15px 0;
	margin-top:0;
	color:#333;
}

#subNaviList dt a:hover{
	text-decoration:none;
	background:url(../images/common/img_arrow01.png) no-repeat 10px 50% #fff9f7;
}


#subNaviList dd a{
	border-bottom:solid 1px #d0d0d0;
	background:url(../images/common/img_arrow02.png) no-repeat 10px 50%;
	padding:10px 5px 10px 30px;
	display:block;
	height:100%;
}

/* サブエリア
------------------------------------*/


.userArea{
	padding-bottom:30px;
	margin-bottom:10px;
}

.userArea p.userAreaTitle{
	margin-top:10px;
	text-align:center;
	padding:10px 0;
	margin-top:0;
	font-size:100%;
	color:#fff;
}

.userArea ul{
	margin-top:20px;
}

.userArea li{
	background:url(../images/common/img_arrow02.png) no-repeat 0 50%;
	padding-left:15px;
	margin:0 5px 5px 15px;
	
}

.userArea p{
	text-align:center;
}

.user01{ border:solid 1px #d53400;}
.user01 p.userAreaTitle{
	background-color:#d53400;
}

.user02{ border:solid 1px #1986ae;}
.user02 p.userAreaTitle{
	background-color:#1986ae;
}

.user03{ border:solid 1px #19ae86;}
.user03 p.userAreaTitle{
	background-color:#19ae86;
}


.bannerArea{
	margin-top:20px;
}

.bannerArea li{
	margin-bottom:5px;
}

.bannerArea img {
	width:100%;
}


/* 04 LINKTEXT DECOTAIOTN
---------------------------------------------------- */

a{ color:#1986ae; }
a:hover{ color:#1986ae; text-decoration:none;} 


#mainArea a:hover ,#subArea a:hover{
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}


#contentArea a.icon-pdf{ background: url(../images/common/icon_pdf.png) no-repeat 100% 50%; padding:3px 20px 3px 0; margin-right:3px;}




/* 共通リスト
------------------------------------*/

.commonUlList{ margin:20px 0 0 0; }
.commonUlList li{
	margin-left:20px;
	margin-bottom:7px;
	position: relative;
}
.commonUlList li li {
	font-size: 100%;
}
.commonUlList li::after {
	display: block;
	content: '';
	position: absolute;
	top: 9px;
	left: -1em;
	width: 5px;
	height: 5px;
	background-color: #b4c8e3;
	border-radius: 100%;
}



.normalUlList{ margin-top:10px; }
.normalUlList li{
	margin-left:20px;
	margin-top: 3px;
	position: relative;
}
.normalUlList li li {
	font-size: 100%;
}
.normalUlList li::after {
	display: block;
	content: '';
	position: absolute;
	top: 8px;
	left: -15px;
	width: 6px;
	height: 6px;
	background-color: #333;
	border-radius: 50%;
}


.commonOlList{ margin-top:20px; }
.commonOlList li{
	list-style-type:decimal;
	margin-left:25px;
	margin-bottom:5px;
}

.attentionList{ margin-top:20px;}

.attentionList li{
	text-indent:-1em;
	padding-left:1em;
	list-style-type:none;
	margin-bottom:5px;
}

.arrowList01 , .arrowList02 , .arrowList03 , .arrowList04{ margin-top:30px; }

.arrowList01 li{
	background:url(../images/common/img_arrow01.png) no-repeat 0 50%;
	padding-left:25px;
	margin-bottom:5px;
}

.arrowList02 li{
	background:url(../images/common/img_arrow02.png) no-repeat 0 50%;
	padding-left:15px;
	margin-bottom:5px;
}

.arrowList03 li{
	background:url(../images/common/img_arrow03.png) no-repeat 0 50%;
	padding-left:15px;
	margin-bottom:5px;
}

.attentionList02 li{
	text-indent:-2em;
	padding-left:2em;
	list-style-type:none;
}

.attentionList03 li{
	text-indent:-2.5em;
	padding-left:2.5em;
	list-style-type:none;
}


.attentionList04 li{
	text-indent:-3.2em;
	padding-left:3.2em;
	list-style-type:none;
}

table ul.commonUlList{ margin-top:5px;}
table li{
	font-size:inherit;
	font-size:100%;
}

/* 共通dl
------------------*/

.commonDl{
	margin-top:20px;
}

.commonDl dt{
	font-weight:bold;
	padding-top:10px;
	color:#0345a5;
}

.commonDl dd{
	margin-top:10px;
	padding-bottom:10px;
	padding-left:20px;
	background:url(../images/common/border_dotted_01.png) repeat-x 0 100%;
}




/* 共通テーブル 
------------------*/

.commonTable{
	width:100%;
	margin:30px 0 0 0;
	border-top:solid 1px #e6e6e6;
	background-color:#FFF;
}	

.commonTable th, .commonTable td{
	border-bottom:solid 1px #e6e6e6;
	padding:20px 15px;
	font-size:85%;
	font-weight:normal;
}

.commonTable td{
	background-color:#fff;
}

.commonTable th{
	text-align:left;
	font-weight:bold;
	background-color:#f3f3f3;
	padding:10px 15px;
}
.commonTable.priceTable th {
	text-align: center;
}



.commonTable02{
	width:100%;
	margin:30px 0 0 0;
	border:solid 1px #e6e6e6;
	border-collapse:collapse;
	background-color:#FFF;
}	

.commonTable02 th, .commonTable02 td{
	border:solid 1px #e6e6e6;
	padding:7px;
	font-size:85%;
	font-weight:normal;
}



.commonTable02 th{
	text-align:center;
	font-weight:bold;
	background-color:#e9eff6;
}

.commonTable02 td p{
	font-size:100%;
	font-size:inherit;
	margin-top:0;
}

.commonTable td p{
	font-size:100%;
	font-size:inherit;
	margin-top:0;
}



.commonTable03{
	width:100%;
	margin:30px 0 0 0;
	border:solid 1px #e6e6e6;
	border-collapse:collapse;
	background-color:#FFF;
}	

.commonTable03 th, .commonTable03 td{
	border:solid 1px #e6e6e6;
	padding:7px;
	font-size:85%;
	font-weight:normal;
}



.commonTable03 th{
	text-align:left;
	font-weight:bold;
	background-color:#e9eff6;
}

.cell00{ width:90px; }
.cell01{ width:110px; }
.cell03{ width:110px; }

.tbl .off { background-color:#f9f9f9; }
.tbl .on { background-color: #fff; }

.cellCenter{
	text-align:center;
}

.cellLeft , .commonTable.priceTable th.cellLeft{
	text-align:left;
}

.cellRight{
	text-align:right;
}

.subTh{
	background:#fcfcfc;
	vertical-align:middle;
}

.noColor{
	background-color:#FFF;
}


/* レイアウトテーブル飾り無し
------------------*/

.layoutTable{ margin-top:15px; border:none; }

.layoutTable th , .layoutTable td{
	border:none;
	padding:0 5px 3px 0;
	font-size:inherit;
	font-size:85%;
}

table .layoutTable{ margin-top:0; }
table .layoutTable th , table .layoutTable td{
	font-size:inherit;
	font-size:100%;
	border:none;
	padding:0 5px 3px 0
}



/* レイアウトテーブル線あり
------------------*/

.layoutTable02{ margin-top:0; border-collapse:collapse; }
.layoutTable02 th , .layoutTable02 td{
	font-size:inherit;
	font-size:100%;
	border:none;
	padding:10px;
	border:solid 1px #e6e6e6;
}

.layoutTable02 td.subTh{
	background:#fcfcfc;
	vertical-align:middle;
}


/* 右に画像----------------------------- */


.photo{
	float:right;
	width:200px;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.15);
    -moz-box-shadow: 2px 2px 2px rgba(0,0,0,0.15);
    -webkit-box-shadow: 2px 2px 2px rgba(0,0,0,0.15);
}
.photo.h3 { margin-top: 50px; }
.photo.h4 { margin-top: 30px; }

.photo img{ width:200px; }


.comment{
	margin-right:220px;
	/*padding-bottom:30px;*/
}


/* 角丸エリア----------------------------- */


.maruBox01 , .maruBox02 , .maruBox03{
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px;
	
	padding:0 10px 10px 10px;
	margin-top:10px;
}

.maruBox01{
    background-color:#fff5f1;
	border:solid 1px #edd3ce;
}


.maruBox02{
     background-color:#fff9f1;
	border:solid 1px #eddcce;
}


.maruBox03{
     background-color:#f1fdff;
	border:solid 1px #ceebed;
}


/* ページ内リンク----------------------------- */

#pageLinkArea li{
	float:left;
	background:url(../images/common/img_arrow01.png) no-repeat 0 50%;
	padding-left:25px;
	margin-right:40px;
}


/* ページ内ニュース欄----------------------------- */
.newsArea{ margin-top:30px; }
.newsArea dt{
	border:solid 1px #d9d9d9;
	background-color:#f5f5f5;
	padding:5px 15px;
	font-weight:bold;
}
.newsArea dd{
	padding:10px;
	border:solid 1px #d9d9d9;
	border-top:none;
}

.newsArea dd li{
	font-size:inherit;
	font-size:100%;
}




/* 06.FORM MODULES
---------------------------------------------------- */

option{ padding-right:15px; }
select{ margin-bottom:5px; }
input , textarea{ font-family: 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', sans-serif; }
.inputBottom{ margin-bottom:5px; }

.attention{ color:#A00000; }
.attentionNote{ font-size:85%; color:#0E3191; }
.attentionEx{ font-size:85%; margin:0 5px;}

.inputTextLong{ width:650px; padding:0 5px; }
.inputText{ width:390px; padding:0 5px; }
.inputTextNormal{ width:220px; padding:0 5px; }
.inputTextShort{ width:150px; padding:0 5px; }
.inputTextVeryShort{ width:70px; padding:0 5px; }

.inputButton{
	text-align:center;
	margin-top:30px;
}
.inputButton input[type="button"] {
	font-size: 150%;
	padding: 15px 60px;
	border: solid 1px #ccc;
	border-radius: 6px;
	background: linear-gradient(#dadada, #fff);
}
	
.ex{
	font-size:85%;
	color:#666;
}	

/* 05 DOCUMENT STRUCTURE
---------------------------------------------------- */

p , li , dt , dd{ font-size:85%; line-height:1.8em; }	

p{ margin-top:15px; }
.paragraph{ margin-top:35px; }
.noParagraph{ margin-top:0; }

.txtC { text-align: center; }
.txtR { text-align: right; }


.leadTitle{
	font-size:120%;
	color:#d53400;
	font-weight:bold;
}


h1{
	border-bottom:solid 1px #d9d9d9;
	font-size:200%;
	padding:40px 0 25px 0;
	font-weight:normal;
}


h2{
	border-bottom:solid 1px #d9d9d9;
	font-size:140%;
	font-weight:normal;
	margin-top:60px;
	padding-bottom:10px;	
}

h3{
	font-size:120%;
	margin-top:50px;
	font-weight:normal;
	border-left:5px solid #ccc;
	padding-left:10px;
}
h3.top15 { margin-top:15px; }

h4{
	font-size:90%;
	padding:10px;
	background-color:#f5f5f5;
	margin-top:30px;
	font-weight:bold;
}


h5{
	font-size:80%;
	margin-top:30px;
	font-weight:bold;
}


.memo{
	font-size:70%;
	margin-top:15px;
}	

.memoR{
	font-size:70%;
	margin-top:15px;
	text-align:right;
}

.note{
	text-align:right;
}

.attention{ color:#f66122; }



h2#purpose img {
    vertical-align: middle;
    margin-left: 20px;
}
#indexPurposeArea {
	overflow: hidden;
}
#indexPurposeArea li {
    width: 232px;
    float:left;
    font-size: 95%;
    margin-right:12px;
	margin-top:12px;
}
#indexPurposeArea li:nth-of-type(3) ,
#indexPurposeArea li:nth-of-type(6) ,
#indexPurposeArea li:nth-of-type(9){ margin-right:0; }
#indexPurposeArea li a {
    display: block;
    padding: 15px 0;
    text-align: center;
    border: solid 4px #eaeaea;
    text-decoration: none;
    font-weight: bold;
}


/* 囲み罫 */
.box {
	margin-top:30px;
	border:solid 1px #d9d9d9;
	padding: 1px 15px 16px 15px;
	overflow: hidden;
}
.box.top0 { margin-top:0; }