/*pc
----------------------------------------------------------------------------------------------*/
.footerLinkArea .wrapper {
    width: 1100px;
    margin: 0 auto;
}
.top_menu_area ul.top_menu li {
    padding: 2em 0;
}
.top_menu_area ul.otherimgLink li img {
    width: 100%;
}
body{
	min-width:980px;
	background: url(../images/bg.jpg) #fff;
	color: #333;
	}

img{
	/*width: 100%;
	height: auto;*/
	}

body > img{
  width: auto;
}

#adtag{
	height: 0;
	overflow: hidden;
	}

#wrapper{
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 999;
	}

article{
	width: 100%;
	margin: 0 auto;
	padding: 0 0 0 0;
	background: none;
	color: #333;
	}

header{
	/*margin: 0 auto;*/
	padding: 0;
	background: #fff;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 1000;
	
	}
@media screen and (max-width: 1170px) {
header{
	position: relative;
	right: 0;
	top: 0;
	left: 0;	
	}
}/**/

	/*header .inner{
		width: 900px;
		padding: 15px;
		}
	header h1{
		float: left;
		margin-right: 40px;
		}
		
	header nav{
		padding-top: 15px;
		float: left;
		}
		header nav ul li{
			float: left;
			}
		header nav ul li span{
			  padding: 0 15px;
			}
		header nav ul li a{
			font-size: 1.0em;
			text-decoration: none;
			}
		header nav ul li a:hover{
			text-decoration: underline;
			}
		header .left_top{
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		}*/

#mainContents{
	width: 100%;
	margin: 0 auto;
	padding-top: 96px;
	}
@media screen and (max-width: 1170px) {
header .left_top{
		display: none;
		}
		#mainContents{
	padding-top: 98px;
	}
}/**/
#mainArea{
	width: 100%;
	margin: 0 auto;
	}
	#mainArea .inner{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		}
		#mainArea .keyvisual {
    width: 100%;
    margin: 0 auto 0;
    padding: 0 0 0 0;
    /*background: url( ../images/180915/main_bg.jpg) center 0;*/
    display: inline-block;
    position: relative;
    overflow: hidden;
    /*background: none;*/
        background-size: auto auto;
    background-size: cover;
}
#mainArea .keyvisual img {
    width: 100%;
}

		#mainArea .keyvisual .bg{
			width: 980px;
			margin: 0 auto;
			padding: 0 0 0 0;
			text-align: center;
			}
		#mainArea .keyvisual .bgfull{
			position: relative;
			width: 100%;
			margin: 0 auto;
			padding: 0 0 0 0;
			text-align: center;
			}
#mainArea .eye{
			position: relative;
	width: 100%;
			margin: 0 auto;
			padding: 0 0 20px 0;
			text-align: center;
	/*height: 610px;*/
			}
			#mainArea .eye img{
	width: 100%;
	height: auto;
			}
#mainArea .eye .area_menu {
			display: flex;
			}
			#mainArea .eye .area_menu ul{
			display: table;
				display: flex;
				flex-wrap: wrap;
			/*position: absolute;
			bottom: 0px;*/
			padding: 8px 0 0px 20px;
			background:rgba(0,0,0,0.2);
				width: 90%;
			}
.area_menu_all{
			/*position: absolute;
	right: 0;*/
	width: 10.1%;
	/*bottom: 0px;*/
	padding:  8px 20px 7px 0;
	background:rgba(0,0,0,0.2);
	text-align: center;
			}
			#mainArea .eye .area_menu ul li{
			    padding: 0px 0;
    width: 10.1%;
    margin-right: 1%;
    margin-bottom: 8px;
				display: inline-block;
				text-align: center;
			}
#mainArea .eye .area_menu ul li a{
			display: block;
				background: url("../images/btn_bg.png") no-repeat 0 0;
	background-size: 100% 100%;
	padding: 10px 0;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
			}

#mainArea .eye .area_menu_all a{
			display: block;
				background: url("../images/btn_red_bg.png") no-repeat 0 0;
	background-size: 100% 100%;
	padding: 0;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	height: 100%;
    box-sizing: border-box;
	    line-height: 44px;
			}
			#mainArea .eye .area_menu ul li img{
			width: 100%;
			height: auto;
			}
			#mainArea .eye .area_menu ul li:hover {  
 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
 -moz-opacity: 0.6;
 -khtml-opacity: 0.6;
}  
#mainArea .eye #eyetit{
	width: 720px;
	margin: 0px auto 0;
	padding-right: 10px;
	padding-top: 50px;
	}
#mainArea .eye #eyetit.eye2{
	width: 720px;
	margin: 0px auto 0;
	padding-right: 10px;
	padding-top: 10px;
	}
#mainArea .eye #eyetit img{
	width: 100%;
	}
#mainArea .eye #main01{
			position:absolute;
	width: 1080px;
	
	bottom: 20px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;

			}
#mainArea .eye #main01.eye3{

	bottom: 0px;


			}
#mainArea .eye #main01 a img:hover{
	 opacity: 0.6;
 filter: alpha(opacity=60);
 -ms-filter: "alpha( opacity=60 )";
 -moz-opacity: 0.6;
 -khtml-opacity: 0.6;
}
#mainArea .eye #main01 img{
	width: 100%;

			}
#mainArea .eye #main02{
			position:absolute;
	width: 1000px;
	
	bottom: 0;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;

			}
@media screen and (min-width: 769px) {

#mainArea .eye .openhouse_banner{
	position:absolute;
    bottom: 130px;
    right: 25px;
    width: 400px;
}
#mainArea .eye .openhouse_banner:hover{
 opacity: 0.7;
 filter: alpha(opacity=70);
 -ms-filter: "alpha( opacity=70 )";
 -moz-opacity: 0.7;
 -khtml-opacity: 0.7;
}
#mainArea .eye .openhouse_checkbox{
    position: absolute;
    bottom: 82px;
    right: 35px;
    width: 360px;
    display: block;
    border-radius: 20px;
    background-color: #d90000;
    color: #FFFFFF;
    font-size: 1.4em;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    padding: 10px 5px 6px;
}

#mainArea .eye .openhouse_checkbox input[type=checkbox] + label {
    position: relative;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] {
    display: none;
    margin: 0;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label {
    padding: 0 0 0 24px;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 16px;
    height: 16px;
    margin-top: -11px;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label::before {
    border: 1px solid #FFFFFF;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox]:checked + label::after {
    content: "";
    position: absolute;
    top: 50%;
     
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox]:checked + label::after {
    left: 3px;
     
    width: 11px;
    height: 6px;
    margin-top: -7px;
     
    border-left: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
     
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
#mainArea .eye .lp_webvr{
    position: absolute;
    left: 5%;
    top: 72%;
    width: 35%;
}
}
@media screen and (max-width: 768px) {
.top_menu_area ul.otherimgLink li img {
    width:auto;
}
	#mainArea .eye .area_menu {
			display:block;
			margin-top: -18px;/* ←20240920 add*/
			}
#mainArea .eye .openhouse_banner{
}

#mainArea .eye .openhouse_checkbox{
    display:block;
    border-radius:20px;
    background-color:#D90000;
    color:#FFFFFF;
    font-size: 140%;
    font-weight: bold;
    text-decoration:none;
    text-align:center;
    padding:7px 0;
    margin:10px auto;
    width:95%;
}

#mainArea .eye .openhouse_checkbox input[type=checkbox] + label {
    position: relative;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] {
    display: none;
    margin: 0;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label {
    padding: 0 0 0 24px;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 16px;
    height: 16px;
    margin-top: -11px;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox] + label::before {
    border: 1px solid #FFFFFF;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox]:checked + label::after {
    content: "";
    position: absolute;
    top: 50%;
     
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
}
#mainArea .eye .openhouse_checkbox input[type=checkbox]:checked + label::after {
    left: 3px;
     
    width: 11px;
    height: 6px;
    margin-top: -7px;
     
    border-left: 2px solid #FFFFFF;
    border-bottom: 2px solid #FFFFFF;
     
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
#mainArea .eye .lp_webvr{
}
}
#mainArea .keyvisual .main_left{
	float: left;
	width: 440px;
	margin-top: 5px;
}
#mainArea .keyvisual .main_right{
	float: right;
	width: 500px;
	margin-top: 5px;
}
#mainArea .keyvisual .main_left:hover,
#mainArea .keyvisual .main_right:hover{
	margin-top: 0px;
	margin-bottom: 5px;
}
#mainArea .keyvisual .main_right img,
#mainArea .keyvisual .main_left img{
	width: 100%;
}
		#mainArea .area{
			width: 100%;
			margin: 0 auto;
			padding: 5px 0 0 0;
			font-size: 1.7em;
			font-weight: bold;
			line-height: 1.7em;
			letter-spacing: 0.5em;
			text-align: center;
			background: #00adcb;
			color: #fff;
			position: relative;
			top: 0;
			right: 0;
			}
		#mainArea h1.head{
			}
		#mainArea .annotation{
			clear: both;
			padding: 20px 0 0 0;
			margin: 0 auto;
			width: 980px;
			font-size: 1.0em;
			font-weight: bold;
			line-height: 1.2em;
			text-align: center;
			}
		#mainArea .title{
			clear: both;
			padding: 20px 0 0 0;
			margin: 0 auto;
			width: 980px;
			}
			#mainArea .title dl{
				width: 95%;
				margin: 0 auto;
				padding: 10px 0 0 0;
				}
			#mainArea .title dt.headline{
				width: 100%;
				height: 65px;
				margin: 0 auto;
				padding: 3px 0 0 0;
				font-size: 1.4em;
				font-weight: bold;
				line-height: 1.3em;
				}
			#mainArea .title dt.icon_pre{
				width: 50px;
				height: 50px;
				margin: 0 10px 0 0;
				padding: 0 0 0 0;
				float: left;
				}
			#mainArea .title dt.day{
				width: 100%;
				margin: 0 auto;
				padding: 8px 0 6px 10px;
				font-size: 1.2em;
				font-weight: bold;
				line-height: 1.3em;
				background-color: #555;
				color: #fff;
				text-align: center;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
				border-radius: 6px;
				}
			#mainArea .title dd{
				width: 95%;
				margin: 0 auto;
				padding: 15px 0 0 0;
				}
		#mainArea .btncv{
			}
			#mainArea .btncv a{
				width: 500px;
				margin: 30px auto 0;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 2.0em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#mainArea .btncv a:hover{
				opacity: 0.5;
				}
				#mainArea .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}
