@charset "UTF-8";
/* CSS Document */

body {
	font-size:14px;
}

header,
nav,
figure,
footer,
section {
	display:block;
}

.clear {
	clear:both;
}

.clearfix:after {
	content:" ";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}

input,
select,
textarea {
	–webkit–appearance: none;
}



/*フォーム項目*/

input,
select,
button,
textarea {
	border:solid 1px #ccc;
	box-sizing:border-box;
	padding:5px 10px;
	border-radius: 10px;        /* CSS3草案 */  
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
	background:#fff;
	-webkit-appearance: none;
	width:100%;
	box-sizing:border-box;
}

input[type="checkbox"]{
	width:20px!important;
	height:20px;
	padding:5px;
	border-radius: 5px;        /* CSS3草案 */  
	-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 5px;   /* Firefox用 */
	margin-right:5px;
	position:relative;
}
input[type="checkbox"].active::before{
	content:"";
	display:block;
	width:12px;
	height:12px;
	background:#ccc;
	position:absolute;
	left:3px;
	top:3px;
	border-radius: 3px;        /* CSS3草案 */  
	-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 3px;   /* Firefox用 */
}

input[type="radio"]{
	width:20px!important;
	height:20px;
	padding:5px;
	border-radius: 20px;        /* CSS3草案 */  
	-webkit-border-radius: 20px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 20px;   /* Firefox用 */
	margin-right:5px;
	position:relative;
}
input[type="radio"].active::before{
	content:"";
	display:block;
	width:12px;
	height:12px;
	background:#ccc;
	position:absolute;
	left:3px;
	top:3px;
	border-radius: 12px;        /* CSS3草案 */  
	-webkit-border-radius: 12px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 12px;   /* Firefox用 */
}



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

#header,
#headerboxSub {
	background:#333333;
}

#header {
	z-index:20;
	position:relative;
}
#headerboxSub {
	z-index:60;
}

#header .inframe,
#headerboxSub .inframe {
	width:1024px;
	height:70px;
	margin:0 auto;
	position:relative;
}

h1,
#headerboxSub .title {
	position:absolute;
	left:24px;
	top:27px;
}

h1 a,
#headerboxSub .title a {
	display:block;
	width:157px;
	height:0;
	padding-top:24px;
	overflow:hidden;
	background:url(css_img/siteID.png) no-repeat left top;
}

#headerboxSub {
	position:fixed;
	left:0;
	top:-70px;
	width:100%;
}

#navMenuBtm {display:none;}

/***********************************
グローバルナビゲーション
***********************************/

#glNavi {
	position:absolute;
	right:0;
	bottom:0;
	border-right:solid 1px #7b7b7b;
}

#glNavi li {
	float:left;
	position:relative;
}

#glNavi a {
	display:block;
	padding-top:53px;
	height:0;
	overflow:hidden;
	border-left:solid 1px #7b7b7b;
	background-image:url(css_img/glNavi.png);
	background-repeat:no-repeat;
}
#glNavi a:hover {border-left:solid 1px #fff;}

#glNavi #navbtmINTRODUCTION a {
	background-position:1px 0;
	width:181px;
}
#glNavi #navbtmINTRODUCTION a:hover {background-position:1px -53px;}

#glNavi #navbtmOFFICE a {
	background-position:-181px 0;
	width:103px;
}
#glNavi #navbtmOFFICE a:hover {background-position:-181px -53px;}

#glNavi #navbtmPRIVACY a {
	background-position:-285px 0;
	width:171px;
}
#glNavi #navbtmPRIVACY a:hover {background-position:-285px -53px;}

#glNavi #navbtmCONTACT a {
	background-position:-454px 0;
	width:122px;
}
#glNavi #navbtmCONTACT a:hover {background-position:-454px -53px;}

#glNavi #navbtmNetaqure a {
	background-position:-575px 0;
	width:150px;
}
#glNavi #navbtmNetaqure a:hover {background-position:-575px -53px;}

#glNavi #navbtmLOGINAGENT a {
	background-position:-725px 0;
	width:151px;
}
#glNavi #navbtmLOGINAGENT a:hover {background-position:-725px -53px;}

#glNavi #navbtmLOGINUSER a {
	background-position:-877px 0;
	width:138px;
}
#glNavi #navbtmLOGINUSER a:hover {background-position:-877px -53px;}


#glNavi li ul {
	display:none;
	position:absolute;
	right:0;
	top:54px;
}
#glNavi li:hover ul {
	display:block;
	width:270px;
}
#glNavi li:hover ul li {
	float:none;
	margin-bottom:1px;
}
#glNavi li:hover ul li a {
	height:57px;
	line-height:57px;
	padding:0 25px;
	background:#4a4a4a;
	color:#9f9f9f;
	border:none;
	width:auto !important;
}
#glNavi li:hover ul li a:hover {
	color:#fff;
}

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

