html, body {
			width: 100%;
			height: 100%;
			padding: 0px;
			margin: 0px;
			font-size: 20px;
			font-family: Verdana, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;	letter-spacing: 0.1em;
			letter-spacing: 0.05em;
			line-height: 1.5em;
			color: #333;
			background-image: url(img/back.jpg);
			background-repeat: no-repeat;
			}

img {
  vertical-align: top;
}

@media only screen and (max-width: 640px) {
	
html, body { background-image: none; }	
	
img {
    max-width: 100%;
    height: auto;
  }
}	


@media screen and (max-width: 640px) {
	.br-sp { display:none; }
}



h1 {width:100%; background-color:#06C; font-size: 14px; color: #FFF; margin: 0 auto;}
h1 span {display: block; text-align:center; margin: 0 auto;}


/*　　ヘッダ
-------------------------------------------------*/


.header_img {
  width: 1100px;
  height: 500px;
  margin: 0px auto 50px;
  text-align: center;
  background: url(img/header_image.jpg) no-repeat center;
}
.header_img img {
  display: none;
}

@media only screen and (max-width: 640px) {
  .header_img {
    width: auto;
    height: auto;
    background: none;
  }
  .header_img img {
    display: block;
  }
}





/*　理由
-------------------------------------------------*/


.riyu_img {
  width: 1100px;
  height: 299px;
  margin: 0px auto;
  text-align: center;
  background: url(img/riyu_ttl.jpg) no-repeat center;
}
.riyu_img img {
  display: none;
}

@media only screen and (max-width: 640px) {
.riyu_img {
    width: auto;
    height: auto;
    background: none;
  }
.riyu_img img {
    display: block;
  }
}




/*　　メインコンテンツ
-------------------------------------------------*/
#contents {
	width: 1050px;
	margin: 0px auto;
	text-align:justify;
	padding: 25px;
	background-color: #FFF;
}

#contents img { margin: 10px; }


@media only screen and (max-width:640px){
#contents {
	width: 95%;
	margin: 0px auto;
	padding: 0;
}


#contents img { margin: 0px; }

}





ul {
	padding-left: 25px;
}

ul li {
	list-style-image: url(img/check.png);
	line-height: 1.8em;
	vertical-align: middle;
}

@media only screen and (max-width:600px){
ul {
	padding-left: 30px;
}
}




.midashi {
	background-color: #C00;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 42px;
	line-height: 1.2em;
	color: #FFF;
	text-align: center;
	width: 100%;
	padding: 10px 0;
}


.midashi2 {
	background-color: #FFFFBF;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 64px;
	line-height: 1.2em;
	color: #C00;
	text-align: center;
	width: 100%;
	padding: 10px 0;
}

.midashi3 {
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 38px;
	line-height: 1.2em;
	color: #C00;
	text-align: center;
	width: 100%;
	padding: 10px 0;
}



@media only screen and (max-width:640px){
.midashi {
	background-color: #C00;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 28px;
	line-height: 1.2em;
	color: #FFF;
	text-align: center;
	width: 100%;
	padding: 10px 0px;
}


.midashi2 {
	background-color: #FFFFBF;
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 30px;
	line-height: 1.2em;
	color: #C00;
	text-align: center;
	width: 100%;
	padding: 10px 0px;
}

.midashi3 {
	font-family: 'Noto Serif JP', sans-serif;
	font-size: 28px;
	line-height: 1.2em;
	color: #C00;
	text-align: center;
	width: 100%;
	padding: 10px 0;
}


}



/*　　　　テーブル
-------------------------------------------------*/

.list {width: 90%; margin: 0 auto;}
.list th	{ width: 50%; text-align: left; font-weight: normal;}
.list td	{ width: 50%; text-align: left; font-weight: normal;}
@media only screen and (max-width:640px){
	.list {width: 95%; margin: 0 auto;}

    .list th,
    .list td{
		width: 100%;
		margin: 0 auto;
        display: block;
		border-top: none;
    }
	
	.list td{
		margin-top: -42px;
    }
}



