@charset "utf-8";
/**
 * style 
 * (c) FOURDIGIT Inc.
 *
 * 1. import
 * 2. html, body
 * 3. HTMLtag, siteCommonClass
 * 4. Layout
 * 5. EachPageStyle
 *
 */
/**
 * 1. import
 */
@import "import/reset.css";
@import "import/util.css";
/* @import "../ext_{bukkenID}/{bukkenID}.css"; */

/**
 * 2. html, body
 */
	body {
		-webkit-text-size-adjust: none;
	}
	.page {
		color: #071017;
		font-size: 14px;
		line-height: 1.5;
		letter-spacing: 0.1em;
		font-family:"yu-gothic-pr6n","poiret-one","fot-tsukuaoldmin-pr6n","Zen Old Mincho","Noto Sans JP", 'M PLUS Rounded 1c', "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "Times New Roman", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", sans-serif;
	}


	.img {
		max-width: 100% !important;
		height: auto;
		vertical-align: bottom;
	}


	
		/*background: url(../img/body_bg_btm.png) repeat-x bottom;
	}
	@media only screen and (max-width: 1360px) {
	.page {
		background: none;
	}
}


	
/**
 * 3. HTMLtag, siteCommonClass
 */
/* anchor */

a:link {
	color: #343434;
	text-decoration: none;
}

a:visited {
	color: #343434;
	text-decoration: none;
}

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

a:active {
	color: #343434;
	text-decoration: none;
}



.textBox a:link {
	color: #0049CC;
	text-decoration: underline;
}

.textBox a:hover {
	color: #0049CC;
	text-decoration: none;
}
.textBox a:visited {
	color: #0049CC;
	text-decoration: underline;
}
.textBox a:active {
	color: #0049CC;
	text-decoration: none;
}



/* heading */
	.siteTitle {
		/*dont use <h1> selector*/
	}
	.contentTitle {
		/*dont use <h2> selector*/
	}

/* cap */
	.cap,
	.caption {
		background: none !important;
		color: #666666 !important;
		font-size: 10px !important;
		line-height: 15px !important;
	}
	.cap {
		padding-top: 5px !important;
	}

/**
 * 4. Layout
 */
	body #container {
		text-align: left;
		overflow: hidden;
		zoom: 1;
		background-size: 100%;
}
	body #containerInner01 {
		max-width: 1200px;
}

	body #gHeader {}
	body .shldrTxt {
		font-size: 10px;
		line-height: 15px;
	}
	body #gFooter {
    clear: both;
}
	

	
#sideBar {
		z-index: 1000;
	float: left;
	width: 12%;
	position: fixed;
	top: 0px;
}

#sideBar .pcBox {
	height: 100%;
	z-index: 1000;
	width: 180px;
	margin-left: auto;
	/*margin-right: auto;*/
}

@media only screen and (max-width: 1400px) {
	#sideBar .pcBox {
		 width: auto; 
	}
}



#sideBar .pcBox h1 {
	padding-top: 16px;
}

#sideBar h1 {
	margin: 0 auto 23px;
	width: 84%;
	text-align: center;
}

#sideBar h1 img {
	width: 100%;
}

.sNavi li {
	float: left;
	width: 100%;
}

.sNavi li img,
.sNavi li a {
	display: block;
}

.sNavi li img {
	width: 100%;
}

.sNavi li a {
	text-decoration: none;
}

.sNavi li a.on img {
	visibility: hidden;
}

.sNavi .navi01 a.on,
.sNavi .navi01 a:hover {
	background: url(../img/s_navi01_over.png) no-repeat;
	background-size: 100% auto;
}

.sNavi .navi02 a.on,
.sNavi .navi02 a:hover {
	background: url(../img/s_navi02_over.png) no-repeat;
	background-size: 100% auto;
}

.sNavi .navi03 a.on,
.sNavi .navi03 a:hover {
	background: url(../img/s_navi03_over.png) no-repeat;
	background-size: 100% auto;
}

.sNavi .navi04 a.on,
.sNavi .navi04 a:hover {
	background: url(../img/s_navi04_over.png) no-repeat;
	background-size: 100% auto;
}

.sNavi .navi05 a.on,
.sNavi .navi05 a:hover {
	background: url(../img/s_navi05_over.png) no-repeat;
	background-size: 100% auto;
}

.sNavi li .subNavi {
	left: 100%;
	position: absolute;
	top: 0;
	width: 200px;
	height: 500px;
	z-index: 1000;
	display: none;
	background: url(../img/s_navi_bg01.gif) repeat-y left top;
}

.pcBox .sNavi li .subNavi ul {
	padding-top: 133px;
}

.sNavi li .subNavi li {
	float: none;
	font-size: 13px;
	text-align: center;
}

