@charset "UTF-8";
body {
	margin:0;
	font-family: 'Jost','Noto Sans JP', sans-serif;
	font-size: 12px;
	/* background-color:#000; */
	/* background-image:
	url(../images/bg.jpg); */
	background-repeat:
	repeat-y;
}
ul{list-style: none;}
#topwrap{
	width:800px;
	background-position:
	left top;
	margin: 0 auto;
}

#ctcwrap{
	width:800px;
	background-position:
	left top;
	margin: 0 auto;
}
@media screen and (max-width:768px) {
#ctcwrap{
	width:100%;
	background-position:
	left top;
	margin: 0 auto;
}	
#topwrap{
	width:100%;
}
}


#contents01 {
	width:800px;
	margin:0;
	background-position: left top;
}
@media screen and (max-width:768px) {
#contents01 {
	width:100%;
	margin:0;
	background-position: left top;
}	
}
/*----content02 Start----*/
#contents02 {
	width: 800px;
	/* height:440px; */
	/* background-image:
	url(../contact/images/map_bg.jpg); */
	margin: 0px auto 0;
	display: flex;
	flex-direction: revert;
	}

@media screen and (max-width:768px) {
#contents02 {
	flex-direction: column;
	padding: 0 25px;
	width: 100%;
	}	
}



#contents02 .tit {
	margin-top:8px;
	margin-bottom:10px;
	display:block;
	text-align:center;
}

#contents02 .lbox {
	/* float:
	left; */
	width:280px;
	/* padding-top:20px; */
	/* padding-left:20px; */
	margin-bottom:30px;
	margin-right: 40px;letter-spacing:1px;
	line-height:18px;
	/* color: #000; */
	font-size: 13px;
}

#contents02 .lbox a{
	display: inline-block;
	background-color: #000;
	color: #fff!important;
	text-decoration: none!important;
	padding: 5px 10px;
	font-size: 12px;
	margin: 10px 0;
	cursor: pointer;
	min-width: 135px;
}

#contents02 .lbox a:hover{
	opacity:0.75;
}



@media screen and (max-width:768px) {
#contents02 .lbox {
	/* float:
	left; */
	width:100%;
	/* padding-top:20px; */
	padding-right: 20px;
	margin-bottom:30px;
	margin-right: 40px;
	letter-spacing:1px;
	line-height:18px;
	/* color: #000; */
	font-size: 13px;
	line-height: 1.6;
}	
}


#contents02 .rbox {
	/* float:right; */
	width: 100%;
	padding-top:0px;
	margin-bottom:10px;
	display:
	block;
	background-color: #FFFFFF;
}

#contents02 .rbox2 {
	/* float:
	right; */
	/* width:400px; */
	padding-top:0px;
	display:
	block;
	/* color:#CCC; */
	letter-spacing:1px;
	line-height:16px;
	text-align:
	center;
	margin-top: 10px;
}
/*----content02 End----*/


/*----content03 Start----*/
#contents03 {
	width:716px;
	height:524px;
	background-image:url(../arrival/images/arvl_bg.jpg);
	margin-top:57px;
	margin-left:83px;
	}

#contents03 .tit {
	margin-top:8px;
	margin-bottom:10px;
	display:block;
	text-align:center;
}

/*----content03 End----*/


#area01 {
	width:800px;
	margin-top:5px;
	margin-left:10px;
	background-position: left top;
}

#main01 {
	width:800px;
	margin:0;
}

#area02 {
	width:460px;
	height:300px;
	/*float:left;*/
	padding-top:10px;
	padding-left:10px;
	color:#FFF;
	font-size:95%;	
}


#area02 .a02{
	margin-top:5px;
	margin-bottom:20px;
	line-height:14px;
	letter-spacing:1px;
	color:#999;
}


#area03 {
	width:310px;
	height:340px;
	/*float:right;*/
	padding-top:10px;
	margin-left:20px;
	margin-bottom:20px;
	background-color:#000000;
	color:#FFF;
	line-height:14px;
	letter-spacing:1px;
}

#area03 .tit{
	width:310px;
	height:32px;
	display:block;
	margin-top:10px;
	margin-bottom:30px;
	background-color:#000000;
}

