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

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

@font-face {
	font-family: 'popfont';
	src: url(../font/pop.ttf);
	src:
}

@font-face {
	font-family: 'popfont';
	src: url('webfont.eot');
}

body {
	font-family: 'popfont';
}


html {  
    background: #000;  
}  
body {  
    background: #FFF;  
}  

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 {
	background:rgba(255, 234, 0, 0.5);
}
 
::-moz-selection {
	background:rgba(255, 234, 0, 0.5);
}

/*----------  zoom   -----------*/

.zoom-img li {
	overflow:hidden;
	display:block;
	margin-bottom:10px;
}

.zoom-img li img {
	-moz-transition: -moz-transform 0.5s linear;
	-webkit-transition: -webkit-transform 0.5s linear;
	-o-transition: -o-transform 0.5s linear;
	-ms-transition: -ms-transform 0.5s linear;
	transition: transform 0.5s linear;
}

.zoom-img li img:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
	cursor:pointer;
}

/*----------  side-nav   -----------*/

.side-navi {
	position:fixed;
	z-index:1;
}

.side-navi p {
	margin:20px 0;
	padding-right:25px;
	-webkit-border-top-right-radius: 20px;  
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-radius-topright: 20px;
	-moz-border-radius-bottomright: 20px;
	
}


.side-navi p a {
	width:100%;
	text-decoration:none;
	padding:13px 10px 13px 20px;
	color:#00A0E9;
	background:rgba(255,234,0,0.8);
	-webkit-border-top-right-radius: 20px;  
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-radius-topright: 20px;
	-moz-border-radius-bottomright: 20px;
	display:block;
	-moz-transition: -moz-transform 0.2s linear;
    -webkit-transition: -webkit-transform 0.2s linear;
    -o-transition: -o-transform 0.2s linear;
    -ms-transition: -ms-transform 0.2s linear;
    transition: transform 0.2s linear;
}

.side-navi p a:hover {
	opacity: 0.9;     /* 透過レベル */
    filter: alpha(opacity=90);
	-webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
}

.side-navi p a.engrish {
	background:rgba(0,160,233,0.8);
	color:#FF0;
}


/*----------  page-body   -----------*/
.page-body {
	width:100%;
	height:auto;
	margin:0 auto;
	overflow:hidden;
	clear:both;
}

/*----------  footer   -----------*/
.footer {
	width:100%;
	height:250px;
	background:#000000;
	padding:0 0 20px 0;
	border-top:solid 1px #FFF;
	clear:both;
	position:relative;
}

.footer-in {
	margin:0 auto;
}

ul.footer-list {
	margin-left:50px;
}

ul.footer-list li {
	float:left;
	margin:15px;
	margin-left:-15px;
	border-left:solid 1px #FFF;
}

li.footer-right-list {
	border-right:solid 1px #FFF;
}

.footer-list a {
	font-size:11px;
	margin:0 20px;
	color:#FFFFFF;
	text-decoration:none;
}

.footer-list a:hover {
	color:#FFEA00;
}

.information {
	color:#FFF;
	position:absolute;
	bottom:10px;
	margin-left:30px;
}

p.c-name {
	font-size:14px;
}

p.address {
	font-size:11px;
	margin-top:5px;
	margin-bottom:5px;
}

p.phone-number {
	font-size:17px;
	text-decoration:none;
	color:#FFF;
}

p.copyright {
	color:#FFF;
	position:absolute;
	bottom:10px;
	right:30px;
	font-size:11px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:bold;
}

/* smartphone  */
@media screen and (max-width:480px){
	
	.side-navi {
	width:100%;
	padding-top:0px;
	position:static;
	}

	.side-navi p {
	margin:0;
	padding:0;
	}

	.side-navi p a {
	width:50%;
	text-decoration:none;
	padding:15px 0;
	margin:-1px;
	text-align:center;
	float:left;
	color:#00A0E9;
	border:solid 1px #00A0E9;
	background:rgba(255,234,0,0.9);
	-webkit-border-top-right-radius:0px;  
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-topright:0px;
	-moz-border-radius-bottomright:0px;
	}
	
	.side-navi p a.contact-f {
	width:100%;
	}

	.side-navi p a:hover {
	opacity: 0.9;     /* 透過レベル */
    filter: alpha(opacity=90);
	-webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
	}
	
	.footer-in {
	}
	
	ul.footer-list {
	height:150px;
	margin-left:0;
	}
	
	ul.footer-list li {
	float:none;
	padding:15px;
	margin:0;
	border-left:none;
	border-bottom:solid 1px #FFF;
	}

	li.footer-right-list {
	border-right:none;
	}
	
	.footer-list a {
	font-size:14px;
	display:block;
	}
	
	.information {
	color:#FFF;
	position:static;
	padding-top:70px;
	margin-left:30px;
	}
	
	
	p.copyright {
	position:static;
	margin-left:30px;
	padding-bottom:15px;
	}
}

/* tablet */
@media screen and (min-width:481px) and ( max-width:768px) {
	.side-navi {
	width:100%;
	position:static;
	
	padding-top:0px;
	}

	.side-navi p {
	margin:0;
	padding:0;
	}


	.side-navi p a {
	width:50%;
	text-decoration:none;
	padding:15px 0;
	margin:-1px;
	text-align:center;
	float:left;
	color:#00A0E9;
	border:solid 1px #00A0E9;
	background:rgba(255,234,0,0.9);
	-webkit-border-top-right-radius:0px;  
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-topright:0px;
	-moz-border-radius-bottomright:0px;
	}
	
	.side-navi p a.contact-f {
	width:100%;
	}

	.side-navi p a:hover {
	opacity: 0.9;     /* 透過レベル */
    filter: alpha(opacity=90);
	-webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -o-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
	-webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
	}
}

/* below 769px~1170px */
@media screen and (min-width:769px) and ( max-width:1170px) {
	.side-navi p {
	margin:20px 0;
	padding-right:5px;
	font-size:14px;
	}


	.side-navi p a {
	width:100%;
	text-decoration:none;
	padding:13px 1px 13px 20px;
	color:#00A0E9;
	background:rgba(255,234,0,0.8);
	}

}

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