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


/*------------------------------------------------

 common style
 
------------------------------------------------*/
body {
	color: #666;
	font-size: 12px;
	font-family: Verdana, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif, "ＭＳ ゴシック", "MS Gothic";
	line-height: 1.6;
}

a:link { color: #3e7ecd; text-decoration: underline; }
a:visited { color : #9d61b6 ; }
a:hover { color : #a0c5f3 ; }
a:active { color : #a0c5f3 ; }


/* ------ clearfix ------ */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility:hidden;
}
.clearfix{ display: inline-block; }
/* Hides from IE Mac */
* html .clearfix { height: 1%; }
.clearfix{ display:block; }
/* End Hack */ 

.clear {
	clear: both;
}

/* ------ font style ------ */
.font10 { font-size: 10px!important; }
.font12 { font-size: 12px!important; }
.font14 { font-size: 14px!important; }
.font16 { font-size: 16px!important; }
.font18 { font-size: 18px!important; }
.font20 { font-size: 20px!important; }

.color01 { color: #908642; }
.color02 { color: #e60012; }

/* ------ margin padding style ------ */
.PT0 { padding-top: 0!important; }
.PT10 { padding-top: 10px!important; }
.PT20 { padding-top: 20px!important; }
.PT30 { padding-top: 30px!important; }
.PB20 { padding-bottom: 20px!important; }

/* ------ link style ------ */
.link01 {
	padding-left: 10px;
	background: url(../images/icon_arrow-red02.gif) no-repeat left center;
}


/*------------------------------------------------

 body
 
------------------------------------------------*/
body{
	background: url(../images/bg_header01.jpg) no-repeat center top;
}
body#news{
	background: none;
}


/*------------------------------------------------

 header
 
------------------------------------------------*/
#header {
	width: 960px;
	height: 120px;
	margin: 0 auto;
	position: relative;
}

#header a:link { color: #666; text-decoration: none; }
#header a:visited { color : #666 ; }
#header a:hover { color : #ccc ; }
#header a:active { color : #ccc ; }

#header h1 {
	font-size: 10px;
	position: absolute;
	top: 4px;
}

#header .logo {
	position: absolute;
	top: 35px;
}

#header .nav-lang {
	position: absolute;
	top: 94px;
}
#header .nav-lang li {
	font-size: 10px;
	text-align: center;
	width: 93px;
	margin-right: 1px;
	padding-bottom: 5px;
	border-bottom: 1px solid #dadada;
	float: left;
}
#header .nav-lang li.on {
	color: #e60012;
	border-bottom: 1px solid #e60012;
	background: url(../images/icon_arrow-red01.gif) no-repeat center bottom;
}

#header .nav-global {
	position: absolute;
	top: 98px;
	right: 0;
}
#header .nav-global li {
	margin-left: 30px;
	float: left;
}

#header .nav-sub {
	position: absolute;
	top: 40px;
	right: 0;
}
#header .nav-sub li {
	font-size: 10px;
	margin-left: 20px;
	padding-left: 10px;
	background: url(../images/icon_arrow-red02.gif) no-repeat left center;
	float: left;
}

#header #snsbtn {
	position: absolute;
	top: 10px;
	right: 0;
}
#header #snsbtn .item {
	float: left;
}
#header #snsbtn .item iframe.twitter-share-button{
	width:100px !important;
}



/*------------------------------------------------

 breadcrumb
 
------------------------------------------------*/
#breadcrumb {
	font-size: 10px;
	width: 960px;
	margin: 0 auto;
	padding-top: 20px;
	/*padding-top: 30px;*/
}
#breadcrumb h1,
#breadcrumb p {
	color: #999;
	margin-right: 10px;
	float: left;
}
#breadcrumb p {
	padding-right: 15px;
	background: url(../images/icon_arrow-gray01.gif) no-repeat right center;
}



/*------------------------------------------------

 wrap
 
------------------------------------------------*/
#top #wrap {
	width: 1000px;
	margin: 0 auto;
	padding-top: 40px;
	clear: both;
}
#sub #wrap {
	width: 1000px;
	margin: 0 auto;
	padding-top: 30px;
	clear: both;
}

/* -------- #banner -------- */
#banner {
	clear: both;
	padding-top: 40px;
}
#banner div {
	padding: 10px 0 15px;
	position:relative;
	overflow:hidden;
	background: #f4f0ed url(../images/bg_banner01.jpg) repeat-y left top;
}
#banner ul {
	line-height: 1;
  position:relative;
  left:50%;
  float:left;
}
#banner li {
	position:relative;
	left:-50%;
	float: left;
	margin: 5px 10px 0 0;
}
#banner li img {
	border: 2px solid #edecec;
}
#banner li img:hover {
	border: 2px solid #d7d6b7;
}
#banner li.nolink img:hover {
	border: 2px solid #edecec;
}