#area03 .spc{
	width:310px;
	height:30px;
	display:block;
}

#contents02 .spc{
	width:270px;
	height:20px;
	display:block;
}

#contents02 .dot{
	border-bottom:
	dashed 1px;
	margin-top:20px;
	margin-bottom:30px;
	text-align:
	center;
	/* border-bottom-color:#FFF; */
}

#contents02 a:link{
	color:#1F616C;
	text-decoration:underline;
}

#contents02 a:visited{
	color:#666;
	text-decoration:underline;
}

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


#area03 a:link{
	color:#1F616C;
	text-decoration:underline;
}

#area03 a:visited{
	color:#666;
	text-decoration:underline;
}

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


td {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

th {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.bodystyle {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.small {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 9px;
}

.medium {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.big {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 16px;
}

.xbig {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 24px;
}

.expanded {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	letter-spacing: 2px;
}

.justified {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align: justify;
}

.footer {
	font-family: "Times New Roman", Times, serif;
	font-size: 9px;
	color: #999999;
}

.box1 {
	padding: 3px;
	border-width: thin;
	border-style: solid;
	border-color: #CCCCCC #666666 #666666 #CCCCCC;
}

.box2 {
	font-style: italic;
	word-spacing: 2pt;
	padding: 3px;
	border-width: thin;
	border-style: solid;
}

.pc{
    display: block;
}

.sp{
    display: none;
}

.contents01 img.sp{
    margin: 0 auto;
}

.info{
	display: block;
	margin: 0 auto;
	text-align: center;
	font-size: 16px;
	color: #fff;
	text-decoration: none;
	background-color: #838383;
	max-width: 200px;
	padding: 5px;
}
.info:hover{
	opacity:.75;
}
@media screen and (max-width:768px) {
.pc{
    display: none;
}

.sp{
    display: block;
}
	.info{
	font-size: 14px;
}
}

.page-title{
	max-width:240px;
	margin: 30px auto 25px;
	display: block;
}

.page-logo-title{
	max-width:280px;
	margin: 30px auto 25px;
	display: block;
}




@media screen and (max-width:768px) {
.page-title{
	max-width: 60%;
	margin: 40px auto 35px;
	display: block;
	/* box-sizing: border-box; */
}

}

iframe {
  width: 100%;
  aspect-ratio: 16/11;
}

@media screen and (max-width:768px) {
iframe {
  width: 86%;
  aspect-ratio: 16/11;
}	
}

.tit{
	width:100%;
}

.top-main{
	width: 100%;
}

.info-box{
	display: flex;
	padding: 0;
}

.tokyo li.left{
	max-width: 280px;
	margin-right: 20px;
}

.osaka li.left{
	max-width: 380px;
	/* margin-right: 20px; */
}
.tokyo li.left img{
	width: 100%;
}
.osaka li.left img{
	width: 100%;
}

.tokyo li.right{
	max-width: 500px;
}

.osaka li.right{
	max-width: 420px;
}
.tokyo li.right img{
	width: 100%;
}
.osaka li.right img{
	width: 100%;
}
.map-caption{text-align: center;font-size: 12px;font-weight: normal;}
.caption{
	padding: 26px 30px;
	font-size: 13px;
	line-height: 1.8;
	border: 1px solid #ed6c00;
	/* margin-top: 40px; */
	margin: 40px auto 0;
	max-width: 520px;
}

.caption span{
	display:block;
}


.cap-title{
	display: block;
	margin: 0 0 17px;
	max-width: 204px;
}


@media screen and (max-width:768px) {
.info-box{
	display: flex;
	padding: 0;
	flex-direction: column;
}
.tokyo li.left{
	max-width: 100%;
	margin-right: 0px;
	padding: 0 20px;
}
.osaka li.left{
	max-width: 77%;
	margin-right: 0px;
	padding: 0 20px;
}
.tokyo li.right{
	max-width:100%;
	padding: 0 20px;
}
.osaka li.right{
	max-width:100%;
	padding: 0 20px;
}
.caption{
	padding: 25px;
	margin: 0 20px;
}
	.caption{
	line-height: 1.6;
	margin-top: 40px;
}

.caption span{
	display:block;
	margin:0 0 10px;
}


.cap-title{
	display: block;
	margin: 0 auto 20px;
	max-width: 200px;
}
}

.company-table{
	width: 680px;
	margin: 0 auto;
}

.company-table th,
.company-table td{
	padding: 12px 0;
	font-size: 14px;
}

.company-table th{
	width:20%;
	background-color: #b1aeae;
	color:#fff;
}

.company-table td{
	padding-left: 20px;
}

@media screen and (max-width:768px) {
.company-table{
	width: calc(100% - 40px);
	margin: 0 auto;
}
	.company-table th,
.company-table td{
	padding: 10px 0;
	font-size: 13px;
}
	.company-table th{
	width:25%;
}
	.company-table td{
	padding-left:15px;
}
}

/*///////////*/

#wrap {
 display:flex;
 display: -webkit-box;
 display: -webkit-flex;
 display: -ms-flexbox;
 -webkit-box-align: stretch;
 -webkit-align-items: stretch;
 -ms-flex-align: stretch;
 align-items:stretch;
 flex-wrap: wrap;
 width: 100%;
 padding:0;
 margin:0 auto 30px;
 position: relative;
 flex-shrink: 0;
 height: 684px;
}
#wrap:before{
  content: "";
  display: block;
  padding-top: 57%;
}

#slider {
   width: 75%;
   margin: 0 2% 0 0;
   position:
   absolute;
   top:0;
   left:0;
}

#slider li{
  width:100%;
  height: 700px;
  position: relative;
  flex-shrink: 0;
  }
