html {	
	height: 100%;
	margin: 0;
}

/*webフォント読み込み(不要なら削除して下さい)*/
@import url(http://fonts.googleapis.com/earlyaccess/roundedmplus1c.css);

body{
	margin:0;
	color:#4F4F4F;
	font-family:"Rounded M+ 1c","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	overflow:auto;
	background-image:url(img/b.png);/*背景画像*/
}

/*メニュー部分*/
#left_frame {
	width:90%;
	margin:15% auto;
	padding:5% 5%;
	font-size:16px;
	position:relative;
	background-color:rgba(255,255,255,0.6);
	z-index:2;
	overflow:scroll;
	box-shadow: 0 10px 20px -3px rgba(0,0,0,0.2), 0 -10px 25px -3px rgba(0,0,0,0.1);	
}

/*メイン部分*/
#right_frame {
	width:90%;
	margin:auto;
	padding:5% 5%;
	position:relative;
	background-color:rgba(255,255,255,0.7);
	line-height: 150%;
	overflow:scroll;
	z-index:2;
	box-shadow: 0 10px 20px -3px rgba(0,0,0,0.2), 0 -10px 20px -3px rgba(0,0,0,0.1);	
}

/*更新履歴用アイフレーム*/
iframe{	
	border: 1px solid;
	height:20%;
	width:90%;
	overflow:auto;
	 -webkit-overflow-scrolling:touch;
}

/*リンク関係*/
a {
	transition: color 0.5s ease -0.1s;
  }
  a:link{	
	  color: #663333; 
  }
  a:visited{
	  color: #deb887; 
  } 
  a:hover{
	  color: #deb887; 
	  text-decoration: none;
  }

/*その他装飾*/
.mobile_none{
	display:none;
}

/*サイトタイトル*/
#logo{
font-family: 'Vidaloka', serif;
text-align:center;
font-weight:normal;
}
#maintitle{
display:block;
text-decoration: none;
color: #4F4F4F; 
font-size:40px;
line-height:55px;
letter-spacing:-3px;
}
.description{
display:block;
font-size:18px;
line-height:10px;
letter-spacing:1px;
}


p{
	padding-bottom:3%;
}

strong{
	font-size:150%;
	background: linear-gradient(transparent 70%, #ffbc57 60%);/*マーカーの色*/
}

/*画像関係*/
img{	
	margin:5px 5px 5px 5px;
	vertical-align: middle;
}

.picture{	
	max-width:100%;
	margin-top:5%;
}

.icon{	
	margin:0px 1px 5px 1px;
	width:40px;
	height:40px;
}

.log{
	width:90px;
	height:90px;
	object-fit:cover;
	padding-bottom:5px;
}

/*リスト関係*/
ul{	
	list-style: none;
	padding-left:0%;
}

li{	
	margin-bottom:2%;
}

/*メニューボタン用*/
.buttun{
	text-align: center;
	display: inline-block;
	width: 10%;
	min-width: 30%;
	
}
.buttun:not(:last-child){
	border-right:2px solid #ddd;
}

/*見出し*/
h1 {
	position: relative;
	padding-bottom: .3em;
}
h1::before,
h1::after {
	position: absolute;
	bottom: -4px;
	left: 0;
	content: '';
	height: 4px;
}
h1::before {
	z-index: 2;
	width: 15%;
	background-color: #113d1e;
}
h1::after {
	width: 100%;
	background: -webkit-repeating-linear-gradient(45deg, #fff, #fff 2px, #94c9a3 2px, #94c9a3 4px);
	background: repeating-linear-gradient(45deg, #fff, #fff 2px, #94c9a3 2px, #94c9a3 4px);
}

h2 {
	padding: .25em 0 .25em .75em;
 	border-left: 6px solid #113d1e;
}
h3 {	
	padding: .5em .75em;
	background-color: #dee4d6;
	border-top: 1px solid rgb(43, 16, 87);
	border-bottom: 1px solid rgb(43, 16, 87);
}

h4 {	
	background: url(img/i02.gif) no-repeat left center;
	padding-left: 35px;		
	line-height:200%;
	font-weight:400;
	font-size:18px;
	border-bottom:double 2px #663333; 
	color:#663333;
}

/*フォーム周り*/
textarea{	
	margin:auto;
	width:95%;
	border: 1px #663333 solid; 	
	-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}

input[type="text"] {
	margin:auto;
	width:90%;
	background-color: #ffffff;
	border: 1px #113d1e solid; 	
	-moz-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
-webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2);
box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
-webkit-box-shadow: inset 1px 4px 9px -6px rgba(0, 0, 0, 0.5);
box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
}

input[type="submit"] {
	-webkit-appearance: none;
	font-size:16px;
	margin:auto;
	width:100%;
	height:70px;
	position: relative;
	background-color:#deb887;
	border-radius: 10px;
	border: solid 1px #ccba8f;
	color: #fff;
	line-height: 52px;
	-webkit-transition: none;
	transition: none;
	box-shadow: 0 3px 0 rgb(190, 154, 105);
	text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
}
input[type="submit"]:hover {
	top: -4px;
	box-shadow: 0 7px 0 rgb(190, 154, 105);
}
input[type="submit"]:active {
	top: 3px;
	box-shadow: none;
}

/*===============================================
画面の横幅が768px以上（PC用）
===============================================*/

@media screen and (min-width: 768px){
html{	
	height: 100%;
	margin: 0;
}

body {	
	margin:0;
	overflow:hidden;
	padding:0;
}

header{
	display:none;
}

footer{
	width:100%;
	padding-top:15%;
}

/*メニュー部分*/
#left_frame {
	margin:auto;
	font-size:16px;
	background-image:none;
	height:100%;
	padding:0 3% 0 4%;
	overflow:auto;
	position:fixed;
	width:20%;
	box-shadow: 0px 0px 20px 2px rgba(0,0,0,0.21);
	-webkit-box-shadow: 0px 0px 20px 2px rgba(0,0,0,0.21);
	-moz-box-shadow: 0px 0px 20px 2px rgba(0,0,0,0.21);
	z-index:2;
}

/*メイン部分*/
#right_frame {
	margin:auto;
	position:fixed;
	width:60%;
	height:100%;
	margin:0 0 0 30%;
	padding:0 3% 0 4%;/*上右下左*/
	overflow:auto;
	line-height: 150%;
	box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.21);
	-webkit-box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.21);
	-moz-box-shadow: 0px 0px 20px 3px rgba(0,0,0,0.21);
	z-index:2;
}


/*更新履歴用アイフレーム*/
iframe{	
	border:1px solid;
	width:70%;
	background-color:rgba(255,255,255,0.9);
}

/*サイトタイトル*/
.mobile_none{
	display:block;
}

/*フォーム周り*/
textarea{
	font-size:16px;	
	width:60%;
}
input {
    vertical-align : middle;
}
input[type="text"] {
	font-size:14px;
	width:40%;
}
input[type="submit"] {
	font-size:14px;
	width:120px;
	height:60px;
	position: relative;
	background-color:#deb887;
	border-radius: 4px;
	border: solid 1px #ccba8f;
	color: #fff;
	line-height: 52px;
	-webkit-transition: none;
	transition: none;
	box-shadow: 0 3px 0 rgb(190, 154, 105);
	text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
}
input[type="submit"]:hover {
	top: -4px;
	box-shadow: 0 7px 0 rgb(190, 154, 105);
}
input[type="submit"]:active {
	top: 3px;
	box-shadow: none;
}

}