/*------------------------------------------------

 footer
 
------------------------------------------------*/
#footer {
	padding-top: 30px;
	clear: both;
}

#footer .info01 {
	font-size: 10px;
	line-height: 1.8;
	width: 960px;
	margin: 0 auto;
	position: relative;
}
#footer .info01 ul {
	padding-bottom: 40px;
	float: left;
}
#footer .info01 div {
	float: right;
}
#footer .info01 div p {
	margin-left: 20px;
	float: left;
}
#footer .info01 p.pagetop {
	text-align: center;
	height: 29px;
	clear: both;
}

#footer .info02 {
	color: #fff;
	height: 180px;
	background: #8d8d8d url(../images/bg_footer01.jpg) no-repeat center top;
}
#footer .info02In {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

#footer .info02In a:link { color: #fff; text-decoration: none; }
#footer .info02In a:visited { color : #fff ; }
#footer .info02In a:hover { color : #ccc ; }
#footer .info02In a:active { color : #ccc ; }

#footer .info02In ul {
	padding: 40px 0 0 15px;
}
#footer .info02In li {
	margin: 0 15px;
	padding-left: 10px;
	background: url(../images/icon_arrow-white01.jpg) no-repeat left center;
	float: left;
}

#footer .info02In .logo {
	clear: both;
	position: absolute;
	top: 92px;
	left: 0;
}
#footer .info02In .copy {
	font-size: 10px;
	position: absolute;
	top: 128px;
	right: 0;
}



/*------------------------------------------------

 sub page common style
 
------------------------------------------------*/
#sub .title {
	text-align: center;
	padding-top: 10px;
}

/* -------- section style -------- */

/* section-1cal-lead */
.section-1cal-lead {
	text-align: center;
	width: 920px;
	margin: 36px auto 0;
	padding: 20px 20px 0;
	background: url(../images/bg_box-940.png) no-repeat center top;
}
.section-1cal-lead .expBox {
	text-align: left;
	padding-bottom: 20px;
}
.section-1cal-lead .expBox .leftBox {
	width: 366px;
	padding: 20px 20px 20px 60px;
	float: left;
	border: 2px solid #eee;
}
.section-1cal-lead .expBox .rightBox {
	width: 366px;
	padding: 20px 20px 20px 60px;
	float: right;
	border: 2px solid #eee;
}
.section-1cal-lead .info {
	text-align: left;
	clear: both;
	font-size: 10px;
	padding: 15px 20px;
	background: url(../images/bg_border01.jpg) repeat left top;
}
.section-1cal-lead .pageNav {
	padding: 30px 0 20px;
	position:relative;
	overflow:hidden;
}
.section-1cal-lead .pageNav ul {
  position:relative;
  left:50%;
  float:left;
}
.section-1cal-lead .pageNav ul li {
	position:relative;
	left:-50%;
	float: left;
	padding: 0 3px;
}
.section-1cal-lead .subtxt {
	padding-bottom: 15px;
}


/* section-1cal */
.section-1cal01 {
	margin-top: 20px;
	padding: 0 20px;
	background: url(../images/bg_shadow01.png) no-repeat center 29px;
}
.section-1cal01 h2 {
	padding: 0 0 35px 15px;
	background: url(../images/icon_line01.png) no-repeat left 2px;
}


/* section-2cal */
.section-2cal-left {
	width: 460px;
	margin-top: 40px;
	padding: 0 20px;
	position: relative;
	background: url(../images/bg_shadow02.png) no-repeat center 29px;
	float: left;
	clear: both;
}
.section-2cal-left h2 {
	padding: 0 0 35px 15px;
	background: url(../images/icon_line01.png) no-repeat left 2px;
}

.section-2cal-right {
	width: 460px;
	margin-top: 40px;
	padding: 0 20px;
	position: relative;
	background: url(../images/bg_shadow02.png) no-repeat center 29px;
	float: left;
}
.section-2cal-right h2 {
	padding: 0 0 35px 15px;
	background: url(../images/icon_line01.png) no-repeat left 2px;
}

/* pagetop */
.pagetop {
	padding-top: 5px;
	text-align: right;
}


