@charset "utf-8";
@import url("common.css");


/*------------------------------------
	.basic
-----------------------------------------------------------------------------------------------------*/
* {
	margin: 0;
	padding: 0;
}

header,
footer,
nav,
section,
article {
	display: block;
}

body, div, ol, ul, dl, form {
	margin: 0;
	padding :0;
	list-style: none;
}

body {
	width: 100%;
	color: #333;
	font: normal 100% sans-serif;
	line-height: 1.8;
	font-size: 14px;
	background: url(../images/bg.gif) repeat;
}

p, h1, h2, h3, h4, h5, h6, dt, dd, input, textarea {
	font-size: 100%;
	margin: 0;
	padding: 0;
}

img {	border: 0;}

.clearfix:after {
  content: ".";
  display: block;  
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

a:link {
	color: #03F;
	text-decoration: underline;
}

a:visited {
	color: #03F;
	text-decoration: none;
}

a:hover {
	color: #03F;
	text-decoration: underline;
}

a:active {
	color: #03F;
	text-decoration: none;
}

a:hover img,
.cs_box .sn a:hover {
 	opacity: 0.8;
	filter: alpha(opacity=80);
 	-moz-opacity: 0.8;
}

#container {
	width: 950px;
	margin: 0 auto;
	padding: 0;
	background: #fff;
	overflow: hidden; /*スマホで幅を戻す為の指定*/
	box-shadow: 0 3px 6px #333;
}

header {
	margin: 0 auto !important;
	padding: 0 10px;
	position: relative;
}

h1,
h1 img {
	display: block;
	margin: 3px auto 20px !important;
	padding: 0;
	line-height: 0 !important;
	text-align: center !important;
}

article {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width: 80%;
	margin: 0 10%;
	padding: 3% 0 1px;
	text-align: left;
	background: #fff;
}

article section {
	clear: both;
}

section {
	margin: 0;
}

section p {
}

h2 {
	font-weight: bold;
	font-size: 110%;
	margin-bottom: 10px;
	padding: 8px 5px;
	background: #030303;
	color: #fff;
}

h2 span {
	border-left: solid 4px #ff50a8;
	padding-left: 10px;
}

dl.plan {
	margin-bottom: 20px;
	border: solid 1px #ccc;
	border-right: none;
}

dl.last {
	border-right: solid 1px #ccc;
}

dl.plan dt {
	background: #dfebeb;
	padding: 5px;
	font-weight: bold;
	border-bottom: solid 1px #ccc;
}

dl.plan dd {
	padding: 5px;
}

.cs_box {
	border-top: solid 1px #ccc;
	border-left: solid 1px #ccc;
}

.cs_box .cc {
	padding: 15px;
	text-align: center;
	font-weight: bold;
	color: #4c7ca4;
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
}

.cs_box .sn {
	padding: 15px;
	border-right: solid 1px #ccc;
	border-bottom: solid 1px #ccc;
}

.cs_box .sn a {
	display: block;
	width: 70%;
	margin: 0 auto;
	text-align: center;
	background: #4c7ca4;
	color: #fff !important;
	text-decoration: none;
	border-radius: 5px;
}


.cttl {
	padding: 5px;
	font-weight: bold;
	font-size: 110%;
	background: #dfebeb;
	border: solid 1px #ccc;
}

dl.ym {
	clear: both;
	border: solid 1px #ccc;
	border-top: none;
}

dl.ym dt {
	background: #ffc;
	padding: 5px;
	font-weight: bold;
	border-bottom: solid 1px #ccc;
}

dl.ym dd {
	height: 5.4em !important;
	padding: 5px 5px 0;
	border-right: solid 1px #ccc;
	border-radius: 0 !important;
}

dl.ym dd.dl {
	border: none;
}

dl.ym dd span {
 color: #002ad9;
}

dl.ym dd.btn {
	text-align: center;
	padding-top: 1.4em;
}

.mouth {
	clear: both;
	text-align: right !important;
	margin: 10px 0 20px 0;
}

.mouth select {
	background: #eee;
	padding: 2px 0;
	font-size: 80%;
	border: solid 1px #ccc;
	border-radius: 5px;
}

.page-top {
	text-align: right;
	margin-bottom: 20px;
}


footer{
	height:auto !important;
	height:1px;
	margin-bottom:0;
	text-align:center;
}
	
footer #fotternav{
	font-size:85%;
	text-align:center;
	color:#666666;
	margin-bottom:5px;
}

footer #fotternav a:link{color:#666666;}

footer #fotternav a:hover{color:#ff64ca;}

#copyright{
	margin: 0 auto;
	padding: 45px 0 8px 0;
	font-size: 85%;
	color: #FFFFFF;
	line-height: 160%;
	background: url(../images/footer_bg.gif) center top no-repeat #000;
}

#copyright p span {
	color:#ff64ca;
}
p.clistT {
	margin-top: 1em;
}
dl.clist {
	clear: both;
	border: solid 1px #ccc;
	border-top: none;
}

dl.clist dt {
	background: #ffc;
	padding: 5px;
	font-weight: bold;
	border-bottom: solid 1px #ccc;
}

dl.clist dd {
	height: 45px !important;
	padding: 5px 5px 0;
	border-right: solid 1px #ccc;
	border-radius: 0 !important;
}

dl.clist dd.dl {
	border: none;
}

dl.clist dd span {
 color: #002ad9;
}

dl.clist dd.btn {
	text-align: center;
}

@media screen and (max-width: 768px) {
#container {
	width: 100%;
}

h1,
h1 img {
	width: 100%;
}

article {
	width: 90%;
	margin: 0 5%;
}

section {
	margin: 0 0 30px;
}

footer #fotternav{
	font-size: 70%;
	margin: 0 10px;
}

#copyright {
	padding: 45px 10px 3px;
	font-size: 70%;
}
}


@media screen and (max-width: 640px) {
header img.logo {
	display: block;
	width: 40%;
}

dl.plan {
	margin-bottom: 0;
	border: solid 1px #ccc;
	border-bottom: none;
}

dl.last {
	border-bottom: solid 1px #ccc;
}

.cs_box {
	margin-top: 20px;
}

.cs_box .cc {
/*
	border-right: none;
	border-bottom: solid 1px #ccc;
*/
}

dl.ym {
	border: solid 1px #ccc;
	border-top: none;
}

dl.ym dt {
	border-bottom: solid 1px #ccc;
}

dl.ym dd {
	height: auto !important;
	padding: 7px !important;
	border-right: none;
	border-bottom: solid 1px #ccc;
}

dl.ym dd.dl {
	border: none;
}

dl.clist {
	border: solid 1px #ccc;
	border-top: none;
}

dl.clist dt {
	border-bottom: solid 1px #ccc;
}

dl.clist dd {
	border-right: none;
	border-bottom: solid 1px #ccc;
}

dl.clist dd.dl {
	border: none;
}

}

@media screen and (max-width: 480px) {

}