.tline  {
	background: url(../../common/images/s/bg_002.jpg) center 0;
	padding: 30px 0 20px 0;
}

.tline span {
    width: 854px;
    margin: 0px auto 0;
    display: block;
    position: relative;
}



#subArea{
	width: 100%;
	margin: 0px auto 0;
	}
	#subArea .bg{
		position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0px 0 10px 0;
    background: url(../../common/images/s/bg_003.jpg) repeat-x fixed;
    -webkit-animation: bgroop 30s linear infinite;
    animation: bgroop 30s linear infinite;
		background-size: cover;
}
/*#subArea .bg .bg_in{
		width: 100%;
		position: relative;
		background: url(../images/180915/tbg.png) no-repeat center 0;
		}*/
		#subArea .bg2{
		position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 30px 0 30px 0;
    background: url(../../common/images/s/bg_004.jpg) repeat-x center 0;
		background-size: cover;
		margin-bottom: 50px;
		}
	
	#subArea .bg2 span{
		padding: 0 0 0 0;
margin: 0 auto;
width: 960px;
display: block;
		}
		#subArea .bg2 span img{
width: 100%;
		}
@-webkit-keyframes bgroop {
 from {
 background-position: 0 0;
}
 to {
 background-position: -1600px 0;
}
}
@keyframes bgroop {
 from {
 background-position: 0 0;
}
 to {
 background-position: -1600px 0;
}
}
	#subArea .inner{
		position: relative;
		width: 980px;
		margin: 0 auto;
		padding: 10px 0 10px 0;
		
		}
	#subArea .inner .inner_bg{
		width: 980px;
		height: 100%;
		margin: 0 auto;
		padding: 20px 0 40px 0;
		/*background: #fff;*/
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		opacity: 0.7;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		}
		#subArea .annotation{
			clear: both;
			padding: 15px 0 0 0;
			margin: 0 auto;
			width: 980px;
			font-size: 1.0em;
			font-weight: bold;
			line-height: 1.2em;
			text-align: center;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			/*color: #fff;*/
			}
		#subArea .item_image{
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			}
		#subArea .item_image img{
			width: 100%;
			}
		#subArea dl{
			width: 95%;
			margin: 0 auto;
			padding: 10px 0 15px 0;
			}
		#subArea dt.headline{
			width: 95%;
			margin: 0 auto;
			padding: 0 0 0 0;
			font-size: 1.4em;
			font-weight: bold;
			line-height: 1.3em;
			}
		#subArea dd{
			width: 95%;
			margin: 0 auto;
			padding: 10px 0 0 0;
			}
		#subArea .item01{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			
			}
		#subArea .item02{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .item03{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .item04{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .item05{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 980px;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .btncv{
			}
			#subArea .btncv a{
				width: 500px;
				margin: 50px auto 0;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 2.0em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#subArea .btncv a:hover{
				opacity: 0.5;
				}
				#subArea .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}



#info{
	margin: 0 auto 0;
	width: 100%;
	background: #fff;
	padding-top: 0px;
	}
	#info .inner{
		width: 980px;
		margin: 0 auto;
		padding: 0 0 30px 0;
		}
	#info .inner h2.infohead{
		width: 95%;
		margin: 0 auto;
		padding: 8px 0 6px 10px;
		font-size: 1.1em;
		font-weight: bold;
		line-height: 1.3em;
		background: #555;
		color: #fff;
		}
	#info .infoTxt{
		width: 95%;
		margin: 0 auto;
		padding: 15px;
		}
		#info .infoTxt dl{
			padding: 0 0 0 0;
			}
		#info .infoTxt dt{
			padding: 0 0 0 0;
			font-weight: bold;
			}
		#info .infoTxt dd{
			padding: 0 0 10px 0;
			}
		#info .btncv{
			}
			#info .btncv a{
				width: 500px;
				margin: 0 auto 40px;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 2.0em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#info .btncv a:hover{
				opacity: 0.5;
				}
				#info .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}
#info .lpbn{
	max-width: 960px;
	min-width: 800px;
	width: 100%;
	margin: 0 auto;
}
#info .lpbn img{
	max-width: 100%;
}


#accessArea{
	width: 100%;
	margin: 30px auto 0;
	padding: 0 0 0 0;
	}
	#accessArea .inner{
		width: 980px;
		margin: 0 auto;
		padding: 0 0 0 0;
		}
	#accessArea .shopinfo{
		width: 95%;
		margin: 0 auto;
		padding: 30px 30px 30px 30px;
		background: #fff;
		border: solid 1px #ccc;
		overflow: hidden;
		}
	#accessArea .shopinfo ul.info{
		width: 328px;
		margin: 0 auto;
		padding: 0 0 0 0;
		float: left;
		}
	#accessArea .shopinfo li.logo{
		width: 38px;
		height: 38px;
		margin: 0 5px 0 0;
		padding: 0 0 0 0;
		float: left;
		}
	#accessArea .shopinfo li.shopname{
		width: 100%;
		height: 40px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 2.0em;
		line-height: 1.8em;
		}
	#accessArea .shopinfo li.shopphoto{
		width: 328px;
		height: 227px;
		margin: 10px auto 10px;
		padding: 0 0 0 0;
		}
	#accessArea .shopinfo li.inquiry{
		width: 100%;
		height: 20px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		}
	#accessArea .shopinfo li.phoneicon{
		width: 72px;
		height: 28px;
		margin: 5px 5px 0 0;
		padding: 0 0 0 0;
		background: #336699;
		font-weight: bold;
		font-size: 1.1em;
		text-align: center;
		line-height: 2.0em;
		color: #fff;
		float: left;
		-moz-border-radius: 8px;
		-webkit-border-radius: 8px;
		border-radius: 8px;
		}
	#accessArea .shopinfo li.phone{
		width: 100%;
		height: 40px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.9em;
		line-height: 1.6em;
		color: #D90000;
		}
	#accessArea .shopinfo li.address{
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.3em;
		text-align: center;
		}
	#accessArea .map{
		width: 510px;
		height: 370px;
		margin: 0 auto;
		padding: 0 0 0 0;
		float: right;
		background: #fff;
		}
	#map_canvas{
		margin: 0 auto;
		padding: 0 0 0 0;
		width: 510px;
		height: 370px;
		border: solid 1px #ccc;
		}

	#balloon{
		width: 280px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-size: 1.0em;
		line-height: 1.0em;
		text-align: left;
		}
		#balloon .shopname{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-weight: bold;
			font-size: 1.2em;
			line-height: 1.8em;
			}
		#balloon .shopimage{
			width: 120px;
			margin: 0 auto;
			padding: 0 10px 0 0;
			float: left;
			}
		#balloon .txt{
			margin: 0 auto;
			padding: 5px 0 0 0;
			font-size: 0.9em;
			line-height: 1.3em;
			}
		#balloon .address{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-size: 1.0em;
			line-height: 1.3em;
			}
		#balloon .phone{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-weight: bold;
			font-size: 1.3em;
			line-height: 1.0em;
			color: #D90000;
			}




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

footer{
	padding: 15px 0 15px 0;
	background: #fff;
	margin-top: 30px;
	}
	footer #footerIn{
		width: 980px;
		margin: 0 auto;
		padding: 0 0 0 0;
		}
		footer #footerIn p{
			width: 180px;
			float: left;
			}
			footer #footerIn ul{
				margin-left: 40px;
				padding-top: 15px;
				float: left;
				}
			footer #footerIn ul li a{
				display: inline;
				text-decoration: none;
				font-size: 1.0em;
				}
				footer #footerIn ul li a:hover{
					text-decoration: underline;
					}
				footer #footerIn ul li span{
					padding: 0 15px;
					}
				footer #footerIn small{
					padding-top: 20px;
					font-size: 0.9em;
					display: block;
					text-align: center;
					}

#pageTop{
	width: 50px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 999;
	}


/*pc end
----------------------------------------------------------------------------------------------*/


/*sp
----------------------------------------------------------------------------------------------*/
@media screen and (max-width: 768px) {
.footerLinkArea .wrapper {
    width: 100%;
    margin: 0 auto;
}
body{
	/*background: none;*/
	min-width: 100%;
	position: relative;
	/*background: #fff;*/
	color: #333;
	}

#wrapper{
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 999;
	}

#adtag{
	height: 0;
	overflow: hidden;
	}

article{
	width: 100%;
	padding: 0;
	color: #333;
	}

header{
	margin: 0 auto;
	padding: 0 0 8px 0;
	position: relative;
	}
	header .inner{
		width: 100%;
		margin: 0 auto;
		padding: 8px 0 0 0;
		}
	header h1{
		float: none;
		text-align: center;
		margin-right: 0;
		}
		header h1 img{
			width: 180px;
			height: auto;
			}
	header #menuBtn{
		position:absolute;
		top: 15px;
		right: 15px;
		width: 26px;
		height: 24px;
		background: url(../images/bg_menu.png) 0 0 no-repeat;
		background-size: 26px 24px;
		}
		header #menuBtn.active img{
			display: none;
			}
	/*header nav{
		display: none;
		padding-top: 0;
		float: none;
		position: absolute;
		top: 55px;
		background: url(../images/bg_overlay.png) 0 0 repeat;
		z-index: 9999;
		left: 0;
		width: 100%;
		}
		header nav.active{
			display: block;
			}
		header nav ul li{
			float: none;
			}
		header nav ul li span{
			  padding: 0;
			  display: none;
			}
		header nav ul li a{
			font-size: 0.9em;
			text-decoration: none;
			display: block;
			padding: 10px;
			border-bottom: 1px solid #FFF;
			color: #FFF;
			}
		header nav ul li:last-child a{
			border-bottom: 0;
			}
		header nav ul li a:hover{
			text-decoration:none;
			color:#fff;
			}*/

#mainContents{
	width: 100%;
	margin: 0 auto 0;
	padding-top: 3em;
	}