/* -------- table style -------- */
.table01 { width: 100%; }
.table01 th,
.table01 td {
	text-align: left;
	padding: 15px 10px 15px 0;
	border-bottom: 1px dotted #ddd;
}
.table01 .first th,
.table01 .first td {
	padding: 0 10px 15px 0;
}
.table02 { width: 100%; }
.table02 th,
.table02 td {
	text-align: left;
	padding: 5px;
	border: 1px solid #eee;
}
.table02 th {
	text-align: center;
	background: #f9f9f9;
}

/* -------- list style -------- */

/* list01 */
.list01 li {
	margin-top: 10px;
}
.list01 .num01 { margin-top: 0; padding-left: 20px; background: url(../images/icon_num01-01.png) no-repeat center left; }
.list01 .num02 { padding-left: 20px; background: url(../images/icon_num01-02.png) no-repeat center left; }
.list01 .num03 { padding-left: 20px; background: url(../images/icon_num01-03.png) no-repeat center left; }
.list01 .num04 { padding-left: 20px; background: url(../images/icon_num01-04.png) no-repeat center left; }
.list01 .num05 { padding-left: 20px; background: url(../images/icon_num01-05.png) no-repeat center left; }

.list03 li {
	padding-bottom: 12px;
}
.list03 li a {
	text-decoration: none;
	padding-left: 20px;
	background: url(../images/icon_arrow-red02.gif) no-repeat 10px center;
}

/* listBox01 */
.listBox01 ul {
}
.listBox01 li.list {
	letter-spacing: normal;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	vertical-align: top;
	position: relative;
	width: 475px;
	margin: 0 3px 10px 0;
	padding-bottom: 8px;
	background: url(../images/bg_border02.gif) repeat left top;
}
:root .listBox01 li.list {
	margin: 0 2px 10px 0 \0/; /* IE9 */
}

@media screen and (max-device-width: 480px) {
.listBox01 li.list {
	margin: 0 1px 10px 0;
}
}


.listBox01 li h3 {
	font-size: 14px;
	font-weight: bold;
	padding: 10px 110px 6px 32px;
	background: url(../images/icon_arrow-gray02.png) no-repeat 10px 15px;
}
.listBox01 li .iconBox {
	position: absolute;
	top: 10px;
	right: 10px;
}
.listBox01 li .itemBox {
	margin: 0 5px;
	padding: 15px 12px;
	background: #fff url(../images/bg_shadow04.png) no-repeat center bottom;
}
.listBox01 li .itemBox .item {
	padding-bottom: 10px;
}
.listBox01 li .itemBox .item .img {
	line-height: 1;
	text-align: center;
	width: 134px;
	padding-bottom: 3px;
	float: left;
	background: url(../images/bg_shadow05.jpg) no-repeat center bottom;
}
.listBox01 li .itemBox .item .img2 {
	line-height: 1;
	text-align: center;
	width: 134px;
	padding-bottom: 2px;
	float: left;
	background: url(../images/bg_shadow05.jpg) no-repeat center bottom;
}
.listBox01 li .itemBox .item p {
	width: 300px;
	float: right;
}
.listBox01 li .itemBox .mobile {
	margin: 0 5px;
	border-top: 1px dotted #ddd;
}
.listBox01 li .itemBox .mobile img {
	float: left;
}
.listBox01 li .itemBox .mobile ul {
	font-size: 10px;
	width: 330px;
	margin-top: 12px;
	float: right;
}
.listBox01 li .itemBox .mobile ul li {
	padding: 2px 0 5px 30px;
}
.listBox01 li .itemBox .mobile ul li span {
	color: #d20010;
}
.listBox01 li .itemBox .mobile ul li.i { background: url(../images/icon_career01.png) no-repeat left top; }
.listBox01 li .itemBox .mobile ul li.e { background: url(../images/icon_career02.png) no-repeat left top; }
.listBox01 li .itemBox .mobile ul li.y { background: url(../images/icon_career03.png) no-repeat left top; }
.listBox01 li .itemBox .mobile .url {
	font-size: 10px;
	width: 330px;
	padding-top: 12px;
	float: right;
}
.listBox01 li .itemBox .app {
	margin: 0 5px;
	padding-top: 10px;
	border-top: 1px dotted #ddd;
}
.listBox01 li .itemBox .app dt {
	font-weight: bold;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin-bottom: 3px;
}
.listBox01 li .itemBox .app dd.itunes {
	font-size: 10px;
	padding: 3px 8px;
	margin-bottom: 12px;
	background-color: #f1f1f1;
}