@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Expletus+Sans');
/* font-family: 'Expletus Sans', cursive; */
@import url('https://fonts.googleapis.com/css?family=Yellowtail');
/* font-family: 'Yellowtail', cursive; */
@import url('https://fonts.googleapis.com/css?family=EB+Garamond');
/* font-family: 'EB Garamond', serif; */


/*--■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ 

    パソコン・スマホ切り替え
    
    ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}


/*--■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ 

    フォント
    
    ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */


.dela-gothic-one-regular {
  font-family: "Dela Gothic One", sans-serif;
  font-weight: 400;
  font-style: normal;
}





/* header-fixed スクロールすると出てくるヘッダー */
.header-fixed{
	width: 100%;
	top: 0;
	left: 0;
	padding: 5px 10px;
	text-align: center;
	position: fixed; /* ヘッダー固定 */
	z-index: 1;
	background: rgba(30,30,30,0.9);
	/*background: rgba(240,010,010,0.8);*/
	color: #fff;
	padding-top: 10px;
}
.header-fixed-logo{
	width: 40%;
	margin: auto;	
}
.header-fixed-gnav{
	width: 90%;
	text-align: center;
	margin: auto;
	line-height: 1.2;
}
.header-fixed-gnav-list li{
	font-size: 12px;
	letter-spacing: 0.05em;
	display: inline-block;
	margin: 3px;
}
.header-fixed-gnav-list a{
	color: #fff;
}
.header-fixed-gnav-list li a:hover{
	padding-bottom: 5px;
	border-bottom: solid 5px #fff;
	text-decoration: none;
	opacity: 0.8;
}
span.japanese{
	display: none;
}

/* headerメディアクエリ 480px以上*/
@media (min-width: 479px) {
	.header-fixed-logo{
		width: 25%;
	}
}
/* header-fixedメディアクエリ 768px以上*/
@media (min-width: 767px) {
	.header-fixed-gnav-list li{
		font-size: 12px;
		letter-spacing: 0.1em;
		margin: 6px;
	}
	.header-fixed-inner{
		display: flex;
	}
	.header-fixed-logo{
		width: 30%;	
	}
	.header-fixed-gnav{
		width: 70%;
		text-align: right;
	}
}
/* header-fixedメディアクエリ 1200px以上*/
@media (min-width: 1199px) {
	.header-fixed-inner{
		width: 1199px;
		margin: auto;
	}
}

/* 通常のヘッダー */
.header::before{
	content:"";
  display:block;
  position:fixed;
  top:0;
  left:0;
  z-index:-1;
  width:100%;
  height:100vh;
  background:url(images/title_bg_blue.jpg) center no-repeat;
  background-size:cover;

  /*
	width: 100%;
	padding: 24px 0;
	text-align: center;
	background: url(images/title_bg_blue.jpg) center center fixed no-repeat;
	background-size: cover;
	color: #fff;
	*/
	
}

.header-logo{
	width: 100%;
	margin: auto;
}
.header-gnav{
	width: 70%;
	margin: 20px auto;
}
.header-gnav-list li{
	font-size: 10px;
	font-family: 'Marcellus', serif;
	letter-spacing: 0.05em;
	display: inline-block;
	margin: 3px;
	padding-right: 0.7em;
	border-right: solid 1px #fff;
}
.header-gnav-list li:last-child{
	border-right: none;
}
.header-gnav-list a{
	color: #fff;
}
.header-gnav-list li a:hover{
	padding-bottom: 5px;
	border-bottom: solid 5px #fff;
	text-decoration: none;
	opacity: 0.8;
}
span.japanese{
	display: none;
}

.intro-headline{
	font-size: 1.75em;
	font-weight: bold;
	color: #fff;
	margin-bottom: 36px;
	line-height: 1.5;
}

.intro-headline span{
	font-size: 0.8em;
	font-weight: bold;
}

.intro{
	width: 90%;
	font-size: 14px;
	margin: 68px auto;
	text-align: left;
}
.intro-summary{
	color: #fff;
	font-size: 120%;
	line-height: 1.75;
	margin-bottom: 24px;
}



.shadow{
	text-shadow: 2px 2px 16px #ff9d00 ;
}

.shadow_none{
	text-shadow:none;
}



.txt_box{
	padding:8px 0;
	max-height: 13em;
	min-height: 10.1em;
	width: 100%;
	overflow: hidden;
}