#mainArea .keyvisual img {
    width: 100%;
}
#mainArea{
	width: 100%;
	margin: 0 auto;
	}
	#mainArea .inner{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		}
		#mainArea .keyvisual{
			width: 100%;
			margin: 0px auto 0;
			padding: 0 0 0 0;
			background-color:#fff;
			display:inline-block;
			}
		#mainArea .keyvisual .bg{
			width: 100%;
			margin: 0 auto;
			padding: 0 0 0 0;
			text-align: center;
			}
		#mainArea .area{
			width: 100%;
			margin: 0 auto;
			padding: 5px 0 0 0;
			font-size: 1.5em;
			font-weight: bold;
			line-height: 1.5em;
			letter-spacing: 0.0em;
			text-align: center;
			background: #00adcb;
			color: #fff;
			position: relative;
			top: 0;
			right: 0;
			}
		#mainArea h1.head{
			}
		#mainArea .annotation{
			clear: both;
			width: 95%;
			padding: 10px 0 10px 0;
			font-size: 1.0em;
			font-weight: bold;
			line-height: 1.2em;
			text-align: left;
			}
		#mainArea .title{
			clear: both;
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 95%;
			}
			#mainArea .title dl{
				width: 95%;
				margin: 0 auto;
				padding: 10px 0 0 0;
				}
			#mainArea .title dt.headline{
				width: 100%;
				height: auto;
				margin: 0 auto;
				padding: 3px 0 10px 0;
				font-size: 1.2em;
				font-weight: bold;
				line-height: 1.3em;
				}
			#mainArea .title dt.icon_pre{
				width: 50px;
				height: 50px;
				margin: 0 10px 0 0;
				padding: 0 0 0 0;
				float: left;
				}
			#mainArea .title dt.day{
				width: 100%;
				margin: 0 auto;
				padding: 8px 0 6px 0;
				font-size: 1.15em;
				font-weight: bold;
				line-height: 1.3em;
				background-color: #555;
				color: #fff;
				text-align: center;
				-moz-border-radius: 6px;
				-webkit-border-radius: 6px;
				border-radius: 6px;
				}
			#mainArea .title dd{
				width: 100%;
				margin: 0 auto;
				padding: 10px 0 0 0;
				}
		#mainArea .btncv{
			}
			#mainArea .btncv a{
				width: 85%;
				margin: 20px auto 0;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 1.6em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#mainArea .btncv a:hover{
				opacity: 0.5;
				}
				#mainArea .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}
			#mainArea .eye .area_menu ul{
			display:block;
			position: relative;
			bottom: 0;
			padding: 7px 4px 0px 7px;
			background:rgba(0,0,0,0.2);
			overflow: hidden;
				width: 100%;
			}
			.area_menu_all{
			position: relative;
    right: 0;
    width: 100%;
    bottom: 0;
    padding: 8px 13px 5px 12px;
    background: rgba(0,0,0,0.2);
			}
			#mainArea .eye .area_menu ul li{
			display:block;
			padding: 0 5px 10px;
			width: 33%;
			-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
	float: left;
				margin: 0;
			}
			/*#mainArea .eye .area_menu ul li:nth-child(5),
			#mainArea .eye .area_menu ul li:nth-child(6),
			#mainArea .eye .area_menu ul li:nth-child(7){
			width: 33.3%;
			}*/


#subArea{
	width: 100%;
	margin: 0px auto 0;
	}
	#subArea .bg{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		background: #fff;
		background: url(../../common/images/s/bg_003.jpg) center center fixed;
		background-size: cover;
		}
		#subArea .bg2{
		position: relative;
    width: 100%;
    margin: 0 auto 50px;
    padding: 0 0 0 0;
    background: url(../../common/images/s/bg_004.jpg) repeat-x center 0;
		background-size: cover;
		}
	
	#subArea .inner{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		}
	#subArea .inner .inner_bg{
		width: 100%;
		height: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		background: #fff;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		opacity: 0.7;
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		}
		#subArea .annotation{
			clear: both;
			width: 95%;
			padding: 10px 0 10px 0;
			font-size: 1.0em;
			font-weight: bold;
			line-height: 1.2em;
			}
		#subArea .item_image{
			padding: 0 0 0 0;
			margin: 0 auto;
			width: 100%;
			}
		#subArea .item_image img{
			width: 100%;
			}
		#subArea dl{
			width: 95%;
			margin: 0 auto;
			padding: 10px 0 15px 0;
			}
		#subArea dt.headline{
			width: 100%;
			margin: 0 auto;
			padding: 0 0 0 0;
			font-size: 1.2em;
			font-weight: bold;
			line-height: 1.3em;
			}
		#subArea dd{
			width: 100%;
			margin: 0 auto;
			padding: 10px 0 0 0;
			}
		#subArea .item01{
			clear: both;
			padding: 0;
			margin: 0 auto;
			width: 97%;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .item02{
			clear: both;
			padding: 0 0 5px 0;
			margin: 0 auto;
			width: 95%;
			position: relative;
			top: 0;
			left: 0;
			z-index: 999;
			}
		#subArea .item03{
			clear: both;
			padding: 10px 0 5px 0;
			margin: 0 auto;
			width: 95%;
			}
		#subArea .item04{
			clear: both;
			padding: 10px 0 5px 0;
			margin: 0 auto;
			width: 95%;
			}
		#subArea .item05{
			clear: both;
			padding: 10px 0 5px 0;
			margin: 0 auto;
			width: 95%;
			}
		#subArea .btncv{
			}
			#subArea .btncv a{
				width: 85%;
				margin: 20px auto 20px;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 1.4em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#subArea .btncv a:hover{
				opacity: 0.5;
				}
				#subArea .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}

#sp_present  {
	background: url(../../common/images/s/bg_002.jpg) center 0;
	padding: 0;
height: 100%;
width: 100%;
display: block;
	background-size: cover;
}

#info{
	margin: 0px auto 0;
	width: 100%;
	}
	#info .inner{
		width: 95%;
		margin: 0 auto;
		padding: 20px 0 20px 0;
		}
	#info .inner h2.infohead{
		width: 100%;
		margin: 0 auto;
		padding: 8px 0 6px 0;
		font-size: 1.1em;
		font-weight: bold;
		line-height: 1.3em;
		background: #555;
		color: #fff;
		text-align: center;
		}
	#info .infoTxt{
		width: 100%;
		margin: 0 auto;
		padding: 0;
		}
		#info .infoTxt dl{
			padding: 0 0 0 0;
			}
		#info .infoTxt dt{
			padding: 10px 0 0 0;
			font-weight: bold;
			}
		#info .infoTxt dd{
			padding: 0 0 10px 0;
			}
		#info .btncv{
			}
			#info .btncv a{
				width: 89%;
				margin: 0 auto 30px;
				padding: 15px 0 10px 0;
				font-weight: bold;
				font-size: 1.4em;
				text-align: center;
				display: block;
				background: #D90000;
				text-decoration: none;
				color: #fff;
				}
			#info .btncv a:hover{
				opacity: 0.5;
				}
				#info .btncv a span.big{
					font-size:1.4em;
					font-weight: bold;
					vertical-align: middle;
					}
	#info .lpbn{
	max-width: 100%;
	min-width: 10px;
	width: 100%;
	margin: 0 auto;
}


#accessArea{
	width: 100%;
	margin: 20px auto 0;
	padding: 0 0 0 0;
	}
	#accessArea .inner{
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		overflow: hidden;
		position: relative;
		}
	#accessArea .shopinfo{
		width: 95%;
		margin: 0 auto;
		padding: 10px 10px 10px 10px;
		background: #fff;
		border: solid 1px #ccc;
		overflow: hidden;
		}
	#accessArea .shopinfo ul.info{
		width: 100%;
		margin: 0 auto 20px;
		padding: 0 0 0 0;
		}
	#accessArea .shopinfo li.logo{
		width: 32px;
		height: 32px;
		margin: 0 5px 0 0;
		padding: 0 0 0 0;
		float: left;
		}
	#accessArea .shopinfo li.shopname{
		width: 100%;
		height: 32px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.8em;
		line-height: 1.8em;
		}
	#accessArea .shopinfo li.shopphoto{
		width: 100%;
		height: auto;
		margin: 10px auto 10px;
		padding: 0 0 0 0;
		}
	#accessArea .shopinfo li.inquiry{
		width: 100%;
		height: 20px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		}
	#accessArea .shopinfo li.phoneicon{
		width: 64px;
		height: 24px;
		margin: 5px 5px 0 0;
		padding: 0 0 0 0;
		background: #336699;
		font-weight: bold;
		font-size: 1.0em;
		text-align: center;
		line-height: 2.0em;
		color: #fff;
		float: left;
		-moz-border-radius: 6px;
		-webkit-border-radius: 6px;
		border-radius: 6px;
		}
	#accessArea .shopinfo li.phone{
		width: 100%;
		height: 34px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.6em;
		line-height: 1.8em;
		color: #D90000;
		}
	#accessArea .shopinfo li.address{
		width: 100%;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-weight: bold;
		font-size: 1.3em;
		text-align: center;
		}
	#accessArea .map{
		width: 100%;
		height: 300px;
		margin: 0 auto;
		padding: 0 0 0 0;
		float: right;
		background: #fff;
		}
	#map_canvas{
		margin: 0 auto;
		padding: 0 0 0 0;
		width: 100%;
		height: 300px;
		border: solid 1px #ccc;
		}

	#balloon{
		width: 140px;
		margin: 0 auto;
		padding: 0 0 0 0;
		font-size: 1.0em;
		line-height: 1.0em;
		text-align: left;
		}
		#balloon .shopname{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-weight: bold;
			font-size: 1.0em;
			line-height: 1.6em;
			}
		#balloon .shopimage{
			width: 120px;
			margin: 0 auto;
			padding: 0 10px 0 0;
			display: none;
			}
		#balloon .txt{
			margin: 0 auto;
			padding: 2px 0 0 0;
			font-size: 0.9em;
			line-height: 1.3em;
			}
		#balloon .address{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-size: 1.0em;
			line-height: 1.3em;
			}
		#balloon .phone{
			margin: 0 auto;
			padding: 0 0 0 0;
			font-weight: bold;
			font-size: 1.2em;
			line-height: 1.2em;
			color: #D90000;
			}



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

footer{
	padding: 0 0 15px;
	}
	footer #footerIn{
		width: 100%;
		margin: 0 auto;
		padding: 0;
		}
		footer #footerIn p{
			width: 100%;
			float: none;
			padding-top: 15px;
			text-align: center;
			}
			footer #footerIn p img{
				width: 180px;
				height: auto;
				}
			footer #footerIn ul{
				padding-top: 0;
				background: #FFF;
				padding: 15px 0;
				float: none;
				text-align: center;
				}
			footer #footerIn ul li{
				display: inline;
				}
			footer #footerIn ul li a{
				display: inline;
				text-decoration: none;
				font-weight: bold;
				color: #333;
				}
				footer #footerIn ul li span{
					padding: 0 5px;
					color: #333;
					}
				footer #footerIn small{
					padding-top: 15px;
					display: block;
					font-size: 0.9em;
					text-align: center;
					}