#footer {
	background:#ebebeb;
}

#footer .inframe {
	margin:0 auto;
	width:1024px;
	height:287px;
	position:relative;
}

#footer #listNaviFooter {
	position:absolute;
	top:0;
	right:0;
}
#footer #listNaviFooter,
#footer #listNaviFooter a {
	color:#b6b6b6;
}
#footer #listNaviFooter li {
	float:left;
}
#footer #listNaviFooter li a {
	border-left: solid 1px #b6b6b6;
	padding:25px 30px;
	display:block;
}
#footer #listNaviFooter li a:hover {
	color:#999;
}

#footer #textCopyright {
	position:absolute;
	width:100%;
	left:0;
	bottom:21px;
	text-align:center;
	font-size:1.1em;
}
#footer #textCopyright,
#footer #textCopyright a {color:#b6b6b6;}
#footer #textCopyright a:hover {color:#999;}


#footer .boxFooter {
	text-align:center;
	padding:35px 10px;
	box-sizing:border-box;
}
#footer .boxFooter .frame{
	position:relative;
	overflow:hidden;
	background:#000;
}
#footer .boxFooter .frame::before {
	position:absolute;
	content:"";
	display:block;
	width:120%;
	height:0;
	padding:60% 0 0 0;
	overflow:hidden;
	left:-10px;
	top:-5px;
	background:url(css_img/bgBnrSeminorlink.jpg) no-repeat left top;
	background-size:100%;
	opacity:0.8;
}
#footer .boxFooter .frame:after {
	position:absolute;
	content:"";
	display:block;
	width:105%;
	height:0;
	overflow:hidden;
	padding:200% 0 0 0;
	background:#00000099;
	left:-75%;
	top:-25%;
	transform:skewX(25deg);
	transition-property:left;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#footer .boxFooter:hover .frame:after {
	left:-5%;
}
#footer .boxFooter a {
	display:block;
	height:0;
	overflow:hidden;
	padding:35% 0 0 0;
	background:url(css_img/bnrSeminorRoom.svg) no-repeat left top;
	background-size:100%;
	z-index:5;
	position:relative;
}

/***********************************
コンテンツ
***********************************/

#contents {}

#contents .inframe {
	width:1024px;
	margin:85px auto;
}

/***********************************
サイドバー
***********************************/

#sidebar {
	width:250px;
	float:left;
	position:relative;
	z-index:50;
}

#sidebar #navSide {
	margin-bottom:35px;
}
#sidebar #navSide li {
	font-size:1.12em;
}
#sidebar #navSide li a {
	display:block;
	padding:25px 25px 25px 40px;
	border-bottom:solid 1px #ddd;
	color:#777;
	background:#fff url(css_img/iconNavSide.png) no-repeat 2px 21px;
}
#sidebar #navSide li a:hover {
	color:#ccc;
	background:#f6f6f6;
}

/***********************************
メイン
***********************************/

#main {
	width:730px;
	float:right;
	position:relative;
}

#main h2 {
	font-size:1.5em;
	color:#666;
	font-weight:bold;
	padding:25px 0 0 0;
	margin-bottom:25px;
}

#main p {
	margin-bottom:35px;
}

#main li {
	padding-left:2.0em;
	position:relative;
	margin:12px 0;
}
#main li span {
	position:absolute;
	left:0;
	top:0;
}

#main input[type="text"],
#main input[type="email"],
#main input[type="checkbox"],
#main input[type="tel"],
#main select,
#main textarea {
	border:solid 1px #e0e0e0;
	padding:8px 15px;
	box-sizing:border-box;
	width:100%;
}
#main input[type="checkbox"]{
	padding:5px;
	color:#000;
}

#main input[type="text"],
#main textarea {
	color:#ccc;
}
#main input[type="text"]:focus,
#main textarea:focus {
	color:#333;
}

#main input[type="button"],
#main input[type="submit"],
#main input[type="reset"],
button {
	background:#eee;
	color:#333;
	cursor:pointer;
	padding:8px 20px;
}

#main .printing {
	position:absolute;
	left:0;
	top:150px;
	width:100%;
	text-align:center;
	font-size:1.3em;
	color:#666;
}

/**************************************************************************************
**************************************************************************************
画面サイズが640pxより小さい場合
**************************************************************************************
**************************************************************************************/


