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


/*---------------------------------------
　共通
---------------------------------------*/
*{
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

img {
    vertical-align: bottom;
    margin: 0;
}

.img_auto {
	width: 100%;
	height: auto;
}

ul, li {
	list-style: none;
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	color: #000;
	transition: 0.5s;
}




/*====================================
PC版
=====================================*/
@media (min-width: 621px) {

body {
	font-size: 16px;
	line-height: 1;
}

.pc_box {
	padding: 0;
	margin: 0;
}

.sp_box {
	display: none;
}



.top_img {
    width: 100%;
    min-width: 1400px;
    position: fixed;
    top: 0;
    z-index: -1;
}

.top_img_dummy {
    width: 100%;
    min-width: 1400px;
}

.container {
    width: 100%;
    min-width: 1400px;
    background: #FFF;
    position: relative;
}



.com_name_box {
    width: 100%;
    min-width: 1400px;
    position: relative;
    /*background: yellow;*/
}

.com_name {
    position: absolute;
    top: 90px;
    left: 90px;
    z-index: 2;
}

.wall01 {
    background: url("pc_com_about_wall.jpg");
}

.wall02 {
    background: url("pc_com_active_wall.jpg");
}

.wall03 {
    background: url("pc_com_spots_wall.jpg");
}

.wall04 {
    background: url("pc_foot_wall.jpg");
}

.wall05 {
    background: url("pc_slash_red-clear.png") no-repeat left bottom;
}

.wall06 {
    background: url("pc_top_merit_wall.jpg") repeat-x left top;
}


.wrap {
	width: 100%;
    max-width: 1400px;
	margin: 0 auto;
    text-align: center;
	/*background: pink;*/
}

.img_left {
    text-align: left !important;
}

.wrap-mg {
    position: absolute;
    top: -300px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
}


/* 回転アニメーションの定義 */
@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.soon_txt {
    position: absolute;
    top: -300px;
    left: 70%;
    z-index: 11;
}

/* 回転する要素のスタイル */
.soon {
  position: absolute;
  width: 284px;
  height: 284px;
  top: -300px;
  left: 70%;
  transform: translateX(70%);
  animation: rotateAnimation 20s linear infinite;
  z-index: 10;
}

.soon_shadow {
  position: absolute;
  width: 284px;
  height: 284px;
  top: -299px;
  left: 70.2%;
  transform: translateX(70.2%);
  animation: rotateAnimation 20s linear infinite;
  z-index: 9;
}




.top_nav {
	width: 100%;
	position: fixed;
	top: 0;
	background-image: url("pc_top_head_bg.png");
    background-repeat: repeat-x;
    background-position: left top;
    z-index: 999;
}


.nav {
	width: 100%;
	position: fixed;
	top: 0;
	background-image: url("pc_com_head_bg.jpg");
    background-repeat: repeat-x;
    background-position: left top;
    z-index: 999;
}

ul.sld_area {
    padding-top: 450px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-content: center;
    background: #FFF;
}



}

/*  PC版ここまで  */




/*===================================
スマホ版
===================================*/
@media (max-width: 620px) {

body {
	padding: 0;
	margin: 0;
}

.pc_box {
	display: none;
}

.sp_box {
	padding: 0;
	margin: 0;
}

.container {
    width: 100%;
    position: relative;
    overflow-x: hidden;
}

.wrap {
	width: 100%;
	padding: 0;
	margin: 0 auto;
}

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

.nav {
	width: 100%;
    position: fixed;
    top: 0;
    background-repeat: repeat-x;
    background-position: left top;
    background-color: #FFF;
    padding-top: env(safe-area-inset-top);
    height: calc(10px + env(safe-area-inset-top));
    z-index: 999;
}


/* 回転アニメーションの定義 */
@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.soon_txt {
    position: absolute;
    width: 26%;
    bottom: 50px;
    left: 77%;
    z-index: 11;
}

/* 回転する要素のスタイル */
.soon {
  position: absolute;
  width: 26%;
  bottom: 50px;
  left: 77%;
  transform: translateX(70%);
  animation: rotateAnimation 20s linear infinite;
  z-index: 10;
}

.soon_shadow {
  position: absolute;
  width: 26%;
  bottom: 48px;
  left: 77.6%;
  transform: translateX(70.2%);
  animation: rotateAnimation 20s linear infinite;
  z-index: 9;
}

.soon_txt img,
.soon img,
.soon_shadow img {
    width: 100%;
    height: auto;
}



}

/*  スマホ版ここまで  */