.txt_box p{
	font-size: 1.2em;
	font-weight: bold;
}

.txt_box span:first-child{
 font-size: 0.8em;
 display: block;
}

.txt_box span:nth-child(n+2){
	display:inline-block ;
	font-size: 16px;
	padding: 1px 20px;
	border-radius: 7px;
	text-align: center;
	margin-top: 5px;
}

.used{
	color: red;
	border:solid 0.15em red;
}

.new{
	color: green;
	border:solid 0.15em green;
}

.vintage{
	color: brown;
	border:solid 0.15em brown;
}

.outlet{
	color: orange;
	border:solid 0.15em orange;
}


.images {
  object-fit: cover;
  object-position: center center;
  width: 100%;
  height: 250px;
  overflow: hidden;
}


@media (min-width: 479px) {
.images	{
  height: 200px;
  overflow: hidden;
  }
}

@media (min-width: 767px) {
.images	{
  height: 400px;
  overflow: hidden;
	}
}

@media (min-width: 991px) {
.images	{
  height: 300px;
  overflow: hidden;
	}
}


/* header-fixedメディアクエリ 1200px以上*/
@media (min-width: 1199px) {
.images	{
  height: 350px;
  overflow: hidden;
	}
}




.btn_box a{
	color: #fff;
	border:solid 2px #fff;
	background: #ff5656;
	font-size: 16px;
	text-align: center;
	text-decoration: none;
	padding:6px 0px;
	border-radius: 20px;
	width: 100%;
	display: block;

	transition : 0.15s;　/*ふわっとさせる指定*/
}

.btn_box a:hover{
	color: #ff5656;
	border:solid 2px #ff5656;
	background: #fff;
	border-radius: 20px;
}

.btn_box a span:first-child{
	display: normal;
}

.btn_box a span:last-child{
	display: none;
}


.sold a{
	color: #ccc;
	border:solid 2px #fff;
	background: #f1f1f1;
	font-size: 16px;
	text-align: center;
	text-decoration: none;
	padding:6px 0px;
	border-radius: 20px;
	width: 100%;
	display: block;
	pointer-events: none;
}

.sold a span:first-child{
	display: none !important;
}

.sold a span:last-child{
	display: normal !important;
}




.aoboshi-one-regular {
  font-family: "Aoboshi One", serif;
  font-weight: 400;
  font-style: normal;
}



.shop-floor h3,h2{
		color: #333;
		text-align: center;
		font-size: 1.0em;
	}


@media (min-width: 479px) {

	.shop-floor h2{
		font-size: 0.80em;
		display:block !important;
	}

	.shop-floor h3{
		line-height: 1.0;
		font-size: 2.0em;
	}

	.shop-floor h3 span{
		font-size: 0.8em !important;
	}

}


@media (min-width: 991px) {


	.shop-floor h2{
		font-size: 0.80em;
	}

	.shop-floor h3{
		line-height: 1.25;
		font-size: 3.0rem;
	}

	.shop-floor h3 span{
		font-size: 0.8em !important;
	}

}






@media (min-width: 479px) {
	.header-logo{
		width: 380px;
	}
	.header-gnav{
		margin-top: 35px;
	}
	.header-gnav-list li{
		font-size: 12px;
		margin: 3px;
	}
}
@media (min-width: 767px) {
	.header-logo{
		width: 540px;
	}
	.header-gnav{
		margin-top: 35px;
	}
	.intro{
		width: 70%;
		font-size: 18px;
	}
	.intro-headline{
		/*font-size: 48px;  オリジナル*/
		font-size: 48px;
		margin-bottom: 64px;
		/*margin: auto;*/
	}



}
@media (min-width: 991px) {
	.header-logo{
		width: 1000px;
	}
}
.content-heading-center-2{
	font-size: 64px;
	text-align: center;
	margin-top: 0;
	margin-bottom: 1em;
	margin-bottom: 48px;
	color: #0075d6;

}
.content-heading-center-2 span{
	padding-bottom: 3px;
	border-bottom: solid 2px #0075d6;
}
.content-heading-center-2 p{
	font-size: 18px;
}