#pageTop{
	width: 40px;
	position: fixed;
	bottom: 15px;
	right: 15px;
	z-index: 999;
	}

} /* @media screen and (max-width: 768px) */


/*sp end
----------------------------------------------------------------------------------------------*/


@-webkit-keyframes move {
  100% {
    -webkit-transform: translate3d(0, 0, -1000px);
            transform: translate3d(0, 0, -1000px);
  }px
}

@keyframes move {
  100% {
    -webkit-transform: translate3d(0, 0, -1000px);
            transform: translate3d(0, 0, -1000px);
  }
}
.container {
  position: relative;
  width: 100%;
  min-height: 100%;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.bubble-wrap {
  margin: 0 auto;
  width: 500px;
  height: 700px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transform-origin: center center;
          transform-origin: center center;
  -webkit-perspective: 600px;
          perspective: 600px;
	position: absolute;
	top: 100px;
	left:0;
	right: 0;

}


.bubble {
  position: absolute;
  background: black;
  opacity: .7;
  border-radius: 50%;
  -webkit-animation: move 3s infinite;
          animation: move 3s infinite;
}

.bubble:nth-child(1) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
  -webkit-transform: translate3d(344px, 743px, 995px);
          transform: translate3d(344px, 743px, 995px);
  background: #2688d9;
}

.bubble:nth-child(2) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
  -webkit-transform: translate3d(247px, 937px, 984px);
          transform: translate3d(247px, 937px, 984px);
  background: #26d9bb;
}

.bubble:nth-child(3) {
  height: 11px;
  width: 11px;
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s;
  -webkit-transform: translate3d(660px, 396px, 1438px);
          transform: translate3d(660px, 396px, 1438px);
  background: #26b8d9;
}

.bubble:nth-child(4) {
  height: 21px;
  width: 21px;
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s;
  -webkit-transform: translate3d(317px, 435px, 655px);
          transform: translate3d(317px, 435px, 655px);
  background: #d926a6;
}

.bubble:nth-child(5) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
  -webkit-transform: translate3d(472px, 792px, 520px);
          transform: translate3d(472px, 792px, 520px);
  background: #2682d9;
}

.bubble:nth-child(6) {
  height: 17px;
  width: 17px;
  -webkit-animation-delay: -1.2s;
          animation-delay: -1.2s;
  -webkit-transform: translate3d(666px, 259px, 461px);
          transform: translate3d(666px, 259px, 461px);
  background: #263ed9;
}

.bubble:nth-child(7) {
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -1.4s;
          animation-delay: -1.4s;
  -webkit-transform: translate3d(113px, 416px, 1211px);
          transform: translate3d(113px, 416px, 1211px);
  background: #d95c26;
}

.bubble:nth-child(8) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -1.6s;
          animation-delay: -1.6s;
  -webkit-transform: translate3d(361px, 508px, 255px);
          transform: translate3d(361px, 508px, 255px);
  background: #d93826;
}

.bubble:nth-child(9) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -1.8s;
          animation-delay: -1.8s;
  -webkit-transform: translate3d(331px, 990px, 648px);
          transform: translate3d(331px, 990px, 648px);
  background: #4d26d9;
}

.bubble:nth-child(10) {
  height: 3px;
  width: 3px;
  -webkit-animation-delay: -2s;
          animation-delay: -2s;
  -webkit-transform: translate3d(995px, 287px, 11px);
          transform: translate3d(995px, 287px, 11px);
  background: #26d95f;
}

.bubble:nth-child(11) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -2.2s;
          animation-delay: -2.2s;
  -webkit-transform: translate3d(864px, 914px, 125px);
          transform: translate3d(864px, 914px, 125px);
  background: #263bd9;
}

.bubble:nth-child(12) {
  height: 11px;
  width: 11px;
  -webkit-animation-delay: -2.4s;
          animation-delay: -2.4s;
  -webkit-transform: translate3d(88px, 325px, 833px);
          transform: translate3d(88px, 325px, 833px);
  background: #262cd9;
}

.bubble:nth-child(13) {
  height: 14px;
  width: 14px;
  -webkit-animation-delay: -2.6s;
          animation-delay: -2.6s;
  -webkit-transform: translate3d(506px, 145px, 653px);
          transform: translate3d(506px, 145px, 653px);
  background: #d9d326;
}

.bubble:nth-child(14) {
  height: 1px;
  width: 1px;
  -webkit-animation-delay: -2.8s;
          animation-delay: -2.8s;
  -webkit-transform: translate3d(116px, 90px, 1374px);
          transform: translate3d(116px, 90px, 1374px);
  background: #5326d9;
}

.bubble:nth-child(15) {
  height: 17px;
  width: 17px;
  -webkit-animation-delay: -3s;
          animation-delay: -3s;
  -webkit-transform: translate3d(672px, 396px, 1145px);
          transform: translate3d(672px, 396px, 1145px);
  background: #6bd926;
}

.bubble:nth-child(16) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -3.2s;
          animation-delay: -3.2s;
  -webkit-transform: translate3d(482px, 974px, 1331px);
          transform: translate3d(482px, 974px, 1331px);
  background: #26d98b;
}

.bubble:nth-child(17) {
  height: 2px;
  width: 2px;
  -webkit-animation-delay: -3.4s;
          animation-delay: -3.4s;
  -webkit-transform: translate3d(65px, 384px, 1636px);
          transform: translate3d(65px, 384px, 1636px);
  background: #2656d9;
}

.bubble:nth-child(18) {
  height: 22px;
  width: 22px;
  -webkit-animation-delay: -3.6s;
          animation-delay: -3.6s;
  -webkit-transform: translate3d(219px, 444px, 142px);
          transform: translate3d(219px, 444px, 142px);
  background: #d626d9;
}

.bubble:nth-child(19) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -3.8s;
          animation-delay: -3.8s;
  -webkit-transform: translate3d(186px, 853px, 878px);
          transform: translate3d(186px, 853px, 878px);
  background: #d926d6;
}

.bubble:nth-child(20) {
  height: 19px;
  width: 19px;
  -webkit-animation-delay: -4s;
          animation-delay: -4s;
  -webkit-transform: translate3d(203px, 718px, 1921px);
          transform: translate3d(203px, 718px, 1921px);
  background: #26d982;
}

.bubble:nth-child(21) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -4.2s;
          animation-delay: -4.2s;
  -webkit-transform: translate3d(491px, 236px, 519px);
          transform: translate3d(491px, 236px, 519px);
  background: #d92685;
}

.bubble:nth-child(22) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -4.4s;
          animation-delay: -4.4s;
  -webkit-transform: translate3d(4px, 979px, 1693px);
          transform: translate3d(4px, 979px, 1693px);
  background: #4726d9;
}

.bubble:nth-child(23) {
  height: 25px;
  width: 25px;
  -webkit-animation-delay: -4.6s;
          animation-delay: -4.6s;
  -webkit-transform: translate3d(724px, 923px, 9px);
          transform: translate3d(724px, 923px, 9px);
  background: #c7d926;
}

.bubble:nth-child(24) {
  height: 30px;
  width: 30px;
  -webkit-animation-delay: -4.8s;
          animation-delay: -4.8s;
  -webkit-transform: translate3d(837px, 793px, 472px);
          transform: translate3d(837px, 793px, 472px);
  background: #2668d9;
}

.bubble:nth-child(25) {
  height: 14px;
  width: 14px;
  -webkit-animation-delay: -5s;
          animation-delay: -5s;
  -webkit-transform: translate3d(854px, 477px, 767px);
          transform: translate3d(854px, 477px, 767px);
  background: #c726d9;
}

.bubble:nth-child(26) {
  height: 14px;
  width: 14px;
  -webkit-animation-delay: -5.2s;
          animation-delay: -5.2s;
  -webkit-transform: translate3d(610px, 699px, 407px);
          transform: translate3d(610px, 699px, 407px);
  background: #d95026;
}

.bubble:nth-child(27) {
  height: 18px;
  width: 18px;
  -webkit-animation-delay: -5.4s;
          animation-delay: -5.4s;
  -webkit-transform: translate3d(364px, 920px, 913px);
          transform: translate3d(364px, 920px, 913px);
  background: #d92671;
}

.bubble:nth-child(28) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -5.6s;
          animation-delay: -5.6s;
  -webkit-transform: translate3d(402px, 363px, 715px);
          transform: translate3d(402px, 363px, 715px);
  background: #269ad9;
}

.bubble:nth-child(29) {
  height: 28px;
  width: 28px;
  -webkit-animation-delay: -5.8s;
          animation-delay: -5.8s;
  -webkit-transform: translate3d(667px, 63px, 1469px);
          transform: translate3d(667px, 63px, 1469px);
  background: #26d997;
}

.bubble:nth-child(30) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -6s;
          animation-delay: -6s;
  -webkit-transform: translate3d(768px, 57px, 570px);
          transform: translate3d(768px, 57px, 570px);
  background: #26b5d9;
}

.bubble:nth-child(31) {
  height: 16px;
  width: 16px;
  -webkit-animation-delay: -6.2s;
          animation-delay: -6.2s;
  -webkit-transform: translate3d(785px, 529px, 575px);
          transform: translate3d(785px, 529px, 575px);
  background: #d92677;
}

.bubble:nth-child(32) {
  height: 3px;
  width: 3px;
  -webkit-animation-delay: -6.4s;
          animation-delay: -6.4s;
  -webkit-transform: translate3d(55px, 2px, 752px);
          transform: translate3d(55px, 2px, 752px);
  background: #26d94a;
}

.bubble:nth-child(33) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -6.6s;
          animation-delay: -6.6s;
  -webkit-transform: translate3d(517px, 552px, 1728px);
          transform: translate3d(517px, 552px, 1728px);
  background: #26d0d9;
}

.bubble:nth-child(34) {
  height: 22px;
  width: 22px;
  -webkit-animation-delay: -6.8s;
          animation-delay: -6.8s;
  -webkit-transform: translate3d(572px, 604px, 1549px);
          transform: translate3d(572px, 604px, 1549px);
  background: #26d95c;
}

.bubble:nth-child(35) {
  height: 23px;
  width: 23px;
  -webkit-animation-delay: -7s;
          animation-delay: -7s;
  -webkit-transform: translate3d(947px, 74px, 1137px);
          transform: translate3d(947px, 74px, 1137px);
  background: #afd926;
}

.bubble:nth-child(36) {
  height: 27px;
  width: 27px;
  -webkit-animation-delay: -7.2s;
          animation-delay: -7.2s;
  -webkit-transform: translate3d(983px, 393px, 1774px);
          transform: translate3d(983px, 393px, 1774px);
  background: #d99726;
}

