@charset "utf-8";

/* ----------------------------------------
  Base Style Seet

	1- 1. layout
	1- 2. header
	1- 3. groval nav
	1- 4. sidebar
	1- 5. footer
	1- 6. link
	1- 7. nav icon
	1- 8. head
	1- 9. text, emphasis
	1-10. list
	1-11. common box
	1-12. breadcramb
	1-13. table
---------------------------------------- */


body{
	font-size: 12px;
	color:#333;
	line-height:1.8;
	background: #c0c0c0;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック', Helvetica, Arial, Verdana, sans-serif;
}

div,span,section,ul,li,p,dl,dt,dd,header,footer,aside,article,a,select,.bdbx{
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

button{
	border: none;
	margin: 0;
	padding: 0;
	background: none;
	display: block;
	width: 100%;
}

.ui-datepicker-trigger{
	display: inline;
	width: auto;
}

button img{
	vertical-align: middle;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

/* ----------------------------------------
  2-1. layout
---------------------------------------- */

#pageWrap{
	position: relative;
	width: 100%;
	overflow: hidden;
}

#mainArea{
	width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 1000;
	background: #fff;
	box-shadow: 4px 0 8px rgba(0,0,0,0.3);
}

#menuArea{
	width: 100%;
	padding-left: 16.5%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}

header{
	width: 100%;
	overflow: hidden;
	border-bottom: 1px #c2c2c2 solid;
}

article{

}

footer{

}


/* ----------------------------------------
  2-2. header
---------------------------------------- */

header .logo{
	display: block;
	width: 82.5%;
	float: left;
}

header #menuFire{
	display: block;
	width: 16.5%;
	float: right;
}

/* ----------------------------------------
  2-3. groval nav
---------------------------------------- */

#menuArea .userName{
	background: #e20b17;
	font-size: 18px;
	color: #fff;
	padding: 0.6em 0.9em;
}

#menuArea li{
	background: url(/sp/images/common2/bg_grad.png) left center repeat-x;
	-webkit-background-size: contain;
	background-size: contain;
	padding: 0 0.8em;
}

#menuArea a{
	display: block;
	font-size: 15px;
	padding: 0.6em 0;
	padding-left: 2.6em;
	color: #333333;
	text-shadow: 1px 1px 0 #fff;
	font-weight: bold;
}

#menuArea .menu01 a{
	background: url(../images/common2/icon_menu01.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu02 a{
	background: url(../images/common2/icon_menu02.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu03 a{
	background: url(../images/common2/icon_menu03.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu04 a{
	background: url(../images/common2/icon_menu04.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu05 a{
	background: url(../images/common2/icon_menu05.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu06 a{
	background: url(../images/common2/icon_menu06.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu07 a{
	background: url(../images/common2/icon_menu07.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu08 a{
	background: url(/sp/images/common2/icon_menu08.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu09 a{
	background: url(/sp/images/common2/icon_menu09.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

#menuArea .menu10 a{
	background: url(/sp/images/common2/icon_menu10.png) left center no-repeat;
	-webkit-background-size: 2em;
	background-size: 2em;
}

/* ----------------------------------------
  2-4. footer
---------------------------------------- */

footer{
	padding: 4.5%;
	background: #ececec;
}

footer .footerMenu{
	margin-bottom: 3%;
}

footer .footerMenu li{
	display: inline-block;
	font-size: 12px;
}

footer .footerMenu a{
	color: #1d83df;
}

footer small{
	font-size: 11px;
	color: #333333;
}

/* ----------------------------------------
  2-5. topicpath
---------------------------------------- */

.topicPath{
	width: 100%;
	padding: 2% 3% 5% 3%;
}

.topicPath li{
	display: inline-block;
	vertical-align: middle;
}

.topicPath li.home{
	width: 10%;
}

.topicPath li.home a{
	position: relative;
	top: -2px;
	margin-right: 2px;
}

.topicPath li a{
	text-decoration: underline;
}


/* ----------------------------------------
  2-6. link
---------------------------------------- */

a:link, a:visited, a:active{
	color: #333;
}



/* ----------------------------------------
  2-8. head
---------------------------------------- */


/* ----------------------------------------
  2-9.text, emphasis
---------------------------------------- */


/* ----------------------------------------
  2-9. nav icon
---------------------------------------- */


/* ----------------------------------------
  2-10. list
---------------------------------------- */


/* ----------------------------------------
  2-11. common box
---------------------------------------- */

.pageTitle{
	padding: 0.3em 4% 0.2em;
	border-bottom: 1px #c2c2c2 solid;
	font-size: 18px;
	font-weight: normal;
}

.pageTitle span{
	padding-left: 1.2em;
	background: url(/sp/images/common2/icon_cir_arr.png) left center no-repeat;
	-webkit-background-size: 0.8em;
	background-size: 0.8em;
}

/* ----------------------------------------
  2-12. breadcramb
---------------------------------------- */


/* ----------------------------------------
  2-13. table
---------------------------------------- */



#main-message{
width: 99%;
border-radius: 8px;
-webkit-border-radius: 8px;
border: solid 1px #E21616;
-webkit-box-shadow: 1px 2px 2px 3px #CCCCCC;
-moz-box-shadow: 1px 2px 2px 3px #CCCCCC;
box-shadow: 1px 2px 2px 3px #CCCCCC;
margin-top:15px;
margin-bottom:25px;
}
#main-message h4{
padding: 5px;
background: #E21616;
color: gold;
-webkit-border-top-right-radius: 6px;
-webkit-border-top-left-radius: 6px;
border-top-right-radius: 6px;
border-top-left-radius: 6px;
behavior: url(PIE.htc);
}

#main-message p{
padding: 5px;
background-color:#E5E5AE;
color:#E21616;
font-weight:bold;
}

#info-message{
padding:10px;
background-color:#FDF7D2;
border-radius: 8px;
-webkit-border-radius: 8px;
border: solid 1px #DDCE72;
-webkit-box-shadow: 1px 2px 2px 3px #DDDDDD;
-moz-box-shadow: 1px 2px 2px 3px #DDDDDD;
box-shadow: 1px 2px 2px 3px #DDDDDD;
margin-bottom:25px;
}

#info-message p{
color:#5C3725;
font-weight:bold;
}

ul.footer_pref_list {
	width:100%;padding-left:15px;float:left;
	margin-bottom:10px;
}

ul.footer_pref_list li{
	width:100px;
	float:left;
}
ul.footer_pref_list li.wider{
	width:240px;
	float:left;
}
ul.footer_pref_list li a{
	text-decoration: underline;
	display:block;
	color: #00a2ff;
	font-size:1.4em;
}

.header_pref_list {
	width:100%;
	text-align:right;
	font-size:1.2em;
	border-bottom: 1px #c2c2c2 solid;
}

.lang-head{
	margin: 0 auto;
}
.lang-head-ja{
	margin: 0 auto;
	padding-right:10px;
}
.lang-head-tw{
	margin: 0 auto;
	padding-right:10px;
}
.lang-head-ja a:link { color: #666; }
.lang-head-ja a:visited { color: #666; }
.lang-head-ja a:hover { color: #ff0000; }
.lang-head-ja a:active { color: #666; }

.lang-head-tw a:link { color: #666; }
.lang-head-tw a:visited { color: #666; }
.lang-head-tw a:hover { color: #ff0000; }
.lang-head-tw a:active { color: #666; }