@charset "UTF-8";
/* CSS Document */

* {
	margin:0;
	padding:0;
	list-style:none;
}

html {
   background: url(../img/backgrond.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
 
}

div {
	display:block;
}

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

.hover {
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
	-ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
 
.hover:hover {
    opacity: 0.6;     /* 透過レベル */
    filter: alpha(opacity=60);
}

::selection {
	color:#FFF;
	background:rgba(255, 153, 255, 0.5);
}
 
::-moz-selection {
	color:#FFF;
	background:rgba(255, 153, 255, 0.5);
}

a img {
    border-style:none;
}

.center {
	text-align:center;
}

/*----------  menu   -----------*/

.menu {
	width:100%;
	background:#000;
	overflow:hidden;
}

h2.top-logo {
	margin-top:20px;
	text-align:center;
}

#menu {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 0;
}
#menu li{
	display: block;
	float: left;
	width: 16.6%;
	margin: 0;
	padding:10px 0;
}

#menu li.left-line a  {
	border-left:1px solid #FFF;
}

#menu li.right-line a {
	border-right:1px solid #FFF;
}

#menu li a {
	display: block;
	padding:5px 0;
	background-color: #000;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	font-size:14px;
	border-right:1px solid #FFF;
}

#menu li a:hover{
	background: #FF367F;
	color:#FFCCFF;
}

/*----------  page-body   -----------*/
.page-body {
	max-width:960px;
	margin:0 auto;
	clear:both;
	margin-top:50px;
}

/*----------  p-list   -----------*/
.p-list {
	max-width:960px;
	margin:0 auto;
	margin-top:20px;
	color:#FFF;
	font-size:12px;
}

.p-list a {
	color:#FFF;
	text-decoration:none;
}

.p-list a:hover {
	color:#F00;
}

/*----------  heading   -----------*/
h1.heading {
	font-size:25px;
	margin-top:15px;
	text-align:center;
	color:#FFF;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

/*----------  mail-m   -----------*/
.voice-top {
	width:100%;
	display:block;
	margin:30px 0;
}

.voice-top p {
	width:90%;
	text-align:center;
	margin:0 auto;
}

.voice-top p img {
	width:100%;
}

.page-body-m {
	max-width:960px;
	margin:0 auto;
	margin-top:50px;
	background:rgba(255, 255, 255, 0.8);
	border:solid 1px #D166AA;
	border-radius:10px;
	overflow:hidden;
}

.page-body-m h2 img {
	width:100%;
}

.mail-w {
	padding-bottom:50px;
}

.mail-m {
	width:80%;
	margin:0 10%;
	overflow:hidden;
}

.mail-m:hover {
	opacity: 0.6;     /* 透過レベル */
    filter: alpha(opacity=60);
	cursor:pointer;
	-webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
	-ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.mail-m p {
	width:33%;
	float:left;
}



/*----------  footer   -----------*/
.footer {
	width:100%;
	background:#000;
	margin-top:80px;
	clear:both;
}

.pagetop {
	width:180px;
	height:40px;
	position:relative;
    top: -95px;
    left: 760px;
	padding:10px;
	text-align:center;
	background:#000;
	-webkit-border-top-left-radius: 10px;  
    -webkit-border-top-right-radius: 10px;  
	-moz-border-radius-topleft: 10px;  
    -moz-border-radius-topright: 10px;
}

.pagetop a {
	color:#FFF;
	text-decoration:none;
}

.pagetop a:hover {
	color:#D166AA;
}

.footer-in {
	max-width:960px;
	margin:0 auto;
	padding:50px 0 0 0;
	color:#FFF;
	position:relative;
}

.footer-name {
	width:100%;
}

.footer-name h3 {
	width:450px;
    line-height: 40px;
    position: absolute;
    top: 30px;
    letter-spacing:2px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;	
}

.footer-name hr {
	margin-left:350px;
}

.footer-info {
	width:65%;
	display:table;
	float:right;
	margin-top:-40px;
	margin-bottom:30px;
}

.footer-info p {
	display:table-cell;
	font-size:13px;
	padding:0;
}

.footer-info p.address {
	width:33%;
}

.footer-info p.tel {
	width:33%;
}

.footer-info p.contact {
	width:33%;
}
.footer-info img.contact {
	width:100%;
	float:right;
}

p.copy-right {
	clear:both;
	font-size:13px;
	text-align:center;
	padding:10px;
}

/* smartphone  */
@media screen and (max-width:480px){
	.page-body {
	margin:0 3%;
	margin-top:25px;
	}
	
	.top-logo {
	width:80%;
	margin-left:10%;
	}
	
	.top-logo img {
	width:100%;
	}
	
	#menu li {
	width: 33.3%;
	border-bottom: 1px solid #FFF;
	}
	
	#menu li a {
	font-size:12px;
	}
	
	#menu li.left-line a {
	border-left:none;
	}

	#menu li.right-line a {
	border-right:none;
	}
	
	.p-list {
	width:90%;
	margin-left:5%;
	}
	
	h1.heading {
	width:90%;
	margin-left:5%;
	}
	
	.page-body-m {
	margin:0 3%;
	margin-top:50px;
	}
	
	.pagetop {
	position:relative;
    top: -135px;
    left: 50%;
	margin-left:-100px;
	padding:10px;
	}
	
	.mail-m {
	width:80%;
	margin:0 10%;
	overflow:hidden;
	}

	.mail-m p {
	width:80%;
	margin:0 10%;
	float:none;
	}
	
	.footer-name h3 {
	width:auto;
	position:inherit;
	text-align:center;
	font-size:15px;
	font-weight:bold;
	margin-left:0;
	}
	
	.footer-name hr {
	display:none;
	}
	
	.footer-in {
	width:90%;
	margin:5% 5% 0 5%;
	}
	.footer-info {
	width:100%;
	}
	
	.footer-info p {
	display:block;
	text-align:center;
	font-size:14px;
	}
	
	img.contact {
	width:50%;
	margin:3% 25%;
	float:right;
	}
	
	.footer-info p.address {
	width:100%;
	}

	.footer-info p.tel {
	width:100%;
	}

	.footer-info p.contact {
	width:100%;
	}
	
	.footer-info p.contact img {
	width:70%;
	margin:3% 15%;
	}
}

