@charset "UTF-8";

/*===============================================*
*	BODY
*===============================================*/
body{
font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo,  'ＭＳ Ｐゴシック', Osaka, Arial, sans-serif;
font-size:14px; line-height:1.5; color:#000000; background-color:#fff; margin:0; padding:0; }

/*===============================================*
*	WRAP
*===============================================*/
#wrap { width:100%; text-align:center; margin:0; padding:0;}
.main_content, .header_content { width:960px; margin:0 auto; padding:0; text-align:left;}
#header_wrap { background-image:url(../images/top_main_back.gif); background-repeat:repeat-x; width:100%; margin:0; height:329px; display:inline-block;}
.main_cont_left { float:left; width:640px; margin-right:63px;}
.main_cont_right { float:left; width:257px;}

#header_wrap2 { background-image:url(../images/top_main_back.gif); background-repeat:repeat-x; width:100%; margin:0; height:129px; display:inline-block;}


/*===============================================*
*	NAVI
*===============================================*/
.nav { background-image:url(../images/navi_back.png); background-repeat:no-repeat; height:62px; width:960px; display:inline-block; position:absolute; top:58px; z-index:800; margin-top:0px;}
.nav ul {list-style:none; height:62px; margin:0; padding:0; display:block;}
.nav ul li { list-style:none; margin-left:0; padding-left:0;}
.nav ul li a {height:62px; display:inline-block;}
.nav ul li a img {width:100%; height:auto; margin-top:12px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
.nav ul li a:hover img {opacity:0.5;}

.nav ul li.nav1 a, .nav ul li.nav2 a, .nav ul li.nav3 a { background-image:url(../images/nav_dot.png); background-repeat:no-repeat; background-position:right; padding-right:33px;}

.nav ul li.nav1 { float:left; margin-left:24px;}
.nav ul li.nav1 a {width:212px;}

.nav ul li.nav2 { float:left; margin-left:25px;}
.nav ul li.nav2 a {width:198px;}

.nav ul li.nav3 { float:left; margin-left:25px;}
.nav ul li.nav3 a {width:135px;}

.nav ul li.nav4 { float:left; margin-left:25px;}
.nav ul li.nav4 a {width:186px;}


/*===============================================*
*	MAIN IMAGE
*===============================================*/
#header_wrap .header_content a img.logo { width:244px; height:auto; display:block; z-index:900; position:absolute; top:6px;} 
#header_wrap .header_content a:hover img.logo { opacity:1 !important; z-index:1000;}
#header_wrap .header_content img.main { width:960px; height:auto; position:absolute; z-index:600;}

#header_wrap2 .header_content a img.logo { width:244px; height:auto; display:block; z-index:900; position:absolute; top:6px;} 
#header_wrap2 .header_content a:hover img.logo { opacity:1 !important; z-index:1000;}
#header_wrap2 .header_content img.main { width:960px; height:auto; position:absolute; z-index:600;}

/*===============================================*
*	BASIC
*===============================================*/
img { border:none;}
.off { position: absolute; top: 0px; left: -1800px; width: 100px; margin: 0px; padding: 0px; }
h1, h2, h3, p {margin:0; padding:0;}
.clear{ clear: both;}
.clearfix:after { display: block; clear: both; height: 0; visibility: hidden; content: ".";}
.clearfix {zoom: 1;}
.al_r { text-align:right;}
.al_c { text-align:center;}
.al_l {text-align:left;}
.main_content a, a:visited  {color:#000; text-decoration:underline; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
.main_content a:hover{color:#05adcb; text-decoration:underline; opacity:0.5;}
.sp { font-size:12px;}
.m0 {margin: 0 !important;}
.mt05px {margin-top: 5px;}
.mt10px {margin-top: 10px;}
.mt12px {margin-top: 12px;}
.mt15px {margin-top: 15px;}
.mt20px {margin-top: 20px;}
.mt25px {margin-top: 25px;}
.mt30px {margin-top: 30px;}
.mt40px {margin-top: 40px;}
.mb05px {margin-bottom: 5px;}
.mb10px {margin-bottom: 10px;}
.mb15px {margin-bottom: 15px;}
.mb20px {margin-bottom: 20px;}
.mb30px {margin-bottom: 30px;}
.ml10px {margin-left: 10px;}
.ml15px {margin-left: 15px;}
.mr10px {margin-right: 10px;}
.mr20px {margin-right: 20px;}

/*===============================================*
*	NEWS
*===============================================*/
.main_content .main_cont_left h2.news{ margin-bottom:12px; margin-top:16px; padding-bottom:0; padding-bottom:0;}
h2.news span {display:none;}
h2.news img { width:634px; height:auto;}

.news_block { width:634px; }
.news_block dl { width:634px; background-image:url(../images/news_dot.gif); background-repeat:repeat-x; background-position:bottom; padding-bottom:6px; margin-bottom:10px;}
.news_block dt { height:24px; vertical-align:middle; display:block;}
.news_block dt span {color:#555555; line-height:1; display:inlinie-block;; vertical-align:middle;}
.news_block dt img { margin-right:6px; width:102px; height:24px; display:inlinie-block; vertical-align:middle;}
.news_block dd {font-weight:700; margin-left:0; margin-top:7px; margin-bottom:4px;}
 
.more_news { font-weight:700;}
.more_news a.link:before
{
  content: "\f138"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  margin-left: -1.1em; /* same as padding-left set on li */
  width: 1.1em; /* same as padding-left set on li */
  color:#05adcb;
}

/* ////// TABS  //////*/
.tabs { position:relative; margin: 0 auto; width: 640px; display:block; padding:0;}
.tabs input {
	width:155px;
	height:64px;
	position: absolute;
	padding:0;
	margin:0;
	float:left;
	display:inline-block;
	z-index: 1000;
	left: 0px;
	top: 0px;
	opacity: 0;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
	cursor: pointer;
}
.tabs label {position: relative; width:155px; height:64px; display:inline-block; left:-2px;}

.tabs img.tab_img {position: relative; width:155px; height:64px; padding:0; margin:0;}
.tabs input:checked + label {z-index: 6; }
.tabs label:first-of-type { z-index: 4;}

.tabs input#tab-2 {left:155px;}
.tabs input#tab-3 {left:310px;}
.tabs input#tab-4 {left:465px;}

.tab-label-2 {z-index: 3;}
.tab-label-3 {z-index: 2;}
.tab-label-4 {z-index: 1;}

.tab-label-1 { background-image:url(../../top_images/tab_new_on.gif); background-size:cover; position: relative;padding:0; margin:0;}
.tab-label-2 { background-image:url(../../top_images/tab_maintenance_on.gif); background-size:cover; position: relative; padding:0; margin:0;}
.tab-label-3 { background-image:url(../../top_images/tab_seminar_on.gif); background-size:cover; position: relative; padding:0; margin:0;}
.tab-label-4 { background-image:url(../../top_images/tab_improvement_on.gif); background-size:cover; position: relative; padding:0; margin:0;}

input:checked + label.tab-label-1 img.tab_img, input:checked + label.tab-label-2 img.tab_img,
input:checked + label.tab-label-3 img.tab_img, input:checked + label.tab-label-4 img.tab_img
{ opacity:0; }

.content { background: #fff; position: relative; width:640px; height:485px; z-index: 5; overflow:auto;}

.content div { position: absolute; top: 0; left: 0; z-index: 1; opacity: 0;
    -webkit-transition: opacity linear 0.1s;
    -moz-transition: opacity linear 0.1s;
    -o-transition: opacity linear 0.1s;
    -ms-transition: opacity linear 0.1s;
    transition: opacity linear 0.1s;
}

.tabs input.tab-selector-1:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-2,
.tabs input.tab-selector-3:checked ~ .content .content-3,
.tabs input.tab-selector-4:checked ~ .content .content-4 {
	z-index: 100;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition: opacity ease-out 0.2s 0.1s;
    -moz-transition: opacity ease-out 0.2s 0.1s;
    -o-transition: opacity ease-out 0.2s 0.1s;
    -ms-transition: opacity ease-out 0.2s 0.1s;
    transition: opacity ease-out 0.2s 0.1s;
}


/*===============================================*
*	RIGHT BLOCK
*===============================================*/
h2.login span, h2.system span, h2.download span, h2.helpdesk span  {display:none;}
h2.login img{ width:257px; height:auto; margin-bottom:10px; margin-top:16px;}
a.login_btn img{ width:220px; height:auto; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all  0.3s ease;}
a:hover.login_btn img{ opacity:0.9;}
h2.system img { width:257px; height:auto; margin-top:16px; margin-bottom:5px;}
h2.download img { width:257px; height:auto; margin-top:16px; margin-bottom:5px;}
h2.helpdesk img { width:257px; height:auto; margin-top:16px; margin-bottom:7px;}

ul.link { list-style:none; padding:0; margin:0 auto 0 1.1em;}
ul.link li {margin-bottom:2px;}
ul.link li:before
{
  content: "\f138"; /* FontAwesome Unicode */
  font-family: FontAwesome;
  display: inline-block;
  margin-left: -1.1em; /* same as padding-left set on li */
  width: 1.1em; /* same as padding-left set on li */
  color:#05adcb;
}
h3.help_icn { height:25px; display:block; font-weight:700; color:#00393e; margin-bottom:4px;}
h3.help_icn img { display:inline-block; vertical-align:middle;width:25px; height:25px;}
h3.help_icn span { display:inlinie-block; vertical-align:middle; line-height:1;}


/*===============================================*
*	FOOTER
*===============================================*/
#footer { background-image:url(../images/top_footer_back.gif); background-repeat:repeat-x; height:60px; width:100%; margin:0; padding:0;}