@media only screen and (max-width:768px) {

.theme {
    margin-top: 30px;
    width: 280px;
}
#wrapper {
  overflow: hidden;
  line-height: 1.5;
  box-sizing: border-box;
  margin: 0 auto;
	padding: 0 5px;
}
#back {
    background-image: url(/assets/images/back.jpg);
}

img,.top img{
  width:100%;
	height: auto;
}
.header{
  background-color: #000000;
  color: #ffffff;
  text-align: center;
  padding-top: 10px;
  font-size: 20px;
  font-weight: normal;
}
.top-inner {
  text-align: center;
}
.head{
	width: 100%;
	background-color: #000000;
	color: #ffffff;
	font-size: 25px;
	font-family: 江戸勘亭流;
	text-align: center;
}
.head p{
	font-size: 50px;
}
.items{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	align-items:center;
}
.item {
	background-color: #fff;
	box-sizing: border-box;
	border: 1px solid #ccc;
	margin: 20px;
	width: 100%;
  text-align: center;
}
.item img {
	padding: 10px;
	margin-top: 10px;
	vertical-align: bottom;
}
.item2{
	background-color: #fff;
	box-sizing: border-box;
	border: 1px solid #ccc;
	margin: 20px;
	width: 100%;
}
.item2 img {
	padding: 10px;
	margin-top: 10px;
	vertical-align: bottom;
}
.item p,.item2 p{
	margin: 20px;
}




