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

/*----------------------------------------
print
----------------------------------------*/

.p_on {
display:none;
}


/*----------------------------------------
cmn
----------------------------------------*/

html, body {
	width: 100%;
}
body {
	font-family: Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	display: none;
}

body.popup {
	background-color:transparent!important;
}
.box_pc , .box_sp {
	display:block;
}

.text_comingsoon {
	text-align:center;
	color:#494a50;
	font-size:100%;
	margin-bottom:6%;
}
.tume{
	letter-spacing: .5px;
}

@keyframes RightToLeft {
  0% {
    opacity: 0;/* 透明 */
    transform: translateX(50px);/* X軸方向に50px */
  }
  100% {
    opacity: 1;/* 不透明 */
    transform: translateX(0);
  }
}

@keyframes SlideUp {
  0% {
    opacity: 0;/* 透明 */
    transform: translateY(100px);/* Y軸方向に50px */
  }
  100% {
    opacity: 1;/* 不透明 */
    transform: translateX(0);
  }
}




/*----------------------------------------
margin
----------------------------------------*/
.mb_30{
	margin-bottom:30px; 
}

.mb_40{
	margin-bottom:40px; 
}



/*----------------------------------------
ipad
----------------------------------------*/
body.iPad  {
	_display: inline;
	_zoom: 1;
}

ul {
	letter-spacing: -0.40em;
}
li {
	letter-spacing: normal;
	line-height: 1.6em;
}
p{
	font-size: 14px;
	color: #48494f;
	font-feature-settings: 'palt';
}
dd, p {
	line-height: 1.8em;
	letter-spacing: 1px;
}
.inner {
	max-width: 100%;
	margin: 0px auto;
}
.text-narrow{
 white-space: nowrap;
 transform: scale(.9, 1);
 transform-origin: top left;
}
a , a:visited , a:link{
	color: black;
    cursor: pointer;	
	text-decoration: none; 
}

a.linkbutton{
	display: block;
	padding: 7px 10px;
	border-radius: 3px;
	background: #c7c7c7;
	width: 240px;
	text-decoration: none;
	text-align: center;
	font-size: 0.9em;
	transition: 0.3s;
	font-weight: bold;
	color: #37383c;
}

a.linkbutton:hover{
	background: #59534f;
	color: #ffffff;
}

#wrapper{
	position: relative;
	background: #ffffff;
}

#contents {
	margin-bottom:40px;
}


.note {
	font-size:65%;
	color:#666;
}
.scrollup {
    bottom: 20px;
    position: fixed;
    right: 0px;
    z-index: 3000;
}

.scrollup img {
	
	max-width:75px;
}

.tablet #breadclumbs li a {
	background-position:left 1px;
}



/*----------------------------------------
header
----------------------------------------*/
.box_pc , .box_sp{
	display: block;
	position: fixed;
	top: 0;
	z-index: 2000;
	width: 100%;
	border-bottom: 1px solid #cccccc;
 -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
transform: translate3d(0, 0, 0);
}

.b_white{
	z-index: 120;
	position: relative;
	background: #ffffff;
}

.logo_haseko {
	width:129px;
	float:left;
}

.hlogo {
	padding:16px 0 0;
}

#header .inner {
	max-width:1000px;
	margin:0px auto;
	position: relative;
	height: 55px;
}


#siteid {
	position:absolute;
	top:0px;
	left:0px;
	z-index:100;
	width:20%;
}
#siteid img {
	vertical-align: top;
}

img.main_catch{
	width: 35%;
	position: absolute;
	top: auto;
	z-index: 120;
	margin: auto;
	top: 40%;
left: 0;
right: 0;
bottom: 0;
 animation-duration: 1s;/* アニメーション時間 */
  animation-name: SlideUp;/* アニメーション名 */
}


.box_gnav {
	clear:both;
	border-top: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	background: #ffffff;
	z-index: 120;
	position: relative;
}

#gnav {
	width:80%;
	position: relative;
	top: 0;
float: right
}

#gnav ul{
	width:710px;
float: right;
	text-align: right;
}

#gnav li {
	display:inline-block;
	margin: 2px 40px 0 0
}

#gnav li:last-child{
	margin: 0;	
}

.ie7 #gnav li {
	width:20%;
}

#gnav li a {
	display:block;
	text-decoration: none;
	position: relative;
	font-weight: bold;
}

#gnav li a:before{
	transition: 0.3s;
	content: '';
	width: 2px;
	height: 35px;
	background: #ff337c;
	position: absolute;
	top:-1px;
	left: -10px;
	opacity: 0;
}

#gnav li a:hover:before{
	opacity: 1;
}



#gnav li a span{
	display: block;
}


#gnav li a:hover {
	display:block;
/*		border-bottom:5px solid #c73576;*/
}



/*----------------------------------------
footer
----------------------------------------*/

.copyright {
	text-align:center;
	background-color:#686868;
	color:#fff;
	font-size:0.6em;
	padding:5px 0px;
	z-index: 120;
	position: relative;
}


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

.hlogo {
	padding-left:20px;
}
	
	#gnav ul{
			padding-right:20px;
	}

}

/*--- 960px タブレット ▶︎ PC --------------------*/
@media screen and (min-width: 961px) {
		.box_sp{display: none;}
}

@media screen and (max-width: 960px) {
	.box_pc{display: none;}
img.main_catch{
	width: 300px;
}
.hlogo {
	padding:10px ;
}
#header .inner {
	height: 36px;
}	
}
/*--- 768px SP横 ▶︎ タブレット --------------------*/
@media screen and (min-width: 769px) {
    .sp{display: none;}
}
@media screen and (max-width: 768px) {
.pc{display: none;}
}
/*--- 600px SP横 ▶︎ タブレット --------------------*/
@media screen and (max-width: 600px) {
	#header {
	position:relative;
}
#btn_gnav_sp {
	position:absolute;
	right:0px;
	top:0px;
	width:14.0625%;
}
#btn_gnav_sp a {
	display:block;
}
.box_gnav {
	position:relative;
}
img.main_catch{
	width: 70%;
}
}

/*--- 480px SP縦 ▶︎ SP横 --------------------*/
@media screen and (max-width:480px) {

img.main_catch{
	width: 80%;
}
	


}