.sNavi li .subNavi li a {
	padding: 20px 0;
	display: block;
	color: #fff;
}

.sNavi li .subNavi li a:hover {
	background: url(../img/s_navi_hover.png) repeat-y left top;
}

.sNavi li .subNavi02 {
	background: url(../img/s_navi_bg02.gif) repeat-y left top;
}

.sNavi li .subNavi03 {
	background: url(../img/s_navi_bg03.gif) repeat-y left top;
}

#sideBar .sNavi li .subNavi04 {
	background: url(../img/s_navi_bg04.gif) repeat-y left top;
}

#sideBar .sNavi li .subNavi05 {
	background: url(../img/s_navi_bg05.gif) repeat-y left top;
}

#mainContent {
	float: right;
	width: 87.4%;
}

#mainContent .pageTop {
	padding: 40px 17px 5px 0;
	text-align: right;
}

#mainContent .pageTop a {
	padding-right: 17px;
	background: url(../img/icon02.png) no-repeat right 4px;
}



/* fNav */
	#fNavi {
		padding: 20px 0 22px 48px;
		font-size: 11px;
		background: url(../img/footer_bg.png) repeat-x left top;
	}
	#fNavi li {
		margin-right: 2%;
		float: left;
		width: 17.7%;
	}
	
	#fNavi li dt {
		padding-bottom: 6px;
		background: url(../img/line.gif) repeat-x left bottom;
	}
	
	#fNavi li dt a {
		padding-left: 20px;
		display: inline-block;
		background: url(../img/icon03.png) no-repeat 6px 2px;
	}
	
	#fNavi li dd ul {
		margin: 7px 0 0 14px;
	}
	
	#fNavi li dd li {
		margin: 0 0 4px;
		float: none;
		width: auto;
	}
	
	#fNavi li dd li a {
		padding-left: 20px;
		display: inline-block;
		background: url(../img/icon03.png) no-repeat 6px 2px;
	}
	
	#gFooter .fBox {
		padding: 15px 0 15px 55px;
		background: url(../img/footer_bg.png) repeat left top;
	}
	
	#gFooter .fBox .fLogo {
		margin-right: 20px;
		float: left;
	}
	
	#gFooter .fBox .fLogo img {
		display: block;
	}
	
	#gFooter .fBox p {
		padding-top: 8px;
		width: 60%;
		float: left;
		color: #000;
		font-size: 10px;
		line-height: 1.2;
	}
	
	#gFooter .fBox p span {
		margin-bottom: 7px;
		display: block;
		font-size: 12px;
	}
	
    #gFooter .copyright {
		padding: 10px;
		color: #000;
		font-size: 10px;
		text-align: right;
		background: url(../img/line02.gif) repeat-x left top;
	}
	
	#sideBar .ipadBox,
	#sideBar .spBox,
	#sideBar .webBox,
	#mainContent .spUl,
	#mainContent .webUl,
	#mainContent .ipadUl {
		display: none;
	}
	
	#pagePath {
		margin-bottom: 39px;
		text-align: right;
	}
	
	#pagePath li {
		color: #343434;
		display: inline;
		font-size: 11px;
	}

	#mainContent .h2Head01 {
		margin-bottom: 15px;
		padding-left: 13px;
		color: #4c3434;
		font-size: 18px;
		font-weight: bold;
		border-left: 3px solid #7B4C15;
	}
	
	#mainContent .comInner .fltImgR {
		float: right;
	}
	
	#mainContent .comInner .fltTextL {
		float: left;
	}
	
		#mainContent .comInner .fltImgL {
		float: left;
	}
	
	#mainContent .comInner .fltTextR {
		float: right;
	}
	
@media all and (min-width: 769px) and (max-width: 1024px)  {
	body #container {
		background: url(../img/body_bg.jpg) repeat-y center top;
		background-size: cover;
	}
	
	#mainContent {
		width: auto;
	}
	
	#mainContent .mainVisual {
		margin-bottom: 10px;
	}
	
	#sideBar {
		width: 100%;
		position: relative;
	}
	
	
	#sideBar .pcBox,
	#sideBar .ipadBox,
	#sideBar .spBox,
	#gNavi {
		display: none;
	}
	
	#sideBar .webBox {
		display: block;
		position: relative;
	}
	
	#sideBar .webBox h1 {
		margin: 10px auto;
		width: 20%
	}
	
	#sideBar .webBox h1 img {
		width: 100%;
	}
	
	#sideBar .webBox .sNavi {
		width: 100%;
	}
	
	#sideBar .webBox .sNavi li {
		float: left;
		width: 20%;
	}
	
	#sideBar .webBox .sNavi li img {
		width: 100%;
	}
	
	#sideBar .webBox .sNavi li .subNavi li {
		float: left;
	}
	
	#sideBar .webBox .sNavi li .subNavi {
		top: 100%;
		left: 0;
		width: 100%;
		height: auto;
		background: #7B4C15;
	}
	
	#sideBar .webBox .sNavi li .subNavi02 {
		background: #00A0B6;
	}
	
	#sideBar .webBox .sNavi li .subNavi03 {
		background: #F84C86;
	}
	
	#sideBar .webBox .sNavi li .subNavi04 {
		background: #32B559;
	}
	
	#sideBar .webBox .sNavi li .subNavi05 {
		background: #FFAC1D;
	}	
}
	