.bubble:nth-child(37) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -7.4s;
          animation-delay: -7.4s;
  -webkit-transform: translate3d(184px, 718px, 412px);
          transform: translate3d(184px, 718px, 412px);
  background: #97d926;
}

.bubble:nth-child(38) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -7.6s;
          animation-delay: -7.6s;
  -webkit-transform: translate3d(748px, 746px, 1802px);
          transform: translate3d(748px, 746px, 1802px);
  background: #26d9d9;
}

.bubble:nth-child(39) {
  height: 28px;
  width: 28px;
  -webkit-animation-delay: -7.8s;
          animation-delay: -7.8s;
  -webkit-transform: translate3d(774px, 362px, 918px);
          transform: translate3d(774px, 362px, 918px);
  background: #26bed9;
}

.bubble:nth-child(40) {
  height: 2px;
  width: 2px;
  -webkit-animation-delay: -8s;
          animation-delay: -8s;
  -webkit-transform: translate3d(703px, 477px, 464px);
          transform: translate3d(703px, 477px, 464px);
  background: #2c26d9;
}

.bubble:nth-child(41) {
  height: 8px;
  width: 8px;
  -webkit-animation-delay: -8.2s;
          animation-delay: -8.2s;
  -webkit-transform: translate3d(82px, 999px, 1752px);
          transform: translate3d(82px, 999px, 1752px);
  background: #d92653;
}

.bubble:nth-child(42) {
  height: 29px;
  width: 29px;
  -webkit-animation-delay: -8.4s;
          animation-delay: -8.4s;
  -webkit-transform: translate3d(42px, 631px, 1073px);
          transform: translate3d(42px, 631px, 1073px);
  background: #26d9ac;
}

.bubble:nth-child(43) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -8.6s;
          animation-delay: -8.6s;
  -webkit-transform: translate3d(913px, 728px, 1780px);
          transform: translate3d(913px, 728px, 1780px);
  background: #5fd926;
}

.bubble:nth-child(44) {
  height: 3px;
  width: 3px;
  -webkit-animation-delay: -8.8s;
          animation-delay: -8.8s;
  -webkit-transform: translate3d(532px, 818px, 628px);
          transform: translate3d(532px, 818px, 628px);
  background: #44d926;
}

.bubble:nth-child(45) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -9s;
          animation-delay: -9s;
  -webkit-transform: translate3d(226px, 291px, 931px);
          transform: translate3d(226px, 291px, 931px);
  background: #d9268b;
}

.bubble:nth-child(46) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -9.2s;
          animation-delay: -9.2s;
  -webkit-transform: translate3d(722px, 72px, 267px);
          transform: translate3d(722px, 72px, 267px);
  background: #d98026;
}

.bubble:nth-child(47) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -9.4s;
          animation-delay: -9.4s;
  -webkit-transform: translate3d(839px, 534px, 1655px);
          transform: translate3d(839px, 534px, 1655px);
  background: #267dd9;
}

.bubble:nth-child(48) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -9.6s;
          animation-delay: -9.6s;
  -webkit-transform: translate3d(322px, 28px, 979px);
          transform: translate3d(322px, 28px, 979px);
  background: #d926a6;
}

.bubble:nth-child(49) {
  height: 16px;
  width: 16px;
  -webkit-animation-delay: -9.8s;
          animation-delay: -9.8s;
  -webkit-transform: translate3d(648px, 213px, 96px);
          transform: translate3d(648px, 213px, 96px);
  background: #d9cd26;
}

.bubble:nth-child(50) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -10s;
          animation-delay: -10s;
  -webkit-transform: translate3d(936px, 848px, 926px);
          transform: translate3d(936px, 848px, 926px);
  background: #a9d926;
}

.bubble:nth-child(51) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -10.2s;
          animation-delay: -10.2s;
  -webkit-transform: translate3d(948px, 768px, 1948px);
          transform: translate3d(948px, 768px, 1948px);
  background: #26d9d9;
}

.bubble:nth-child(52) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -10.4s;
          animation-delay: -10.4s;
  -webkit-transform: translate3d(676px, 810px, 1164px);
          transform: translate3d(676px, 810px, 1164px);
  background: #6e26d9;
}

.bubble:nth-child(53) {
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -10.6s;
          animation-delay: -10.6s;
  -webkit-transform: translate3d(2px, 351px, 400px);
          transform: translate3d(2px, 351px, 400px);
  background: #d626d9;
}

.bubble:nth-child(54) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -10.8s;
          animation-delay: -10.8s;
  -webkit-transform: translate3d(479px, 725px, 1344px);
          transform: translate3d(479px, 725px, 1344px);
  background: #2926d9;
}

.bubble:nth-child(55) {
  height: 26px;
  width: 26px;
  -webkit-animation-delay: -11s;
          animation-delay: -11s;
  -webkit-transform: translate3d(110px, 29px, 1862px);
          transform: translate3d(110px, 29px, 1862px);
  background: #8526d9;
}

.bubble:nth-child(56) {
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -11.2s;
          animation-delay: -11.2s;
  -webkit-transform: translate3d(783px, 939px, 375px);
          transform: translate3d(783px, 939px, 375px);
  background: #d926af;
}

.bubble:nth-child(57) {
  height: 14px;
  width: 14px;
  -webkit-animation-delay: -11.4s;
          animation-delay: -11.4s;
  -webkit-transform: translate3d(756px, 716px, 921px);
          transform: translate3d(756px, 716px, 921px);
  background: #7dd926;
}

.bubble:nth-child(58) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -11.6s;
          animation-delay: -11.6s;
  -webkit-transform: translate3d(931px, 724px, 1074px);
          transform: translate3d(931px, 724px, 1074px);
  background: #ac26d9;
}

.bubble:nth-child(59) {
  height: 24px;
  width: 24px;
  -webkit-animation-delay: -11.8s;
          animation-delay: -11.8s;
  -webkit-transform: translate3d(697px, 467px, 264px);
          transform: translate3d(697px, 467px, 264px);
  background: #d9cd26;
}

.bubble:nth-child(60) {
  height: 27px;
  width: 27px;
  -webkit-animation-delay: -12s;
          animation-delay: -12s;
  -webkit-transform: translate3d(900px, 388px, 808px);
          transform: translate3d(900px, 388px, 808px);
  background: #26b5d9;
}

.bubble:nth-child(61) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -12.2s;
          animation-delay: -12.2s;
  -webkit-transform: translate3d(281px, 864px, 1271px);
          transform: translate3d(281px, 864px, 1271px);
  background: #d92680;
}

.bubble:nth-child(62) {
  height: 29px;
  width: 29px;
  -webkit-animation-delay: -12.4s;
          animation-delay: -12.4s;
  -webkit-transform: translate3d(175px, 57px, 525px);
          transform: translate3d(175px, 57px, 525px);
  background: #d9268b;
}

.bubble:nth-child(63) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -12.6s;
          animation-delay: -12.6s;
  -webkit-transform: translate3d(43px, 107px, 1150px);
          transform: translate3d(43px, 107px, 1150px);
  background: #2659d9;
}

.bubble:nth-child(64) {
  height: 26px;
  width: 26px;
  -webkit-animation-delay: -12.8s;
          animation-delay: -12.8s;
  -webkit-transform: translate3d(661px, 545px, 581px);
          transform: translate3d(661px, 545px, 581px);
  background: #8bd926;
}

.bubble:nth-child(65) {
  height: 18px;
  width: 18px;
  -webkit-animation-delay: -13s;
          animation-delay: -13s;
  -webkit-transform: translate3d(200px, 858px, 1613px);
          transform: translate3d(200px, 858px, 1613px);
  background: #2cd926;
}

.bubble:nth-child(66) {
  height: 19px;
  width: 19px;
  -webkit-animation-delay: -13.2s;
          animation-delay: -13.2s;
  -webkit-transform: translate3d(322px, 33px, 419px);
          transform: translate3d(322px, 33px, 419px);
  background: #d9b526;
}

.bubble:nth-child(67) {
  height: 17px;
  width: 17px;
  -webkit-animation-delay: -13.4s;
          animation-delay: -13.4s;
  -webkit-transform: translate3d(813px, 6px, 1382px);
          transform: translate3d(813px, 6px, 1382px);
  background: #d9ca26;
}

.bubble:nth-child(68) {
  height: 13px;
  width: 13px;
  -webkit-animation-delay: -13.6s;
          animation-delay: -13.6s;
  -webkit-transform: translate3d(751px, 490px, 707px);
          transform: translate3d(751px, 490px, 707px);
  background: #d92674;
}

.bubble:nth-child(69) {
  height: 10px;
  width: 10px;
  -webkit-animation-delay: -13.8s;
          animation-delay: -13.8s;
  -webkit-transform: translate3d(89px, 673px, 1925px);
          transform: translate3d(89px, 673px, 1925px);
  background: #26d991;
}

.bubble:nth-child(70) {
  height: 8px;
  width: 8px;
  -webkit-animation-delay: -14s;
          animation-delay: -14s;
  -webkit-transform: translate3d(987px, 169px, 63px);
          transform: translate3d(987px, 169px, 63px);
  background: #d97426;
}

.bubble:nth-child(71) {
  height: 18px;
  width: 18px;
  -webkit-animation-delay: -14.2s;
          animation-delay: -14.2s;
  -webkit-transform: translate3d(282px, 922px, 610px);
          transform: translate3d(282px, 922px, 610px);
  background: #6826d9;
}

.bubble:nth-child(72) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -14.4s;
          animation-delay: -14.4s;
  -webkit-transform: translate3d(88px, 502px, 926px);
          transform: translate3d(88px, 502px, 926px);
  background: #d92680;
}

.bubble:nth-child(73) {
  height: 5px;
  width: 5px;
  -webkit-animation-delay: -14.6s;
          animation-delay: -14.6s;
  -webkit-transform: translate3d(241px, 675px, 719px);
          transform: translate3d(241px, 675px, 719px);
  background: #9426d9;
}

.bubble:nth-child(74) {
  height: 4px;
  width: 4px;
  -webkit-animation-delay: -14.8s;
          animation-delay: -14.8s;
  -webkit-transform: translate3d(341px, 572px, 1395px);
          transform: translate3d(341px, 572px, 1395px);
  background: #d92671;
}

.bubble:nth-child(75) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -15s;
          animation-delay: -15s;
  -webkit-transform: translate3d(720px, 587px, 1996px);
          transform: translate3d(720px, 587px, 1996px);
  background: #26d950;
}