.name {
	font-size:15pt;
  font-weight: bold;
	color:#000000;
	text-align:center;
}
.tex-cen {
  text-align: center;
}
.discription{
	line-height:20px;
	margin-top:20px;
  text-align: left;
}
center img{
	margin-top: 50px;
}
.theme{
	font-size: 40px;
	border-bottom: dotted 4px grey;
}
a {
	color:#0000cd;
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
.story{
	margin: 15px 0 15px 17px;
	width: 300px;
	padding: 40px;
	background-color: #ffffff;
}
.first{
	font-size:16px;
}
.button02{
	margin-bottom: 20px;
}
.button02 a {
	text-decoration: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	padding: 1em 2em;
	width: 300px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	background-color: #ff0000;
	border-radius: 50vh;
}
.button02 a::after {
	content: '';
	width: 5px;
	height: 5px;
	border-top: 3px solid #333333;
	border-right: 3px solid #333333;
	transform: rotate(45deg);
}
.button02 a:hover {
	text-decoration: none;
	background-color: #ff4500;
}
.button03 a {
	text-decoration: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 auto;
	padding: 1em 2em;
	width: 300px;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	background-color: #0000ff;
	border-radius: 50vh;
}
.button03 a::after {
	content: '';
	width: 5px;
	height: 5px;
	border-top: 3px solid #333333;
	border-right: 3px solid #333333;
	transform: rotate(45deg);
}
.button03 a:hover {
	text-decoration: none;
	background-color: #0000cd;
}
.login-img {
	text-align: center;
	margin-top: 10px;
}
footer a {
	text-decoration: none;
	color:#ffffff;
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}
#footer {
  margin-top: 40px;
}
#bottom_nav {
	width: 90%;
	margin: 10px auto;
}
ul.foot-nav {
	border-radius: 10px;
}
ul.foot-nav li {
	font-size: 12pt;
	line-height: 1.5;
	height:30px;
	padding: 5px;
	border-bottom: solid #fff 1px;
	background: -moz-linear-gradient(top, #70a3d0, #2a557a);
	background: -webkit-linear-gradient(top, #70a3d0, #2a557a);
	background: linear-gradient(to bottom, #70a3d0, #2a557a);
}
ul.foot-nav li a {
	padding-left: 5px;
	color: #fff;
}
ul.foot-nav li:nth-child(1) {
}
ul.foot-nav li:last-of-type{
	border: none;
}
.foot-be {
	display: block;
	padding: 15px;
	margin: 5px 0px;
	text-align: center;
	background: #deb887;
}
.copy {
	text-align: center;
	padding: 10px;
}
.t-about {
  background-color: #e9967a;
  font-size: 12pt;
  padding: 20px;
  border: solid #f08080 3px;
  border-radius: 10px;
  margin:10px;
}
figure.touroku-border img{
	width: 95%;
	margin: 30px 0 30px 10px;
}
.touryokumuryou-img{
	margin: 0 0 30px 10px;
	width: 95%;
}
h1.cotitle {
	padding: 10px 10px 10px 20px;
  background:#f5b199;
  line-height: 1.5em;
}
h2.cotitle {
  padding: .2em .5em;
  background: #FCD4D5;
  border-left: 6px solid #a22041;
  margin: 30px 0 20px 0;
  font-size: 13pt;
}
.content-area {
	background-color: #ffffff;
}
.content-area p{
	line-height: 1.5;
  padding-bottom: 10px;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 12pt;
  padding: 0 15px 10px 15px;
}
.sasie-img {
  text-align: center;
  margin: 20px 0px;
}
.sasie-img img{
	vertical-align: bottom;
}
.text-weit {
  font-weight: bold;
}
.topic1 {
  margin-top: 30px;
}
/*checkbox*/
.check-btn  {
  display: inline-block;
  line-height: 1.5;
}
/**/
.pb20 {
  padding-bottom: 20px;
}
.pt20 {
  padding-top: 20px;
}
.anc-deco  {
  border: solid 1px #000;
  border-radius: 3px;
  background-color:#ffe4e1;
  text-align: center;
  margin: 30px auto;
  width: 200px;
  height: auto;
}
.can-waku {
  border: 2px solid #696969;
  padding: 10px;
  border-radius: 5px;
}
.rogo-img {
  width: 80px;
  padding: 0 5px 9px 0;
}





.danraku{
	padding-bottom:10px;
}
.next {
	margin: 10px 0 0 15px;
}
/*トグル表示ボタン*/
.toggle-wrap .toggle-button {
  display: block;
  cursor: pointer;
  background-color: #fff;
  margin-bottom: 1em;
}
.toggle-wrap .toggle-button:hover {
  color: #e95464;
}
.toggle-wrap .toggle-content,
.toggle-wrap > input[type="checkbox"] {
  display: none;
}
.toggle-wrap > input[type="checkbox"]:checked ~ .toggle-content {
  display: block;
}
/*退会関連ボタン*/
.btn-box {
  text-align: center;
}
.btn-box a {
  text-decoration: none;
}
.btn-box p,.btn-deco {
  padding: 5px;
  border: solid 1px #000;
  border-radius: 3px;
  display: inline-block;
  margin:0 auto;
  background-color:#ffe4e1;
}
.mbt30 {
  margin:30px 0;
}
.label {
  margin-left:10px;
}
/*アンケート*/
h2.cotitle2 {
  color: #ffffff;
  font-size: 15px;
  text-align: center;
  padding:5px;
  margin-bottom:10px;
  background-color: #B70004;
}
.form-text{
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.428571429;
  color: #555;
  vertical-align: middle;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
/*退会ログインID入力ページ*/
.can-p{
    font-weight: bold;
    font-size: 13pt;
    padding: 20px 0;
}
dl.Form-Item {
  padding: 5px 0;
  width: 100%;
  align-items: center;
  display: flex;
  display:-webkit-box;
  display:-webkit-flex;
  display:-ms-flexbox;
}
input[type="Form-Item-Input"] {
  border: 1px solid #696969;
  border-radius: 6px;
  padding: 0  1em;
  height: 35px;
  flex: 1;
  max-width: 150px;
  background: #eaedf2;
  font-size: 13pt;
}
.Form-Item-Label {
  width: 20px;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-size: 13pt;
}
.Form-Item dd { margin-left: 40px;}
.Form-Item-Input { width: 100%; }






}