@media screen and (max-width:768px) {
#slider li{
  width:100%;
  height: 671px;
  position: relative;
  flex-shrink: 0;
  }	
}
@media screen and (max-width:640px) {
#slider li{
  width:100%;
  height: 400px;
  position: relative;
  flex-shrink: 0;
  }	
}

#slider li:before{
  /* content: ""; */
  /* display: block; */
  /* padding-top: 65.4%; */
}

.slide-item img {
   position:absolute;
   top:0;
   left:0;
   width: 100%;
   height:auto;
   object-fit: contain;
}

#thumbnail-list {
  width: 12%;
  margin-right: 0;
  display:
  flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items:
  stretch;
  flex-wrap: wrap;
  flex-flow: column wrap;
  justify-content: flex-start;
  position:
  absolute;
  top:0;
  right: 5%;
  height: 43%;
  }

#thumbnail-list .thumbnail-item:nth-child(9n){
  margin-right:8%;
  margin-bottom: 0;
  box-sizing: border-box;
  position: relative;
}

.thumbnail-item {
  width:
  calc(50% - 5%);
  margin-right: 10%;
  margin-bottom: 12%;
  box-sizing: border-box;
  position: relative;
}
.thumbnail-item:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.thumbnail-item.thumbnail-current {
  opacity: 0.4;
}
.thumbnail-item img {
   position:absolute;
   top:0;
   left:0;
   width: 100%;
   height: 100%;
   margin: 0 auto;
   object-fit: cover;
   flex-shrink: 0;
   }

@media screen and (max-width: 768px){
#wrap {
 margin:0 auto 5px;
}
}

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

#wrap {
 width: 91%;
 height: auto;
}
#slider {
  width:100%;
  margin: 0 auto 20px;
  position:
  static;
  padding: 0 20px;
}

#thumbnail-list {
  width: 100%;
  margin:15px 0 0;
  display:
  flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items:
  stretch;
  flex-wrap: wrap;
  flex-flow: row wrap;
  justify-content: flex-start;
  position:
  static;
  height:100%;
  padding: 0 20px;
  }

#thumbnail-list .thumbnail-item:nth-child(9n){
  margin-right:2%;
  margin-bottom: 5%;
  box-sizing: border-box;
  position: relative;
}

#thumbnail-list .thumbnail-item:nth-child(6n){
  margin-right: 6%;
  margin-bottom: 5%;
  box-sizing: border-box;
  position: relative;
}

.thumbnail-item {
  width:15%;
  margin-right: 6%;
  margin-bottom: 5%;
  box-sizing: border-box;
  position: relative;
}
#thumbnail-list li:nth-child(5n) {
  width:15%;
  margin-right: 0;
  margin-bottom: 5%;
  box-sizing: border-box;
  position: relative;
}
}