.bubble:nth-child(76) {
  height: 17px;
  width: 17px;
  -webkit-animation-delay: -15.2s;
          animation-delay: -15.2s;
  -webkit-transform: translate3d(175px, 563px, 657px);
          transform: translate3d(175px, 563px, 657px);
  background: #26d971;
}

.bubble:nth-child(77) {
  height: 30px;
  width: 30px;
  -webkit-animation-delay: -15.4s;
          animation-delay: -15.4s;
  -webkit-transform: translate3d(222px, 872px, 505px);
          transform: translate3d(222px, 872px, 505px);
  background: #5026d9;
}

.bubble:nth-child(78) {
  height: 9px;
  width: 9px;
  -webkit-animation-delay: -15.6s;
          animation-delay: -15.6s;
  -webkit-transform: translate3d(948px, 115px, 1795px);
          transform: translate3d(948px, 115px, 1795px);
  background: #268bd9;
}

.bubble:nth-child(79) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -15.8s;
          animation-delay: -15.8s;
  -webkit-transform: translate3d(141px, 260px, 673px);
          transform: translate3d(141px, 260px, 673px);
  background: #c726d9;
}

.bubble:nth-child(80) {
  height: 18px;
  width: 18px;
  -webkit-animation-delay: -16s;
          animation-delay: -16s;
  -webkit-transform: translate3d(976px, 414px, 1108px);
          transform: translate3d(976px, 414px, 1108px);
  background: #d92697;
}

.bubble:nth-child(81) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -16.2s;
          animation-delay: -16.2s;
  -webkit-transform: translate3d(600px, 264px, 744px);
          transform: translate3d(600px, 264px, 744px);
  background: #7126d9;
}

.bubble:nth-child(82) {
  height: 19px;
  width: 19px;
  -webkit-animation-delay: -16.4s;
          animation-delay: -16.4s;
  -webkit-transform: translate3d(510px, 780px, 485px);
          transform: translate3d(510px, 780px, 485px);
  background: #a926d9;
}

.bubble:nth-child(83) {
  height: 19px;
  width: 19px;
  -webkit-animation-delay: -16.6s;
          animation-delay: -16.6s;
  -webkit-transform: translate3d(934px, 839px, 1957px);
          transform: translate3d(934px, 839px, 1957px);
  background: #a326d9;
}

.bubble:nth-child(84) {
  height: 28px;
  width: 28px;
  -webkit-animation-delay: -16.8s;
          animation-delay: -16.8s;
  -webkit-transform: translate3d(14px, 154px, 60px);
          transform: translate3d(14px, 154px, 60px);
  background: #c726d9;
}

.bubble:nth-child(85) {
  height: 26px;
  width: 26px;
  -webkit-animation-delay: -17s;
          animation-delay: -17s;
  -webkit-transform: translate3d(519px, 901px, 548px);
          transform: translate3d(519px, 901px, 548px);
  background: #5fd926;
}

.bubble:nth-child(86) {
  height: 26px;
  width: 26px;
  -webkit-animation-delay: -17.2s;
          animation-delay: -17.2s;
  -webkit-transform: translate3d(789px, 282px, 1599px);
          transform: translate3d(789px, 282px, 1599px);
  background: #26d968;
}

.bubble:nth-child(87) {
  height: 12px;
  width: 12px;
  -webkit-animation-delay: -17.4s;
          animation-delay: -17.4s;
  -webkit-transform: translate3d(565px, 506px, 577px);
          transform: translate3d(565px, 506px, 577px);
  background: #53d926;
}

.bubble:nth-child(88) {
  height: 16px;
  width: 16px;
  -webkit-animation-delay: -17.6s;
          animation-delay: -17.6s;
  -webkit-transform: translate3d(867px, 489px, 58px);
          transform: translate3d(867px, 489px, 58px);
  background: #d926c4;
}

.bubble:nth-child(89) {
  height: 29px;
  width: 29px;
  -webkit-animation-delay: -17.8s;
          animation-delay: -17.8s;
  -webkit-transform: translate3d(235px, 835px, 919px);
          transform: translate3d(235px, 835px, 919px);
  background: #d9a326;
}

.bubble:nth-child(90) {
  height: 7px;
  width: 7px;
  -webkit-animation-delay: -18s;
          animation-delay: -18s;
  -webkit-transform: translate3d(462px, 387px, 1563px);
          transform: translate3d(462px, 387px, 1563px);
  background: #26a0d9;
}

.bubble:nth-child(91) {
  height: 12px;
  width: 12px;
  -webkit-animation-delay: -18.2s;
          animation-delay: -18.2s;
  -webkit-transform: translate3d(410px, 271px, 1659px);
          transform: translate3d(410px, 271px, 1659px);
  background: #26d98e;
}

.bubble:nth-child(92) {
  height: 26px;
  width: 26px;
  -webkit-animation-delay: -18.4s;
          animation-delay: -18.4s;
  -webkit-transform: translate3d(464px, 396px, 997px);
          transform: translate3d(464px, 396px, 997px);
  background: #d926cd;
}

.bubble:nth-child(93) {
  height: 30px;
  width: 30px;
  -webkit-animation-delay: -18.6s;
          animation-delay: -18.6s;
  -webkit-transform: translate3d(248px, 129px, 571px);
          transform: translate3d(248px, 129px, 571px);
  background: #d99a26;
}

.bubble:nth-child(94) {
  height: 11px;
  width: 11px;
  -webkit-animation-delay: -18.8s;
          animation-delay: -18.8s;
  -webkit-transform: translate3d(849px, 682px, 1827px);
          transform: translate3d(849px, 682px, 1827px);
  background: #d926c4;
}

.bubble:nth-child(95) {
  height: 1px;
  width: 1px;
  -webkit-animation-delay: -19s;
          animation-delay: -19s;
  -webkit-transform: translate3d(143px, 837px, 1231px);
          transform: translate3d(143px, 837px, 1231px);
  background: #d9ac26;
}

.bubble:nth-child(96) {
  height: 12px;
  width: 12px;
  -webkit-animation-delay: -19.2s;
          animation-delay: -19.2s;
  -webkit-transform: translate3d(278px, 359px, 1753px);
          transform: translate3d(278px, 359px, 1753px);
  background: #d92647;
}

.bubble:nth-child(97) {
  height: 17px;
  width: 17px;
  -webkit-animation-delay: -19.4s;
          animation-delay: -19.4s;
  -webkit-transform: translate3d(933px, 259px, 259px);
          transform: translate3d(933px, 259px, 259px);
  background: #5626d9;
}

.bubble:nth-child(98) {
  height: 20px;
  width: 20px;
  -webkit-animation-delay: -19.6s;
          animation-delay: -19.6s;
  -webkit-transform: translate3d(690px, 355px, 1742px);
          transform: translate3d(690px, 355px, 1742px);
  background: #d9267a;
}

.bubble:nth-child(99) {
  height: 6px;
  width: 6px;
  -webkit-animation-delay: -19.8s;
          animation-delay: -19.8s;
  -webkit-transform: translate3d(893px, 981px, 225px);
          transform: translate3d(893px, 981px, 225px);
  background: #268ed9;
}

.bubble:nth-child(100) {
  height: 15px;
  width: 15px;
  -webkit-animation-delay: -20s;
          animation-delay: -20s;
  -webkit-transform: translate3d(442px, 72px, 29px);
          transform: translate3d(442px, 72px, 29px);
  background: #d9cd26;
}

/*----- modal -----*/
html,body {
	height: 100%;
}


* html .layer_board_bg,
* html .layer_board {
	position: absolute;
}

.layer_board_bg {
	position: fixed;
	width: 100%;
	height: 100%;
	
	z-index: 1000;
	
	top: 0;
	left: 0;
	
	display: none;
	cursor: pointer;
	background: #000;
}

.layer_board {
	display: none;
	position: fixed;
	left: 50%;
	margin: 50px 0px 0px -400px;
	
	text-align: center;
	z-index: 20000;
}
.btn_close{
	text-align: right;
	padding-bottom: 10px;
}
.btn_close img{
	text-align: right;
	width: 26px;
}

/*anime*/
.purupuru {
	 -moz-animation: purupuru 0.8s linear 0s 1;
		-webkit-animation: purupuru 0.8s linear 0s 1;
		-ms-animation: purupuru 0.8s linear 0s 1;
		-o-animation: purupuru 0.8s linear 0s 1;
  animation: purupuru 0.8s linear 0s 1;
}
 
