coming-sooncoming-soon@charset "UTF-8";
/* CSS Document */

h2{
	margin-bottom: 8%;
}

.container{
	max-width:1000px;
	margin:110px auto;
	}

.grid{
	display: grid; /*「Container」を「Grid Layout」に指定*/
	overflow: auto;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 0.3px;
}

.item{
	margin:10px;	
}

.portrait {
	width: 300px;
	height: 300px;
	object-fit: cover;
}

.information{
	width: 300px;
	margin: 0 auto;
}

/* ボタン全体 */
.fa-instagram{
	display:inline-block;	
	font-size:35px;
	text-decoration:none;
	float:right;
	transition:0.5s;
	color:#707070;	
}

.fa-instagram:hover{
	color:#4D6D66;
	transform: scale(1.1);
}

.text{
	text-align: left;
}

.section-top_image {
	width:100%;
}

.sukima{
	padding:100px 50px;
	margin: 0 auto;
}

/* ショートカットメニュー*/
.menumenu h2{
    margin-bottom:5rem;
}


.shortcutmenu h3{
	font: normal 1.6rem/2rem Neue Haas Unica W1G;
}

.shortcut{
	margin: 0 1% 5% 1%;
    
}

/* ショートカットボタンデザイン*/

.btn-wrapper{
    margin:0 auto;
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
    
}

.btn,
a.btn,
button.btn {
    display: inline-block;
    cursor: pointer;
    transition: all 0.5s;
    text-decoration: none;
}

a.btn--circle {
    width: 14rem;
	height: 14rem;
    border-radius: 50%;
    background: #FDFCF5;
	margin-bottom: 0rem
}

a.btn--circle:hover {
    transform: translate(0, 1px);
    box-shadow: 0 2px 0 #E7E3C3;
	opacity: 1;
}

.icon_wrapper{
    margin-bottom: 0.5rem;
}

.icon{
	width: 13rem;
}

/* キャンペーン */
.campaign{
    background-color: #FDFCF5;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: 10%;
    padding:53px;
    text-align: center;
}

.campaign h2{
    color: #FF600D;
    margin-bottom: 27px;
}


/* メニュー */

ul{
  list-style: none;
  padding: 40px;
  box-sizing: border-box;
  width: 100%;
}
li {
    align-items: center;
    display: flex;
    margin-bottom: 4px;
}

.long {
    align-items: none;
    display: block;
    flex-direction: column;
}

/* メニュー見出し */
span{
	text-align: left;
}

span .futoji{
	text-align: left;
	
}

span .hosoji{
	text-align: right;
}

.futoji{
	font: normal normal bold 16px/20px Noto Sans CJK JP;
}
.hosoji{
	font: normal normal normal 16px/20px Neue Haas Unica W1G;
}
/* 区切り線 */

.kugiri {
    border-top: 1px solid #707070;
    background-color: #707070;
}


/* 線と価格 */

.line {
    background: #000;
    display: flex;
    flex: 1 1 auto;
    height: 1px;
    margin: 9px 3px 0 30px;
	content: '';
}


.price {
    text-align: right;
}

.column2{
	display: flex;
	margin:6rem 1rem;
}

.left, .right {
  display: inline-block;
}


.split {
  display: flex;
  justify-content: space-between;
  margin:0 4rem;
}

.contents1,.contents2{
	width: 50%;
}

.contents1,.contents2 hr {
    padding: 0;
    border: 0;
    outline: 0;
}

/* タブレット向け=========================================*/
@media (max-width: 1159px){
    .shortcut{
        width:25%;
    }
}

/* スマホ向け=========================================*/

@media (max-width : 670px){
	
	#main{
     max-width: 100%;         /* 幅を決定する */
    }
	
	.section-top_image {
		height:23rem;
		object-fit:cover;
	}
	
	
	.campaign{
    margin-bottom: 20%;
	}
	
	.sukima{
		padding:0px 0px;
		margin: 0 auto;
	}
	
	.futoji,.hosoji{
		font-size: 1.4rem;
		line-height: 2.4rem;
	}
	
	.image1{
		display: none;
	}
	
	/* ショートカットボタンデザイン*/
	.btn-wrapper{
		display: flex;
	}

	.btn,
	a.btn,
	button.btn {
		
	}
 
	a.btn--circle {
		position: relative;
		width: 8rem;
		height: 8rem;
		border-radius: 50%;
		margin-bottom: 0rem
	}

	.icon{
		position: absolute;
		width: 8rem;
		left:0rem;
	}
	
	
/* 線と価格 */
	
	.column2{
		display: flex;
		flex-direction: column;
	}

	.contents1,.contents2{
		width: 100%;	
	}
}


/* 新样式 20240228 */
.split .hosoji,
.kugiri{
	display: none;
}
.campaign {
	margin-bottom: 0;
}
.column2 {
	width: 85%;
	margin-left: auto;
	flex-direction: column;
}
.contents1, .contents2 {
	width: 100%;
}
.split {
	width: fit-content;
	background: #FCFAE3;
	font-size: 22px !important;
	padding: 5px 15px;
	transform: skew(-25deg);
}
.futoji {
	transform: skew(25deg);
}
li {
	color: #333;
	justify-content: space-between;
	padding-left: 20px;
}
li.long {
	display: flex;
	flex-direction: row;
}
ul {
	padding-top: 10px;
}

@media (min-width : 670px) {
	.sukima section {
		position: relative;
	}
	.topic {
		width: 200px;
		text-align: right;
		color: #333;
		font-size: 45px;
		position: absolute;
		right: calc(85% + 10px);
		top: 5px;
	}
	.column2::before {
		content: '';
		position: absolute;
		width: 2px;
		height: 220px;
		transform: rotate(25deg);
		background-color: #333;
		top: -40px;
		left: calc(15% - 20px);
	}
	.topic span {
		transform: translateX(40px);
		line-height: 1.4;
		display: block;
	}
	#eyelash .topic span {
		transform: translateX(60px);
	}
	.column2 {
		margin-top: 0;
	}
	.futoji {
		font: normal normal 600 24px/28px Noto Sans CJK JP;
	}
	li {
		font-size: 20px;
	  margin-top: 20px;
	}
}
@media (max-width : 670px) {
	.kugiri {
		display: block;
	}
	.campaign {
		margin-bottom: 20%;
	}
	.column2 {
		width: 100%;
		margin-top: 30px;
	}
	.split {
		padding: 2px 15px;
	}
}