@media all and (min-width: 481px) and (max-width: 768px)  {
	body #container {
		width: 100%;
		background: url(../img/body_bg.jpg) repeat-y center top;
		background-size: auto;
	}
	
	#sideBar .pcBox,
	#sideBar .spBox,
	#sideBar .webBox,
	#gNavi,
	#mainContent .spUl {
		display: none;
	}
	
	#sideBar .ipadBox {
		display: block;
		position: relative;
	}
	
	#mainContent {
		width: 100%
	}
	
	#sideBar {
		padding: 5px 0;
		width: 100%;
		position:relative;
		
	}

	#sideBar .ipadBox h1 {
		margin-bottom: 0;
		padding-left: 3%;
		float: left;
		width: 15%
	}
	
	#sideBar .ipadBox h1 img {
		width: 100%;
	}
	
	#sideBar .ipadBox .meunBox {
		padding-right: 5%;
		float: right;
		width: 30px;
		position: relative;
		z-index: 1000;
	}
	
	#fNavi {
		padding: 20px 10px;
		font-size: 9px;
	}
	
	#fNavi li {
		margin-right: 2%;
		width: 18%;
	}
	
	#fNavi li:last-child {
		margin-right: 0;
	}
	
	#gFooter .fBox .fLogo {
		width: 10%;
	}
	
	#gFooter .fBox .fLogo img {
		width: 100%;
	}
	
	#gFooter .fBox p {
		width: 80%;
		font-size: 10px;
	}
	
	#gFooter .fBox p span {
		font-size: 11px;
	}

	#sideBar .button-toggle {
		box-shadow: 0 0 0 2px #555;
		color: #aaa;
		cursor: pointer;
		float: left;
		font-size: 30px;
		height: 30px;
		line-height: 30px;
		margin: 10px;
		position: absolute;
		text-align: center;
		width: 30px;
	}
	
	#sideBar .title {
		float: left;
		height: 5px;
		line-height: 50px;
		text-align: center;
		width: 100%;
		cursor: pointer;
	}
	
	#sideBar .menu {
		background: none repeat scroll 0 0 #222;
		color: #999;
		overflow: hidden;
		position: absolute;
		top: 100%;
		width: 100%;
		z-index: 100;
		display: none;
	}
	
	#sideBar .menu ul {
		list-style: none outside none;
		margin: 0;
		padding: 0;
	}
	
	#sideBar .menu li {
		position: relative;
	}
	
	#sideBar .menu li ul {
		display: none;
	}
	
	#sideBar .menu a {
		border-bottom: 1px solid #555;
		color: #999;
		display: block;
		font-size: 15px;
		height: 40px;
		line-height: 40px;
		padding: 5px 20px;
		text-decoration: none;
	}
	
	#sideBar .menu a:hover {
		background: none repeat scroll 0 0 #333;
	}
	
	#sideBar .menu ul li ul li a {
		padding-left: 50px;
	}
}