.shop-logo{
	width: 80%;
	margin: 0 auto 24px auto;
	filter: drop-shadow(2px 2px 2px #aaf);
}
.shop-name{
	font-size: 14px;
	text-align: center;
}
.shop-name span{
	width: 3rem;
	height: 3rem;
	padding: 0.35rem;
	margin-right: 0.5rem;
	border-radius: 50%;
	color: #fff;
	background: #0075d6;
}
.top-campaign{
	color: #333;
	padding: 8px 36px;
}
.top-campaign-thumbnail{
	margin-bottom: 12px;
}
.top-campaign-title{
	font-size: 1.25em;
	font-weight: bold;
	margin-bottom: 16px;
}
.top-campaign-date{
	font-size: 20px;
	margin-bottom: 16px;
}
.top-campaign-summary{
	font-size: 16px;
}
.btn-simple{ /* commonを上書き */
	margin: 8px;
	padding: 3px;
}
p.summary{
	font-size: 14px;
}
a:hover{
	opacity: 0.8;
}
a img{
	transition-property: opacity;
	transition-duration: 0.6s;
}
a img:hover{
	opacity: 0.6;
}

@media (min-width: 767px) {
	.shop-floor{
		margin: 0 auto 68px auto;
	}
	.shop-logo{
		width: 50%;
		margin: 0 auto 24px auto;
	}
	.top-campaign-title{
		font-size: 1.25em;
		font-weight: bold;
		margin-bottom: 16px;
	}
	.top-campaign-date{
		font-size: 28px;
		margin-bottom: 16px;
	}
}
@media (min-width: 767px) {
	.benefit-row{
		width: 767px;
		margin: auto;
		text-align: center;
	}
}
.benefit{
	color: #0075d6;
}
.container-access{
	background-size: contain;
}
.btn-blue{
	background: #0075d6;
	color: #fff;
	border: solid 1px #0075d6;
}
.btn-blue:hover{
	background: #1e73a0;
	color: #fff;
}







/*アーティスト*/
#Container{
	transition: 0.8s;
}

.box_artist{
	
}

.mix{

}

/* headerメディアクエリ 480px以上*/
@media (min-width: 379px) {
	.box_artist{
		padding: 6px;
		margin: 16px 0 8px 0;
		border-radius: 11px;
		background: #f1f1f1;
		height:200px;
		width: 100%;
	}

	.box_model{
		padding: 6px;
		margin: 16px 0 8px 0;
		border-radius: 11px;
		border: solid 1px #ccc;
		height:200px;
		width: 100%;
	}

	.box_artist h1{
		font-size: 1.0em;
	}

	.mix{
		margin-bottom: 36px;
	}
}

/* header-fixedメディアクエリ 768px以上*/
@media (min-width: 767px) {
	.box_artist{
		height:220px ;
	}

	.box_model{
		height:220px ;
	}

	.mix{
		margin-bottom: 36px;
	}
}


/* header-fixedメディアクエリ 1200px以上*/
@media (min-width: 1199px) {
	.box_artist{
		height:280px ;
	}

	.box_model{
		height:240px ;
	}

	.mix{
		margin-bottom: 54px;
	}
}


#Container{

}

#Container img{
	border-radius: 3px;
	margin-bottom: 8px;
}

#Container h1{
	font-size: 1.2em;
	line-height: 1.35;
	color: #333;
}

#Container h2{
	font-size: 1.0em;
	color: #333;
}

#Container p{
	margin-top: 12px;
	font-size: 0.65em;
	color: #333;
	width: 100%;
	word-break: normal!important;
}


.box_event{
	flex-direction: column;
}

.box_event p{
	text-decoration: none;
	font-size: 1.0em;
}

.box_event a{
	text-decoration: none;
}
.box_event a i{
	width: 1.5em;
}

.box_event h6{
	font-size: 1.5em;
	font-weight: bold;
	color: #ff6347!important;
	padding: 12px;
	border-radius: 6px;
	text-align: center;
	line-height: 1.3;
	background: #f1f1f1;
}

.box_event h6 span{
	font-size: 0.6em;
	font-weight: normal;
}



.pt_100{padding-top:100px;}
.kadoR_6{border-radius: 6px;}
.kadoR_12{border-radius: 12px;}





h1{

}

h2{

}

.box_event h3 span{
	font-size: 0.6em !important;
	font-weight: bold;
	margin-bottom: 8px;
	line-height: 1.75;
}