@keyframes purupuru {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  20%  { transform: scale(1.0, 1.06) translate(-5%, -4%) skew(6deg, 0deg); }
  50%  { transform: scale(1.0, 0.94) translate(5%, 4%) skew(-6deg, 0deg); }
  65%  { transform: scale(1.0, 1.03) translate(2%, -2%) skew(-3deg, 0deg); }
  80%  { transform: scale(1.0, 0.97) translate(-2%, 2%) skew(3deg, 0deg); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
.poyooon {
	-moz-animation: poyooon 0.9s linear 0s 1;
		-webkit-animation: poyooon 0.9s linear 0s 1;
		-ms-animation: poyooon 0.9s linear 0s 1;
		-o-animation: poyooon 0.9s linear 0s 1;
  animation: poyooon 0.9s linear 0s 1;
}
/*@keyframes poyooon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  10%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
  40%  { transform: scale(1.2, 0.8) translate(0%, 15%); }
  50%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  60%  { transform: scale(0.9, 1.2) translate(0%, -10%); }
  75%  { transform: scale(0.9, 1.2) translate(0%, -5%); }
  85%  { transform: scale(1.2, 0.8) translate(0%, 15%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}*/
@keyframes poyooon {
  0%   { transform: scale(1.0, 1.0) translate(0%, 0%); }
  10%  { transform: scale(1.05, 0.95) translate(0%, 3%); }
  40%  { transform: scale(1.1, 0.9) translate(0%, 10%); }
  50%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
  60%  { transform: scale(0.95, 1.1) translate(0%, -5%); }
  75%  { transform: scale(0.95, 1.1) translate(0%, -3%); }
  85%  { transform: scale(1.1, 0.9) translate(0%, 10%); }
  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
}
.swing {
    -moz-animation: swing linear 3s infinite;
    -webkit-animation: swing linear 3s infinite;
    -ms-animation: swing linear 3s infinite;
    -o-animation: swing linear 3s infinite;
    animation: swing linear 3s infinite;
    display: block;
}
 
@-moz-keyframes swing {
    0% { -moz-transform: rotate(0deg) }
    25% { -moz-transform: rotate(5deg); }
    50% { -moz-transform: rotate(0deg); }
    75% { -moz-transform: rotate(-5deg); }
    100% { -moz-transform: rotate(0deg); }
}
@-webkit-keyframes swing {
    0% { -webkit-transform: rotate(0deg); }
    25% { -webkit-transform: rotate(5deg); }
    50% { -webkit-transform: rotate(0deg); }
    75% { -webkit-transform: rotate(-5deg); }
    100% { -webkit-transform: rotate(0deg); }
}    
@-o-keyframes swing {
    0% { -o-transform: rotate(0deg); }
    25% { -o-transform: rotate(5deg); }
    50% { -o-transform: rotate(0deg); }
    75% { -o-transform: rotate(-5deg); }
    100% { -o-transform: rotate(0deg); }
}
@-ms-keyframes swing {
    0% { -ms-transform: rotate(0deg); }
    25% { -ms-transform: rotate(5deg); }
    50% { -ms-transform: rotate(0deg); }
    75% { -ms-transform: rotate(-5deg); }
    100% { -ms-transform: rotate(0deg); }
}
@keyframes swing {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    50% { transform: rotate(0deg); }
    75% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}
.swing2 {
    margin:10px;
    -moz-animation: swing linear 1s infinite;
    -moz-transform-origin: center -30px 0;
    -webkit-animation: swing linear 1s infinite;
    -webkit-transform-origin: center -30px 0;
    -ms-animation: swing linear 1s infinite;
    -ms-transform-origin: center -30px 0;
    -o-animation: swing linear 1s infinite;
    -o-transform-origin:center -30px 0;
    animation: swing linear 1s infinite;
    transform-origin: center -30px 0;
    display: block;
}
 
@-moz-keyframes swing2 {
    0% { -moz-transform: rotate(0deg) }
    25% { -moz-transform: rotate(5deg); }
    50% { -moz-transform: rotate(0deg); }
    75% { -moz-transform: rotate(-5deg); }
    100% { -moz-transform: rotate(0deg); }
}
@-webkit-keyframes swing2 {
    0% { -webkit-transform: rotate(0deg); }
    25% { -webkit-transform: rotate(5deg); }
    50% { -webkit-transform: rotate(0deg); }
    75% { -webkit-transform: rotate(-5deg); }
    100% { -webkit-transform: rotate(0deg); }
}    
@-o-keyframes swing2 {
    0% { -o-transform: rotate(0deg); }
    25% { -o-transform: rotate(5deg); }
    50% { -o-transform: rotate(0deg); }
    75% { -o-transform: rotate(-5deg); }
    100% { -o-transform: rotate(0deg); }
}
@-ms-keyframes swing2 {
    0% { -ms-transform: rotate(0deg); }
    25% { -ms-transform: rotate(5deg); }
    50% { -ms-transform: rotate(0deg); }
    75% { -ms-transform: rotate(-5deg); }
    100% { -ms-transform: rotate(0deg); }
}
@keyframes swing2 {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    50% { transform: rotate(0deg); }
    75% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}

/**/
.fade-up {
visibility:hidden;
}
.fade_up {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.5s;
 -ms-animation-duration:0.5s;
 animation-duration:0.5s;
 -webkit-animation-name: fade_up;
 animation-name: fade_up;
 visibility: visible !important;
}

@keyframes fade_up {
 0% { opacity: 0;
	 -webkit-transform: translateY(150px);
		 -ms-transform: translateY(150px);
			 transform: translateY(150px);
	}
 100% { opacity: 1;
	 -webkit-transform: translateY(0);
		 -ms-transform: translateY(0);
			 transform: translateY(0);
		}
}

.fade-down {
visibility:hidden;
}
.fade_down {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.5s;
 -ms-animation-duration:0.5s;
 animation-duration:0.5s;
 -webkit-animation-name: fade_down;
 animation-name: fade_down;
 visibility: visible !important;
}

@keyframes fade_down {
 0% { opacity: 0;
	 -webkit-transform: translateY(-150px);
		 -ms-transform: translateY(-150px);
			 transform: translateY(-150px);
	}
 100% { opacity: 1;
	 -webkit-transform: translateY(0);
		 -ms-transform: translateY(0);
			 transform: translateY(0);
		}
}


.fade-scale {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.8s;
 -ms-animation-duration:0.8s;
 animation-duration:0.8s;
 -webkit-animation-name: fade-scale;
 animation-name: fade-scale;
	-webkit-animation-delay: 1.0s;
	animation-delay: 1.0s;
	-ms-animation-delay: 1.0s;
 visibility: visible !important;
}

@keyframes fade-scale {
 0% { -webkit-transform: scale(0.0) ;
	-ms-transform: scale(0.0) ;
	transform: scale(0.0); }
	80% { -webkit-transform: scale(1.05);
	-ms-transform: scale(1.05);
	transform: scale(1.05);}
  100% { -webkit-transform: scale(1.0);
		-ms-transform: scale(1.0);
		transform: scale(1.0);}
}
.fadeInDown_pre {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown_pre;
 animation-name: fadeInDown_pre;
	-webkit-animation-delay: 1.0s;
	animation-delay: 1.0s;
	-ms-animation-delay: 1.0s;
 visibility: visible !important;
}
@keyframes fadeInDown_pre {
 0% { opacity: 0;
	 -webkit-transform: translateY(30px);
		 -ms-transform: translateY(30px);
			 transform: translateY(30px);
	}
	 20% { opacity: 0.7;
	 -webkit-transform: translateY(-15px);
		 -ms-transform: translateY(-15px);
			 transform: translateY(-15px);
		}
  100% { opacity: 1;
	 -webkit-transform: translateY(0);
		 -ms-transform: translateY(0);
			 transform: translateY(0);
		}

}
.pop-fade{
visibility:hidden;
}
.pop_fade {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.5s;
 -ms-animation-duration:0.5s;
 animation-duration:0.5s;
 -webkit-animation-name: pop_fade;
 animation-name: pop_fade;
	-webkit-animation-delay: 2.5s;
	animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
 visibility: visible !important;
}
@keyframes pop_fade {
 0% { opacity: 0;
	 -webkit-transform: translateY(130px) scale(0.01);
		 -ms-transform: translateY(130px) scale(0.01);
			 transform: translateY(130px) scale(0.01);
	}
		80% { -webkit-transform:translateY(-15px) scale(1.05);}
	-ms-transform:translateY(-15px) scale(1.05);}
	transform:translateY(-15px) scale(1.05);}
 100% { opacity: 1;
	 -webkit-transform: translateY(0) scale(1.0);
		 -ms-transform: translateY(0) scale(1.0);
			 transform: translateY(0) scale(1.0);
		}
}
.pop-turn{
visibility:hidden;
}
.pop_turn {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: pop_turn;
 animation-name: pop_turn;
	-webkit-animation-delay: 1.0s;
	animation-delay: 1.0s;
	-ms-animation-delay: 1.0s;
 visibility: visible !important;
}
@keyframes pop_turn {
 0% { opacity: 0;
	 -webkit-transform: rotateY(0deg) translateY(150px) scale(0.1);
		 -ms-transform: rotateY(0deg) translateY(150px) scale(0.1);
			 transform: rotateY(0deg) translateY(150px) scale(0.1);
	}
		100% { opacity: 1;
	 -webkit-transform: rotateY(720deg) translateY(0px) scale(1.0);
		 -ms-transform: rotateY(720deg) translateY(0px) scale(1.0);
			 transform: rotateY(720deg) translateY(0px) scale(1.0);
		}
}
.fade-right{
visibility:hidden;
}
.fade_right {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.5s;
 -ms-animation-duration:0.5s;
 animation-duration:0.5s;
 -webkit-animation-name: fade_right;
 animation-name: fade_right;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
	-ms-animation-delay: 0s;
 visibility: visible !important;
}
@keyframes fade_right {
 0% { opacity: 0;
	 -webkit-transform: translate(250px) ;
		 -ms-transform: translate(250px) ;
			 transform:  translate(250px) ;
	}
		100% { opacity: 1;
	 -webkit-transform: translate(0px) ;
		 -ms-transform: translate(0px) ;
			 transform:  translate(0px) ;
		}
}
.fade-left{
visibility:hidden;
}
.fade_left {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:0.5s;
 -ms-animation-duration:0.5s;
 animation-duration:0.5s;
 -webkit-animation-name: fade_left;
 animation-name: fade_left;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
	-ms-animation-delay: 0s;
 visibility: visible !important;
}
@keyframes fade_left {
 0% { opacity: 0;
	 -webkit-transform: translate(-250px) ;
		 -ms-transform: translate(-250px) ;
			 transform:  translate(-250px) ;
	}
		100% { opacity: 1;
	 -webkit-transform: translate(0px) ;
		 -ms-transform: translate(0px) ;
			 transform:  translate(0px) ;
		}
}
#mainArea .bg_change2 {
 background: url(../../common/images/190608/main_bg2.jpg) center 0;
	    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
	background-size: cover;
}
#mainArea .bg_change {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:3.5s;
 -ms-animation-duration:3.5s;
 animation-duration:3.5s;
 -webkit-animation-name: bg_change;
 animation-name: bg_change;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	-ms-animation-iteration-count: infinite;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
	-ms-animation-delay: 0s;
 visibility: visible !important;
	background: url(../../common/images/190608/main_bg.jpg) center 0;
	height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
	background-size: cover;
	
}
@keyframes bg_change {
 0% { opacity: 1}
	16% { opacity: 0}
	33% { opacity: 1}
	50% { opacity: 0}
	66% { opacity: 1}
	83% { opacity: 0}
	100% { opacity: 1}

}

.de01{
-webkit-animation-delay: 0.25s;
	animation-delay: 0.25s;
	-ms-animation-delay: 0.25s;
}
.de02{
-webkit-animation-delay: 0.5s;
	animation-delay: 0.5s;
	-ms-animation-delay: 0.5s;
}
.de03{
-webkit-animation-delay: 0.75s;
	animation-delay: 0.75s;
	-ms-animation-delay: 0.75s;
}

/**/
.case {
max-width: 1610px;
margin: 0 auto;
padding: 0 1em;
/*border: 1px solid #d80000;*/
}