@media screen and (max-width: 640px){
	
	#main input[type="text"],
	#main input[type="email"],
	#main select,
	#main textarea {
		padding:13px 0;
		text-indent:1rem;
	}

	/***********************************
	ヘッダー
	***********************************/
	
	#headerboxSub {
		display:none;
	}
	
	#header .inframe {
		width:auto;
		height:auto;
		min-height:70px;
	}

	#navMenuBtm {
		display:block;
		position:absolute;
		right:8px;
		top:4px;
	}
	#navMenuBtm a {
		background:url(css_img/btmMenu.png) no-repeat left top;
		background-size:100%;
		width:60px;
		height:0;
		padding-top:60px;
		overflow:hidden;
		display:block;
	}

	/***********************************
	グローバルナビゲーション
	***********************************/
	
	#glNavi {
		/*display:none;
		position:absolute;*/
		display:none;
		position: relative;
		z-index:20;
		width:100%;
		top:70px;
		left:0;
		border-right:none;
		margin-bottom:70px;
	}
	#glNavi.show {
		display:block;
	}
	#glNavi li {
		float:none;
	}
	#glNavi a.menuOpen {
		display:block;
		position: absolute;
		left:0;
		top:0;
		padding:0;
		width:100% !important;
		height:55px;
		background-color: inherit;
		background:url(css_img/btmOpenMenu_on.png) no-repeat right 3px !important;
		background-size:50px!important;
		z-index:355;
	}
	#glNavi a.menuOpen.close {
		background:url(css_img/btmOpenMenu_off.png) no-repeat right 3px !important;
		background-size:50px!important;
	}
	#glNavi li:hover ul li.tagSM {
		display:block;
	}
	#glNavi li a,
	#glNavi li:hover ul li a {
		width:auto !important;
		background-image:none;
		background-color:#4a4a4a;
		padding:0 25px;
		border-left:none;
		border-bottom:solid 1px #ccc;
		height:55px;
		line-height:55px;
		color:#fff;
	}
	#glNavi li ul li a,
	#glNavi li:hover ul li a {
		padding:0 25px 0 55px;
	}
	/**/#glNavi li li a,
	#glNavi li:hover li a {
		background-image:url(css_img/iconSubmenu.png) !important;
		background-repeat:no-repeat!important;
		background-position:23px 15px !important;
		background-size:23px!important;
	}
	#glNavi li a:hover,
	#glNavi li:hover ul li a:hover {
		background-color:#333;
		border-left:none;
		color:#fff;
	}
	#glNavi li ul {
		display:block;
		position: relative;
		right: auto;
		top: auto;
	}
	#glNavi li ul,
	#glNavi li:hover ul {
		display:block;
		width:auto;
	}
	#glNavi li:hover ul li {
		margin-bottom:0;
	}
	
	/*#glNavi li:hover ul li a {
		height:57px;
		line-height:57px;
		padding:0 25px;
		background:#4a4a4a;
		color:#9f9f9f;
		border:none;
		width:auto !important;
	}
	#glNavi li:hover ul li a:hover {
		color:#fff;
	}*/
	
	/***********************************
	フッター
	***********************************/
	
	#footer .inframe {
		width:auto;
		height:auto;
		padding-bottom:84px;
	}
	
	#footer #listNaviFooter {
		position: relative;
		top: auto;
		right:auto;
	}
	#footer #listNaviFooter li {
		width:50%;
	}
	#footer #listNaviFooter li a {
		border-left:none;
		border-right: solid 1px #b6b6b6;
		border-bottom: solid 1px #b6b6b6;
		padding:20px 20px;
		text-align:center;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	/***********************************
	コンテンツ
	***********************************/
	
	#contents {}
	
	#contents .inframe {
		width:auto;
		margin:45px auto;
	}

	/***********************************
	サイドバー
	***********************************/
	
	#sidebar {
		width:auto;
		float:none;
	}
	
	#sidebar #navSide {
		display:none;
	}
	
	/***********************************
	メイン
	***********************************/
	
	#main {
		float:none;
		width:auto;
		padding:0 15px;
	}
	
	#main h2 {
		font-size:1.5em;
		padding:0 0 10px 0;
		margin-bottom:25px;
	}
	
	#main input[type="button"],
	#main input[type="submit"],
	#main input[type="reset"] {
		padding:15px 0px;
	}
	#main .printing {
		position: inherit;
		left: auto;
		top:auto;
		width:auto;
		font-size:1.3em;
		padding:35px 0;
	}

}

/**************************************************************************************
**************************************************************************************
画面サイズが640pxより大きい場合
**************************************************************************************
**************************************************************************************/


@media screen and (min-width: 640px){

	#footer .boxFooter {
		width:310px;
		position:absolute;
		bottom:15px;
		left:15px;
		padding:0;
	}
}

/**************************************************************************************
**************************************************************************************
画面サイズが1024pxより大きい場合
**************************************************************************************
**************************************************************************************/


@media screen and (min-width: 1024px){

	#footer .boxFooter {
		width:310px;
		bottom:65px;
		left:50%;
		margin-left:-152px;
	}
}