.message{
	text-align: center;
}

h1.info-title{
	text-align: center;
	font-size: 27px;
	margin: 45px auto 33px;
	font-weight: 500;
}


.message{
	font-size: 14px;
	margin: 40px auto;
	line-height: 1.6;
	letter-spacing: 0.06em;
}

.message .kakomi{
	display: block;
	font-size: 12px;
	margin-top: 5px;
	letter-spacing: 0;
}

.message .kakomi a{
	font-size: 110%;
	line-height: 1.7;
	color: #000;
	letter-spacing: 1px;
}

.print{
	display: block;
	margin: 0 auto;
	width: 300px;
	text-align: center;
	color: #fff;
	text-decoration: none;
	background-color: #ed6c00;
	padding: 15px 0;
	font-size: 15px;
	font-weight: 500;
}


@media screen and (max-width: 640px){
h1.info-title{
	font-size: 23px;
	margin: 30px auto 30px;
}	
.message{
	letter-spacing: 0;
	padding: 0 20px;
}
.print{
		display: none;
}
}

#topwrap-renew{
	width:100%;
	background-position:
	left top;
	margin: 0 auto;
	position: relative;
}

#topwrap-renew .visual-container{
	display: flex;
	height: calc(100vh - 90px);
}

#topwrap-renew .visual-container .left,
#topwrap-renew .visual-container .right{
	width: calc(100% / 2);
}

#topwrap-renew .visual-container .left{
	box-sizing: border-box;
    background: url(../images/left-back.jpg) no-repeat center center;
    background-size: cover;
}
#topwrap-renew .visual-container .right{
	box-sizing: border-box;
    background: url(../images/right-back.jpg) no-repeat center center;
    background-size: cover;
}

#topwrap-renew .logo-posi{
	position: absolute;
	top: 23vh;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 400px;
}

#topwrap-renew .visual-container .left img,
#topwrap-renew .visual-container .right img{
	/* object-fit: contain; */
	margin: 2rem auto;
	display: block;
	height: calc(83vh);
}

.info-text{
	font-size: 14px;
	text-align: center;
	margin: 0 2rem 6rem;
	line-height: 1.8;
}

.preparation{
	text-align: center;
	width: 100%;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	letter-spacing: 8px;
}

.top-visual{
	max-width: 1200px;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
}

.top-visual img{
	width: 100%;
}

.top-visual .dots{
	    position:absolute;
	    top: 0;
	    left:0;
	    width: 120%;
	    height:100%;
	    background-image: url(https://gigaplus.makeshop.jp/dplusemarket/img/black_dots.svg);
	    background-repeat: repeat;
	    background-size:3px 3px;
	    opacity: 0.4;
	    margin: -6px 0 6px;
}

.top-visual .center-box{
	position: absolute;
	z-index: 10;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 260px;
}

.top-visual .center-box .center-logo{
	margin-top: 120px;
}



.top-visual .center-box a{
	background-color: #fff;
	display: block;
	text-align: center;
	padding: 12px;
	font-size: 14px;
	text-decoration: none;
	color: #000;
	position: relative;
	margin-top: 120px;
}

.top-visual .center-box a:hover{
	opacity:0.75;
	  transition: 0.3s ease;
}

@media screen and (max-width:768px) {
.top-visual .center-box .center-logo{
	margin-top: 80px;
}

.top-visual .center-box a{
	margin-top: 80px;
}
	.sp{
    display: none;
}
}

@media screen and (max-width:640px) {
.top-visual .center-box{
	position: absolute;
	z-index: 10;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 140px;
}
.top-visual .center-box a{
	display: none;
}
.top-visual .center-box .center-logo{
	margin-top: 0px;
}
	.top-visual .dots{
	    background-size:2px 2px;
}
.sp{
    display: block;
}
.button {
	background-color: #000;
	display: block;
	text-align: center;
	padding: 10px;
	font-size: 13px;
	text-decoration: none;
	color: #FFF;
	position: relative;
	max-width:180px;
	margin:30px auto 60px;
}