@media all and (min-width: 0) and (max-width: 480px)  {
	body #container {
		width: 100%;
		background: url(../img/body_bg.jpg) repeat-y center top;
		background-size: auto;
	}
	
	#sideBar .pcBox,
	#sideBar .ipadBox,
	#sideBar .webBox,
	#gNavi {
		display: none;
	}
	
	#sideBar .spBox {
		display: block;
		position:relative;
	}
	
	#mainContent {
		width: 100%
	}
	
	#sideBar {
		padding: 5px 0;
		width: 100%;
		position:relative;
	}
	
	#sideBar h1 {
		margin-bottom: 0;
		float: left;
		padding-left: 5%;
		width: 25%
	}
	
	#sideBar h1 img {
		width: 100%;
	}
	
	#sideBar .spBox .meunBox {
		float: right;
		width: 30px;
		padding-right: 7%;
		position: relative;
		z-index: 1000;
	}
	
	#fNavi {
		padding: 20px;
	}
	
	#fNavi li {
		margin: 0 0 20px;
		float: none;
		width: 100%;
	}
	
	#fNavi li dd li a,
	#fNavi li dt a {
		background: url(../img/icon03.png) no-repeat 6px 2px;
		background-size: 9px 9px;
	}
	
	#gFooter .fBox {
		padding: 10px;
	}
	
	#gFooter .fBox .fLogo {
		width: 20%;
	}
	
	#gFooter .fBox .fLogo img {
		width: 100%;
	}
	
	#gFooter .fBox p {
		padding-left: 25%;
		float: none;
		word-wrap: break-word;
		width: auto;
		letter-spacing: -0.5px;
	}
	
	#mainContent .h2Head01 {
		font-size: 13px;
	}
	
	#mainContent .pageTop {
		font-size: 11px;
	}
	
	#mainContent .pageTop a {
		background: url(../img/icon02.png) no-repeat right center;
		background-size: 9px 9px;
	}
	
	#sideBar .button-toggle {
		box-shadow: 0 0 0 2px #555;
		color: #aaa;
		cursor: pointer;
		float: left;
		font-size: 30px;
		height: 30px;
		line-height: 30px;
		margin: 10px;
		position: absolute;
		text-align: center;
		width: 30px;
	}
	
	#sideBar .title {
		float: left;
		height: 5px;
		line-height: 50px;
		text-align: center;
		width: 100%;
		cursor: pointer;
	}
	
	#sideBar .menu {
		background: none repeat scroll 0 0 #222;
		color: #999;
		overflow: hidden;
		position: absolute;
		top: 100%;
		display: none;
		width: 100%;
		z-index: 100;
	}
	
	#sideBar .menu ul {
		list-style: none outside none;
		margin: 0;
		padding: 0;
	}
	
	#sideBar .menu li {
		position: relative;
	}
	
	#sideBar .menu li ul {
		display: none;
	}
	
	#sideBar .menu a {
		border-bottom: 1px solid #555;
		color: #999;
		display: block;
		font-size: 12px;
		height: 40px;
		line-height: 40px;
		padding: 5px 20px;
		text-decoration: none;
	}
	
	#sideBar .menu a:hover {
		background: none repeat scroll 0 0 #333;
	}
	
	#sideBar .menu ul li ul li a {
    	padding-left: 50px;
	}
}


/* title */

	.titleA, .titleB, .titleC,.sttl {
		color: #000 !important;
		font-family: 'Hiragino Mincho ProN', serif !important;
		margin-bottom:10px;
	}
	.brown {
		color: #7b4c15 !important;
	}
	.sttl {
		font-size: 20px !important;
	}
	.titleA {
		font-size: 24px !important;
	}
	.titleB {
		font-size: 18px !important;
	}
	.titleC {
		font-size: 18px !important; 
	}
	.titleA span,
	.titleB span,
	.titleC span,
	.sttl span {
		display: none;
	}

@media only screen and (max-width: 1024px) {
	.sttl {
		font-size: 16px !important;
	}
	.titleA img,
	.titleB img,
	.titleC img,
	.sttl img {
		display: none;
	}
	.titleA span,
	.titleB span,
	.titleC span,
		.sttl span {
		display: block;
	}
}
@media only screen and (max-width: 480px) {
	.sttl {
		font-size: 14px !important;
	}
	.titleA {
		font-size: 18px !important;
	}
	.titleB {
		font-size: 16px !important;
	}
	.titleC {
		font-size: 16px !important;
	}
}



#mainContent .mainConts {
	/* margin: 30px 0 0 30px; */
	width: 960px;
	padding: 30px;
}
@media only screen and (max-width: 1160px) {
#mainContent .mainConts {
	width: auto;
}
}


@media all and (min-width: 0) and (max-width: 480px)  {
#mainContent .mainConts {
	/* margin: 10px auto 0; */
	width: auto !important;
	padding: 10px !important;
}
}
@media all and (min-width: 480px) and (max-width: 768px)  {
#mainContent .mainConts {
	/* margin: 15px auto 0; */
	width: auto !important;
	padding: 10px !important;
}
}

@media only screen and (max-width: 1024px) {
	body #container {
		background: none !important;
	}
}



/* textBox */
.mainConts .link a {
	padding-left: 0px;
	    color: #b66fb9;
    background: none;
}
body.index #mainContent .mainConts .textBox {
	margin-bottom: 20px;
}
body.index #mainContent .mainConts .textBox .Inner{
	padding:20px 30px; 
}
body.index #mainContent .mainConts .textBox p,
body.index #mainContent .mainConts .textBox ul {
	margin-bottom: 20px;
}
body.index #mainContent .mainConts .textBox ol  li{
	padding-left:0px;
	margin-left:10px;
}
body.index #mainContent .mainConts .textBox ol  li{
	list-style-type: decimal;
}
body.index #mainContent .mainConts .textBox ol  li ul li{
	list-style-type: none;
}