.three_rows {width: 95%; margin: 0 auto;}
.three_rows th	{ width: 33%; text-align: left; font-weight: normal;}
.three_rows td	{ width: 33%; text-align: left;}
@media only screen and (max-width:600px){
	.top_movie	{ margin: 0 -10px; }
    .three_rows th,
    .three_rows td{
		width: 98%;
        display: block;
		border-top: none;
    }
}




.riyu th	{ width: 17%; text-align: left;}
.riyu td	{ width: 83%; text-align: left;}
@media only screen and (max-width:640px){
    .riyu th,
    .riyu td{
		width: 100%;
        display: block;
		border-top: none;
		text-align:justify;
    }
}





/*　　　　フッター
-------------------------------------------------*/

.footer_width {
		background-color: #E6E6E6;
		margin: 0px auto;
		width: 100%;
		}

.footer	{  width: 100%; }
.footer	th	{ width: 48%; text-align: left; font-weight: normal; font-size: 18px;}
.footer	td	{ width: 52%; text-align: right; font-size: x-large;}

.footer a:link { color:#333; }

@media only screen and (max-width:600px){
	
	.footer	{ margin: 0 auto; }
	
    .footer th{
		width: 100%;
        display: block;
		border-top: none;
		font-size: small;
    }
	
    .footer td{
		width: 100%;
		text-align: left;
        display: block;
		border-top: none;
		font-size: large;
    }
}

.footer_copy {
	margin: 0px auto;
	padding: 10px 0px;
	text-align: center;
	font-size: 12px;
	line-height: 3em;
	letter-spacing: 0.05em;
	border-top: solid 1px;
}






/*　　　　文字サイズ
-------------------------------------------------*/
.tx11 {font-size: 11px;}
.tx12 {font-size: 12px;}
.tx13 {font-size: 13px;}
.tx14 {font-size: 14px;}
.tx15 {font-size: 15px;}
.tx16 {font-size: 16px;}
.tx17 {font-size: 17px;}
.tx18 {font-size: 18px;}
.tx19 {font-size: 19px;}
.tx20 {font-size: 20px;}
.tx21 {font-size: 21px;}
.tx22 {font-size: 22px;}
.tx23 {font-size: 23px;}
.tx24 {font-size: 24px;}
.tx25 {font-size: 25px;}
.tx26 {font-size: 26px;}
.tx27 {font-size: 27px;}
.tx28 {font-size: 28px;}
.tx29 {font-size: 29px;}
.tx30 {font-size: 30px;}


/*　　　　色
-------------------------------------------------*/
.red {color: #C00;}
.blue {color: #36C;}
.green {color: #396;}
.orange {color: #F60;}
.pink {color: #F39;}



/*　　　　Youtube埋め込み　可変用
-------------------------------------------------*/

.movie {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}


.movie iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 1px;
	text-align: center;
}


.movie-wrapper {
	width: 950px;
	max-width: 100%;
	margin: 20px auto;
}

	
@media screen and (max-width: 600px){
    .movie-wrapper {
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
}
    }



/*　　問い合わせボタン
-------------------------------------------------*/

.bt {
	text-align: center;
	margin: 50px auto;
}

.button {
	position: relative;
	border-radius: 4px;
	color: #fff;
	line-height: 50px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-transition: none;
	transition: none;
	text-shadow: 0px 1px 0px #f56778;
	padding: 10px 100px;
	text-decoration: none;
	font-size: 40px;
}

@media only screen and (max-width: 640px) {
	
.bt {
	text-align: center;
	margin: 20px auto;
}

.button {
	position: relative;
	border-radius: 4px;
	color: #fff;
	line-height: 50px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-transition: none;
	transition: none;
	text-shadow: 0px 1px 0px #f56778;
	padding: 10px 30px;
	text-decoration: none;
	font-size: 20px;
}	
}

.button,
.button:hover {
	border-bottom: 4px solid #cb5462;
	background-color: #f56778;
	background-image: -webkit-linear-gradient(top, #f997b0, #f56778);
	background-image: linear-gradient(to bottom, #f997b0, #f56778);
	box-shadow: inset 1px 1px 0 #fbc1d0;
}

.button::before,
.button::after {
	bottom: -1px;
	left: -1px;
	width: 200px;
	height: 50px;
	border: 1px solid #ee8090;
	border-bottom: 1px solid #b84d5a;
	border-radius: 4px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	-webkit-transition: none;
	transition: none;
}
.button::before {
	height: 48px;
	bottom: -4px;
	border-top: 0;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 1px 1px 0px #bfbfbf;
}
.button:hover {
	background: #f56778;
	background-image: -webkit-linear-gradient(top, #f56778, #f997b0);
	background-image: linear-gradient(to bottom, #f56778, #f997b0);
	color: #913944;
	text-shadow: 0px 1px 0px #f9a0ad;
}
.button:active {
	bottom: -4px;
	margin-bottom: 4px;
	border: none;
	box-shadow: 1px 1px 0 #fff, inset 0 1px 1px rgba(0, 0, 0, .3);
}
.button:active::before,
.button:active::after {
	border: none;
	box-shadow: none;
}





/*　　お問い合わせタイトル
------------------------------------------------------*/

.form_ttl {
	text-align: center;
	font-size: 28px;
	font-weight: bold;
}

@media only screen and (max-width: 640px) {
	.form_ttl {
		text-align: center;
		font-size: 20px;
		font-weight: bold;
		}
}


/*　　お問い合わせテーブル
------------------------------------------------------*/


#contact table {
	width: 75%;
	border-collapse: collapse;
	font-size: 17px;
	margin: 0 auto;
}

#contact th.t_top {
    border-top: #e3e3e3 1px solid;
}

#contact th {
	border-bottom: #e3e3e3 1px solid;
	border-left: #e3e3e3 1px solid;
	text-align: left;
	background: #f7f7f7;
	padding: 10px 15px;
	font-weight: normal;
	text-align: center;
	width: 250px;
}

#contact td.t_top {
	border-top: #e3e3e3 1px solid;
}

#contact td {
	border-bottom: #e3e3e3 1px solid;
	border-right: #e3e3e3 1px solid;
	text-align: left;
	padding: 10px;
}

#contact input[type="text"],
textarea {
    padding: 0.3em;
    outline: none;
    border: 1px solid #DDD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 17px;
}


#contact input[type="text"]:focus,
texture:focus {
    box-shadow: 0 0 7px #3498db;
    border: 1px solid #3498db;
}

.tbox:focus {
    box-shadow: 0 0 7px #3498db;
    border: 1px solid #3498db;
}



input.push {
    border-radius: 0;   
    background: -moz-linear-gradient(top, #FFF 0%, #EEE);
    background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE));
    border: 1px solid #DDD;
    color: #111;
    padding: 10px 30px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
	margin: 20px auto 40px;
}

input.push:hover {
    background: -moz-linear-gradient(top, #EFEFEF 0%, #EEE);
    background: -webkit-gradient(linear, left top, left bottom, from(#EFEFEF), to(#EEE));
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:#ccc;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color:#ccc;
}
::placeholder{ /* Others */
 color:#ccc
}




@media only screen and (max-width: 640px) {
	
#contact table {
	width: 95%;
	border-collapse: collapse;
	font-size: 18px;
	margin: 0 auto;
}

#contact th.t_top {
    border: none;
	width: 95%;
	display: block;
}

#contact th {
    border: none;
	text-align: left;
	background: #F0F0F0;
	padding: 10px 15px;
	font-weight: normal;
	text-align: center;
	width: 95%;
	display: block;
}

#contact td.t_top {
    border: none;
	width: 95%;
	display: block;
}

#contact td {
    border: none;
	text-align: left;
	padding: 10px;
	width: 95%;
	display: block;
  
}