.box_event h3{
	font-size: 1.4em;
	font-weight: bold;
}

.box_event h4{
	font-size: 1.8em;
}

.box_event h4 span{
	font-size: 0.6em;
	font-weight: bold;
	margin-right: 5px;
}

.box_event h5{
	font-size: 1.6em;
}

.box_event h5 span{
	color: #ff6347;
	font-size: 0.5em;
	padding: 2px 18px;
	border:solid 1px #ff6347;
	border-radius: 4px;
	vertical-align:35%;
	margin-right: 12px;
}





/*スポンサー*/
.mp-0{margin: 0; padding: 0;}

.project{
	font-size: 18px;
	color: #fff;
}



.kadomaru_box_red{
	background: #f62e36 ;
	border-radius: 3px;
	padding: 2px 20px;
	color: #fff;
	font-size: 90%;
	font-weight: bold;
	margin-right: 10px;
}




/*画像の上に文字*/
/*--■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ 

    画像の上に文字
    
    ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */

.kasaneru{
  position: relative;/*親要素にrelative*/
}

.kasaneru p{
  position: absolute;/*重ねたい子要素にabsolute*/
  bottom:-0%;
  left: 0%;

  color: #fff;
  font-size: 1.8rem;
  margin: 0!important;/*文字がずれている場合や*/
  /* padding: 0!important; 文字が折り返される場合*/
}

.kasaneru p{
	font-size: 16px;
	font-weight: bold;
	vertical-align: middle;
	height: 56px;
	padding: 12px 0 !important;
	text-align: center;
	display:inline-block;
	width: 100%;
}



.ekimae{
	background-color: blue;
}

.ekiaco{
	background-color: red;
}

.gtokyo{
	background-color: magenta;
}

.drs_ag{
	background-color: orange;
	color: #333 !important;
}

.drs_cg{
	background-color: yellow;
	color: #333 !important;
}


.notice{
	font-size: 12px;
	text-align: center;
}


/*--■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ 

    SHOP INFORMATION
    
    ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ */

.shop_name{
	font-size: 22px;
	font-weight: bold;
}

.shop_name span{
	font-size: 22px;
	font-weight: normal !important;
}

.shop_detail span{
	font-size: 12px;
	font-weight: normal !important;
	margin-left:12px;
}

.shop{
	padding: 0 16px !important;
	min-height: 14em;
}

.shop a{
	color: #fff;
	display: block;
	transition: 0.2s;
}

a:hover{
	color: #ccc;
	text-decoration: none;
}

i{margin-right: 0.5em !important;}


.ekimae_b{
	border-left:solid 3px blue;
}

.ekiaco_b{
	border-left:solid 3px red;
}

.gtokyo_b{
	border-left:solid 3px magenta;
}

.drs_ag_b{
	border-left:solid 3px orange;
}

.drs_cg_b{
	border-left:solid 3px yellow;
}



.ekimae{
	background-color: blue;
}

.ekiaco{
	background-color: red;
}

.gtokyo{
	background-color: magenta;
}

.drs_ag{
	background-color: orange;
	color: #333 !important;
}

.drs_cg{
	background-color: yellow;
	color: #333 !important;
}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
 
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}







.input-wrapper {
  background-color: rgb(128 128 128 / .2);
  border: 1px solid rgb(255 255 255 / .4);
  border-radius: 24px;
  display: grid;
  gap: 4px;
  padding: 16px;
}

input[type="datetime-local"] {
  border: none;
  border-radius: 8px;
  background: linear-gradient(0deg, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, 0.10) 100%), rgba(0, 0, 0, .5);
  font-size: 16px;
  padding: 8px 12px;
}

.countdown-wrapper {
  align-items: flex-end;
  background-color: rgb(128 128 128 / .2);
  border: 1px solid rgb(255 255 255 / .4);
  border-radius: 24px;
  display: flex;
  padding: 12px 16px;
  
  & > .time {
    border-radius: 8px;
    background: linear-gradient(0deg, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, 0.10) 100%), rgba(0, 0, 0, .5);
    font-size: 24px;
    font-weight: bold;
    line-height: 1;
    min-width: 48px;
    min-height: 48px;
    display: grid;
    place-items: center;
    padding: 4px;
    margin-left: 12px;
  }
  & > .unit {
    margin-left: 4px;
  }
}