.grid {
  position: relative;
}
.grid a {
  display: block;
}
.grid .photo {
width: 100%;
/*object-fit: cover;
height: 100%;
font-family: 'object-fit: cover;'; /*IE対策*/
}
.grid-2 .grid .photo,
.grid-4 .grid .photo,
.grid-6 .grid .photo,
.grid-8 .grid .photo,
.grid-10 .grid .photo{
width: 100%;
object-fit: cover;
height: 66%;
font-family: 'object-fit: cover;'; /*IE対策*/
}
@media screen and (max-width: 1170px) {
.grid-2 .grid .photo,
.grid-4 .grid .photo,
.grid-6 .grid .photo,
.grid-8 .grid .photo,
.grid-10 .grid .photo{
width: 100%;
object-fit: cover;
height: 60%;
font-family: 'object-fit: cover;'; /*IE対策*/
}
}/**/
.grid-box {
position: relative;
/*max-width: 1610px;
max-height: 552px;*/
display: -webkit-box; /*Android4.3*/
  display: -moz-box;    /*Firefox21*/
  display: -ms-flexbox; /*IE10*/
  display: -webkit-flex; /*PC-Safari,iOS8.4*/
  display: flex;
  margin-top: 26px;
}

.gl1 {
  float: left;
  width: 45.5%;
  margin-right: 30px;
   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.r_box {
  float:right;
  width: 52.4%;
}
.gl2 {
  float: left;
  width: 48%;
}
.gl3 {
  float: right;
  width: 48%;
}
.gl4 {
  clear: both;
  width: 100%;
  padding-top: 30px;
  
}


.gl5 {
  width: 32.3%;
}
.gl6 {
  width: 32.3%;
  margin-left: 1.5%;
  margin-right: 1.5%;
}
.gl7 {
  width: 32.3%;
}


.gl11 {
  float: right;
  width: 45.5%;
  margin-left: 30px;
   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.l_box {
  float:left;
  width: 52.4%;
}
.gl8 {
  float: left;
  width: 48%;
}
.gl9 {
  float: right;
  width: 48%;
}
.gl10 {
  clear: both;
  width: 100%;
  padding-top: 30px;
}
.gl4 a:hover,.gl10 a:hover {  
 opacity: 0.8;
 filter: alpha(opacity=80);
 -ms-filter: "alpha( opacity=80 )";
 -moz-opacity: 0.8;
 -khtml-opacity: 0.8;
}  

/*ico*/
.ico_star{
position: absolute;
top:46px;
right:0;
z-index: 1001;
}
.ico_repo{
position: absolute;
top:46px;
right:37px;
z-index: 1001;
}
.ico_area{
position: absolute;
top:-8px;
top:46px;
left:8px;
font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
background: #fff;
font-size: 18px;
text-align: center;
padding: 0 6px 0 0;
letter-spacing: 2px;
height: 86px;
z-index: 100;
width: 40px;
}
@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, .ico_area { width: 34px!important; }  
}
.ico_area a{
text-decoration: none;
}
.de_area{
background:rgba(0,0,0,0.6);
background: #fff;
/*position: absolute;
bottom: 0;*/
width: 100%;
min-height: 100px;
padding: 0.5em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
	height: 100%;
}
.de_area .da_tit{
color: #fff;
color: #000;
font-size: 11px;

}

.de_area .da_pri{
color: #fff;
float: right;
font-size: 12px;
}
.de_area .da_pri span{
font-size: 14px;
}

/*202406一時*/
.gl4 {
    display: none;
}
.gl10 {
    display: none;
}
.gl1 {
    width: 32.3%;
	margin-right: 18px;
}
.gl11 {
    width: 32.3%;
	margin-left: 18px;
}
.gl2,.gl3,.gl8,.gl9 {
    width: 49%;
}
.gl1 .de_area .da_tit, .gl11 .de_area .da_tit {
    font-size: 11px!important;
    line-height: 1.5;
}
.r_box,.l_box {
    width: 66.1%;
}
.gl1 .de_area, .gl11 .de_area {
    padding: 0em;
}
/*ここまで202406一時*/

@media screen and (max-width: 768px) {
#mainArea .eye{
margin-bottom: 1.5em;

			}
.grid-box {
  display: block;
  margin-top: 0px;
}

.gl1 {
  float: none;
  width: 100%;
  margin-right: 0px;
  margin-top: 1.5em;
}
.r_box {
  float:none;
  width: 100%;
  margin-top: 1.5em;
}
.gl2 {
  float: none;
  width: 100%;
}
.gl3 {
  float: none;
  width: 100%;
  margin-top: 1.5em;
}
.gl4 {
    clear: both;
    width: 100%;
    padding-top: 1.5em;
}
.gl5 {
  width: 100%;
  margin-top: 1.5em;
}
.gl6 {
  width: 100%;
  margin-left: 0%;
  margin-right: 0%;
  margin-top: 1.5em;
}
.gl7 {
  width: 100%;
  margin-top: 1.5em;
}
.gl11 {
  float: none;
  width: 100%;
  margin-left: 0px;
  margin-top: 1.5em;
}

.l_box {
  float:none;
  width: 100%;
}
.gl8 {
  float:none;
  width: 100%;
  margin-top: 1.5em;
}
.gl9 {
  float:none;
  width: 100%;
  margin-top: 1.5em;
}
.gl10 {
  clear: both;
  width: 100%;
  padding-top: 1.5em;
  
}

}/**/

/*hover*/
/*.button-more{
  outline: none;
  transition: all .2s;
}
.button-more::before,
.button-more::after {
  position: absolute;
  z-index: 2;
  content: '';
  width: 0;
  height: 0;
  border: 4px solid transparent;
}
.button-more::before {
  top: -4px;
  left: -4px;
}
.button-more::after {
  bottom: -4px;
  right: -4px;
}
.button-more:hover {
  color: #3be5ae;
}
.button-more:hover::before,
.button-more:hover::after {
  width: 100%;
  height: 100%;
}
.button-more:hover::before {
  border-bottom-color: #4EB6ED;
  border-left-color: #4EB6ED;
  transition: height .3s, width .3s .3s;
}
.button-more:hover::after {
  border-top-color: #4EB6ED;
  border-right-color: #4EB6ED;
  transition: height .3s, width .3s .3s;
}
*/


a.button-more{
overflow: hidden;
position: relative;
height: 100%;
}
a.button-more .morearea{
    background-image:url(../images/more.png) ,url(../images/bg_black.png);
    background-repeat:no-repeat,repeat;
    background-position:center center,0 0;
    position:absolute;
    top:100%;
    left:0;
    color:#fff;
    -webkit-transition: 0.2s;
    -moz-transition:  0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
    width: 100%;
    height: 100%;
    z-index:1000;
}
a.button-more:hover .morearea{
top:0;
left:0;
}
@media screen and (min-width: 769px) and (max-width: 990px) {
.gl1,.gl11{
height: 345px;
height: auto;
}
.gl2,.gl3,.gl8,.gl9{
height: 189px;
height: auto;
}
.gl2 .da_add,
.gl3 .da_add,
.gl8 .da_add,
.gl9 .da_add,
.gl2 .da_add{
width: 120px;
overflow: hidden;
display: inline-block;
height: 14px;
}
}/**/
@media screen and (min-width: 991px) and (max-width: 1100px) {
.gl1,.gl11{
height: 360px;
height: auto;
}
.gl2,.gl3,.gl8,.gl9{
height: 203px;
height: auto;
}
.gl4 a,.gl10 a {
height: 128px;
height: auto;
}
.gl2 .da_add,
.gl3 .da_add,
.gl8 .da_add,
.gl9 .da_add,
.gl2 .da_add{
width: 120px;
overflow: hidden;
display: inline-block;
height: 14px;
}
}/**/
@media screen and (min-width: 1101px) and (max-width: 1300px) {
.gl1,.gl11{
height: 400px;
height: auto;
}
.gl2,.gl3,.gl8,.gl9{
height: 218px;
height: auto;
}
.gl4 a,.gl10 a {
height: 152px;
height: auto;
}
}/**/
@media screen and (min-width: 1301px) and (max-width: 1540px) {
.gl1,.gl11{
height: 460px;
height: auto;
}
.gl2,.gl3,.gl8,.gl9{
height: 248px;
height: auto;
}
.gl4 a,.gl10 a {
height: 182px;
height: auto;
}
}/**/
@media screen and (min-width: 1541px)  {
.gl1,.gl11{
height: 540px;
height: auto;
}
.gl2,.gl3,.gl8,.gl9{
height: 296px;
height: auto;
}
.gl4 a,.gl10 a {
height: 214px;
height: auto;
}
}/**/
a.button-more img{
width: 100%;
/*height: 100%;

object-fit: cover;
font-family: 'object-fit: cover;';*/
}

/**/
a.button-more{
text-decoration: none;
}
.de_top{
padding: 5px;
background: #d80000;
background: linear-gradient(to bottom, #006DD9, #4DA6FF);
}

.da_kodate{
background: #fff;
padding: 0 5px;
font-size: 10px;
font-weight: 700;
}

.da_add{
font-size: 13px;
color: #fff;
text-shadow: #000 1px 1px 3px;
}
.da_pri{
float: right;
color: #fff;
text-shadow: #000 1px 1px 3px;
}
.da_pri span{
font-weight: bold;
font-size: 200%;
}
.ico_urinusi{
background: #d80000;
color: #fff;
float: right;
padding: 2px 5px;
}

.bg_red_gra{
background: linear-gradient(to bottom, #d80000, #D96D00);
}
.bg_green_gra{
background: linear-gradient(to bottom, #00B200, #85B200);
}
.gl1 .de_area .da_tit,
.gl11 .de_area .da_tit{
font-size: 15px;
line-height: 1.5;
}
.gl1 .de_area,
.gl11 .de_area{
padding: 1em;
}
.grid-2 .de_area .da_tit,
.grid-4 .de_area .da_tit,
.grid-6 .de_area .da_tit,
.grid-8 .de_area .da_tit,
.grid-10 .de_area .da_tit{
font-size: 13px;
}

.thumbnail
{
    position:relative;
}
.thumbnail .openhouse_icon
{
    position:absolute;
    bottom:5px;
    right:5px;
    width: 74px;
}
.thumbnail .panorama_icon
{
    position:absolute;
    top:5px;
    left:5px;
    width: 90px;
    background-color:rgba(255,255,255,0.6);
    border-radius:10px;
    padding:5px;
}
.hosyou_btn{
	position: absolute;
    right: 1%;
    bottom: 130px;
    width: 24%;
	opacity: 0;
	display: none;
}
@media screen and (max-width: 768px)  {
	.hosyou_area{
		display: flex;
	}
	
}/**/