﻿/*////////////////////////////////////////
共通
////////////////////////////////////////*/


/*目次*/
div#mokuji-cnt{
	background:#fcfcfc;
	border:1px solid #ccc;
	padding:0px 15px 15px 15px;
	margin-top:50px;
	margin-bottom:50px;
}

div#mokuji-cnt p{
	margin-bottom:10px;
	border-bottom:1px dotted #000;
	color:#999;
}

ul.mokuji li{
	margin-top:5px;
	margin-bottom:5px;
	list-style:circle;
	margin-left:20px;
}

/*目次に連動したタイトル*/
h3#h3-1,#h3-2,#h3-3,#h3-4,#h3-5,#h3-6,#h3-7,#h3-8,#h3-9,#h3-10,#h3-11,#h3-12,#h3-13,#h3-14,#h3-15,#h3-16,#h3-17,#h3-18,#h3-19,#h3-20{
	background:#fcfcfc;
	margin-top:30px;
}



body{
}

/*ローディング（画像が呼び込まれるまで）*/
html, body{
	width: 100%;
	height: 100%;
}
.loadingWrap{
	z-index: 9999; /*すべたの要素の一番上に表示するためレイヤーを9999とした*/
	width: 100%;
	height: 100%;
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
}
.loadingWrap img{
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -10px;
}



#pagetop {
	display: none;
	position: fixed;
	bottom: 10px;
	right: 10px;
	padding: 5px;
	cursor: pointer;
	z-index:9999;
}

/*--------------
クリアフィックス
--------------*/
/* For modern browsers用 */
.cf:after{
	content: "";
	display: block;
	clear: both;
}

/* For IE 6/7用 */
.cf { zoom: 1; }


p#menu-icon{
	z-index: 9998; /*ローディングを除くすべての要素の一番上に表示するためレイヤーを9998とした*/
	position: fixed; /*絶対位置への配置となるのはabsoluteと同じだが、スクロールしても位置が固定できる*/
	top: 10px;
	right:10px;
	background:#fff;
	border-radius:5px;
	text-align:center;
	opacity:0.8;
	font-size:70%;
}
p#menu-icon img{
	width:45px;
	padding:10px 10px 0px 10px;
}

p#menu-icon02{
	top: 30px;
	right:30px;
	text-align:center;
}
p#menu-icon02 span{
	font-size:80%;
	color:#fff;
}
p#menu-icon02 img{
	width:45px;
}

/* ////////////////////////////////////////
スマートフォン向けのスタイル：(481px)736px以下（iPhone6 Plusを横位置にすると736pxなので）
////////////////////////////////////////*/
@media screen and (max-width: 736px) {

header{
	width:100%;
	background:#605F41;
	color:#fff;
}

div#header-cnt{
	padding-top:10px;
	padding-bottom:10px;
}


/*ヘッダーロゴ横ここから*/
div#s-head-r{
	width:80%;
	padding-top:10px;
	margin-left:10px;
}

h1#title a{
	font-size:110%;
	font-weight:bold;
	color:#fff;
}

p#s-head{
	padding-top:7px;
	font-size:75%;
	line-height:1.5;
}
/*ヘッダーロゴ横ここまで*/

section#menu-cnt{
	display:none;
}

p#main img{
	width:98%;
	margin-top:10px;
}


footer{
	color:#ACAC9D;
	font-size:80%;
	text-align:center;
	border-top:1px solid #ccc;
	padding-top:10px;
	margin-top:100px;
	margin-bottom:20px;
}


.text-right{
	text-align:right;
	width:100%;
	display:block;
	padding-top:15px;
}



}



/* ////////////////////////////////////////
スマホ　iPhone5系 縦位置
////////////////////////////////////////*/
@media screen and (max-width: 400px) {/*400px以下（iPhone5系 縦位置）だった場合*/


/*検索フォーム幅ここから*/
input.s{
	border:1px solid #D6D6D6;
	border-radius:5px;
	margin:0 10px 0 10px;
	padding-right:10px;
	height:42px;
	width:200px;
	font-size:90%;
}
/*検索フォーム幅ここまで*/


}



/* ////////////////////////////////////////
スマホ＆タブレット適用　ランドスケープは横向きの場合のみ
////////////////////////////////////////*/
@media screen and (min-width: 568px) and (max-device-width: 736px) { /*568px（iPhone5系横位置） ～ 736px（iPhone6 Plus横位置）だった場合*/

}


/*////////////////////////////////////////
 タブレット向けのスタイル：737px ～ 768px（iPhone6 Plusを横位置にすると736pxで一番需要が多いiPadの縦位置は768pxなので）
////////////////////////////////////////*/
@media only screen and (min-width: 737px) {


p#menu-icon{
	display:none;
}

/*--------------
マウスオーバー時のみ画像透明化
これをスマホでも適用してしまうと2回タップすることになってしまうのでタブレット＆PCのみ共有で適用している
--------------*/
a:hover img{
	opacity:0.7;
	-webkit-transition:opacity 0.2s linear;
}


/*共通中央寄せ*/
.base-center{
	width: 960px;
	margin: 0 auto;
}

header{
	background:url(../images/head-bg.png) repeat-x left top;
}

div#header-cnt{
	background:url(../images/header-inner-bg.png) no-repeat left top;
	width:980px;
	margin-left:auto;
	margin-right:auto;
}

header div#header-l{
	float:left;
	width:300px;
}

header div#header-l h1{
	margin-top:15px;
	margin-bottom:15px;
	margin-left:0px;
}

header div#header-l h1 a{
	font-size:22px;
	font-weight:bold;
	color:#605F41;
}

p#s-head{
	display:none;
}

section#menu-cnt{
	width:980px;
	margin-left:auto;
	margin-right:auto;
	margin-top:37px;
	border-bottom:10px solid #57563A;
}

section#menu-cnt ul li a{
	float:left;
	width:162px;
	display:block;
	text-align:center;
	color:#605F41;
	height:69px;
	line-height:69px;
	border-right:1px solid #000;
}

section#menu-cnt ul li a#line-last{
	border-right:none;
}

footer{
	color:#ACAC9D;
	font-size:80%;
	text-align:center;
	border-top:1px solid #ccc;
	padding-top:10px;
	margin-top:100px;
	margin-bottom:20px;
}


.text-right{
	text-align:right;
	width:100%;
	display:block;
	padding-top:15px;
}


}



/*////////////////////////////////////////
PC向けのスタイル：769px～960px（実際は769px～という指定なので横幅の制限はかけていない） 
////////////////////////////////////////*/
@media only screen and (min-width: 769px) {





}



