@charset "utf-8";

/*共通の設定 */
html {
	background: #000;
	background:url(../images/top/bg.png) repeat;
	height:100%;
	min-height:100%;
	height: auto !important;
}
body {
	font-family:'Lucida Grande','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size:14px;
	color: #eee;
	width:95%;
	margin: 0 auto;
	text-align: center;
	height:100%;
	height: auto !important;

}

a{
    color:#b00000;
    font-style:normal;
    text-decoration:underline;
}
a:link {
    color:#b00000;
    font-style:normal;
    text-decoration:underline;
}
a:visited {
    color:#7f0000;
    text-decoration:underline;
}
a:hover {
    color:#db0000;
    font-style:normal;
    text-decoration:underline;
}
a:active {
    text-decoration:none;
}

body > #container {
	height: auto;
}

#container {
	min-height: 100%;
	height: 100%;
	margin:0;
	padding:0;
	
}

header {
	margin,padding:0;
}

h1#titleTop {
	margin-bottom:15px;
}


p.linkKeitai {
	font-weight:600;
	font-size:1.3em;
	margin-bottom:20px;
}

p#topLead {
	text-align:left;
}





section#book {
	background:#0c0c0c;
	border:#252323 1px solid;
	width:80%;
	margin:0 auto;
	padding:15px;
	margin-bottom:15px;
	overflow:auto;
}

section h2 {
	font-size:1.13em;
	line-height:120%;
	margin-bottom:7px;

}

section#book p {
	font-size:0.87em;
	margin-bottom:10px;
}

section p.bookImg img {
	  width:60%;
	  max-width:183px;

}

section p#bookAuthor {
	line-height:120%;

}

section p#textNav {
	text-align:left;
	font-size:1.05em;
	
}

/* FOR BIGGIER */

#beginner {

}


#beginner section {
	margin-bottom:25px;
}

#beginner h2 {
	font-size:1.5em;
	color:#7b714d;
	margin-bottom:15px;
}

#beginner p {
	margin-bottom:8px;
	text-align:left;
}

.bgBox {
	width:90%;
	padding:10px 10px 0;
	border:solid 1px #514f40;
	text-align:left;
	margin:0 auto 8px;
	background:#151512;
}





#beginner section h3 {
	padding:8px;
	color:#000;
	margin-bottom:8px;
	border-radius: 3px; 
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
	text-shadow: 1px 1px 0px rgba(255,255,255,0.1);
	background: rgb(102,94,75); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(102,94,75,1) 0%, rgba(33,29,3,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(102,94,75,1)), color-stop(100%,rgba(33,29,3,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(102,94,75,1) 0%,rgba(33,29,3,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(102,94,75,1) 0%,rgba(33,29,3,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(102,94,75,1) 0%,rgba(33,29,3,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(102,94,75,1) 0%,rgba(33,29,3,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#665e4b', endColorstr='#211d03',GradientType=0 ); /* IE6-9 */


}

#beginner section ol {
	text-align:left;
	margin:0;
	padding:5px 0 10px 27px;
}

#beginner section ol li{
	margin-bottom:10px;
}

/* Keitai Info */


h1#titleKeitai {
	margin-bottom:30px;
	
}

h1#titleKeitai img {
	width:60%;
	
}

#Keitai {
	text-align:left;
}


#Keitai h2{
	font-size:1.5em;
	font-weight:bold;
	
	
}

#Keitai ul.chu {
	padding-left:1em;
	font-size:0.9em;
	margin-bottom:15px;
}

#Keitai ul.chu li{
        text-indent:-1em;
        list-style-type:none;
    }

#Keitai h3 {
	font-weight:normal;
	border-bottom:1px solid #777;
	margin-bottom:8px;

	
}

#Keitai h4 {
	font-weight:normal;
	font-size:1.2em;
	padding-left:10px;

	
}

#Keitai h4 img{
	margin-right:5px;

	
}


#Keitai ul.Klist {
	padding:5px 0 18px 27px;;
	margin:0;
	overflow:hidden;
}

#Keitai ul.Klist li {
	font-size:0.9em;
	list-style:none;
	float:left;
	margin-right:15px;
}

#Keitai a{
    color:#331c10;
    font-style:normal;
    text-decoration:none;
}
#Keitai a:link {
    color:#331c10;
    font-style:normal;
    text-decoration:none;
}
#Keitai a:visited {
    color:#331c10;
    text-decoration:none;
}
#Keitai a:hover {
    color:#91170e;
    font-style:normal;
    text-decoration:none;
}
#Keitai a:active {
    text-decoration:none;
}



.btHome {
	text-align:center;
	text-decoration: none;
	display:block;
	height:20px;
	width:200px;
	background:#c2a88a;
	padding:8px 0;
	margin:0 auto 30px;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
background: rgb(160,142,125); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(160,142,125,1) 0%, rgba(137,117,99,1) 41%, rgba(104,80,64,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(160,142,125,1)), color-stop(41%,rgba(137,117,99,1)), color-stop(100%,rgba(104,80,64,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(160,142,125,1) 0%,rgba(137,117,99,1) 41%,rgba(104,80,64,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(160,142,125,1) 0%,rgba(137,117,99,1) 41%,rgba(104,80,64,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(160,142,125,1) 0%,rgba(137,117,99,1) 41%,rgba(104,80,64,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(160,142,125,1) 0%,rgba(137,117,99,1) 41%,rgba(104,80,64,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a08e7d', endColorstr='#685040',GradientType=0 ); /* IE6-9 */


text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.4);
font-weight:bold;
	}
	
.btHome a {
	display:block;
	width:200px;
	height:28px;
}


/*　スマホのスタイル */


/*　PCのスタイル */

@media all and (min-width:600px) {
html {
		background:url(../images/top/bg_1.png) repeat top center ;
/*		border:1px solid #000; */

}
h1#titleTop {
		max-width:450px;
		margin-left:auto;
		margin-right:auto;
}


p#topLead {
	width:500px;
	margin:0 auto 10px;
}

section#book {
	width:500px;
}

section#book p.bookImg {
	float:left;
	margin-right:10px;
}

section#book p.bookImg img{
	width:183px;

}

section h2 {
	font-size:1.5em;
	line-height:120%;
	margin-bottom:7px;

}

section p#textNav {
	text-align:left;
	font-size:1.05em;
	width:60%;
	float:right;
	
}

#beginner {
	width:90%;
	margin:0 auto;
}

h1#titleKeitai img {
	width:300px;
	height:auto;
	
}

#Keitai {
	width:550px;
	margin:0 auto;

}



@media all and (min-width:768px) {
	#beginner {
	width:600px;
	margin:0 auto;
}
}