/* tablet */
@media screen and (min-width:480px) and ( max-width:768px) {
	.page-body {
	margin:0 3%;
	margin-top:30px;
	}
	
	h2.top-logo {
	width:80%;
	margin-left:10%;
	}
	
	h2.top-logo img {
	width:100%;
	}
	
	#menu li {
	width: 33.3%;
	border-bottom: 1px solid #FFF;
	}
	
	#menu li.left-line a {
	border-left:none;
	}

	#menu li.right-line a {
	border-right:none;
	}
	
	.p-list {
	width:90%;
	margin-left:5%;
	}
	
	h1.heading {
	width:90%;
	margin-left:5%;
	}
	
	.page-body-m {
	margin:0 3%;
	margin-top:50px;
	}
	
	.pagetop {
	position:relative;
    top: -135px;
    left: 50%;
	margin-left:-100px;
	padding:10px;
	}
	
	.footer-name h3 {
	width:auto;
	position:inherit;
	text-align:center;
	}
	
	.footer-name hr {
	display:none;
	}
	
	.footer-in {
	width:90%;
	margin:5% 5% 0 5%;
	}
	.footer-info {
	width:100%;
	}
	
	.footer-info p {
	display:block;
	text-align:center;
	font-size:14px;
	}
	
	
	.footer-info p.address {
	width:100%;
	}

	.footer-info p.tel {
	width:100%;
	}

	.footer-info p.contact {
	width:100%;
	}
	
	.footer-info p.contact img {
	width:60%;
	margin:3% 20%;
	}
}

/* below 769px~960px */
@media screen and (min-width:769px) and ( max-width:960px) {
	.p-list {
	width:90%;
	margin-left:5%;
	}
	
	.page-body {
	margin:0 3%;
	margin-top:50px;
	}
	
	.page-body-m {
	margin:0 3%;
	margin-top:50px;
	}
	
	.pagetop {
	position:relative;
    top: -95px;
    left: 70%;
	padding:10px;
	}

	.footer-in {
	width:90%;
	}
	.footer-info {
	width:100%;
	}
}

/* above 960px */
@media screen and (min-width:960px) {
}