@charset "utf-8";
@media only screen and (min-width: 481px) and (max-width: 1280px) {
	.tb01 {
		background-image: url(../img/tb01.jpg);
	}
	.tb02 {
		background-image: url(../img/tb02.jpg);
	}
	.tb03 {
		background-image: url(../img/tb03.jpg);
	}
}
@media screen and (max-width:480px) {
	.contents-wrap {
		margin: 110px 8% 0;
	}
	.page-title {
		padding: 32px 0 64px;
		letter-spacing: 0.15rem;
	}
	.st-ft {
		font-size: 1.2rem;
    line-height: 2.2;
	  font-family: "游明朝体", YuMincho, "游明朝", "Yu Mincho", serif;
	  letter-spacing: .15rem;
		font-weight: 600;
		color:  rgba(0,0,0,0.6);
	}
	/*---------------------
	ヘッダー
	---------------------*/
	.header {
		height: 110px;
	}
	.tou-icon {
		max-width: 75%;
		width: 100%;
	}
	/*-- ハンバーガー --*/
	.nav-wrap {
		top: 40px;
	}
	.nav-toggle {
	  height: 15px;
		z-index: 99;
	}
	.nav-toggle.active span:nth-child(1) {
    transform: translateY(10px) rotate(-45deg);
    width: 90%;
	}
	.navigation {
		padding: 14vh 8% 0;
	}
	.nav-inner {
		margin: 0 16% 0;
		font-size: 1.6rem;
		line-height: 1.5;
		letter-spacing: .16rem;
	}
	.nav-inner-item {
		margin-bottom: 1.7vh;
	}
	.ac-label::after {
    left: 150px;
	}
	.ac-item {
		padding: 2% 0 4%;
	}
	.ac-item p{
		padding: 1.3vh 4% 0;
		font-size: 1.3rem;
		letter-spacing: .08rem;
		color: rgba(0,0,0,0.55);
	}
	.sns-icon {
		padding: 8vh 4% 0;
	}
	/*---------------------
	フッター
	---------------------*/
	footer {
		letter-spacing: .5;
	}
	/*---------------------
	index .html
	----------------------*/
	.scroll-bar {
    bottom: 140px;
    padding: 0px 0px 160px;
	}
	.scroll-bar::before {
	  content: '';
	  position: absolute;
	  bottom: 0;
	  left: 50%;
	  width: 1px;
	  height: 140px;
	  background: rgba(255, 255, 255, .4);
	}
	.scroll-bar::after {
	  animation: sdl 3s ease infinite;
	}
	@keyframes sdl {
	  0% {
	    transform: translateY(-140px);
	  }
	  50%, 100% {
	    transform: translateY(30px);
	  }
	}
	.main-contents-wrap {
		position: relative;
		bottom: 120px;

	}
	.sp01 {
		background-image: url(../img/sp01.jpg);
	}
	.sp02 {
		background-image: url(../img/sp02.jpg);
	}
	.sp03 {
		background-image: url(../img/sp03.jpg);
	}
	.index-wrap .title {
		font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: 0.25rem;
    color: #F4F3EF;
    margin-bottom: 40px;
	}
	.index-short-concept {
		font-size: 1.2rem;
    font-weight: 400;
    line-height: 3;
    margin: 0;
	}
	.view-more {
    margin-top: 40px;
    line-height: 2;
    font-size: 1.2rem;
	}
	.cut::after {
		content: "\A";
		white-space: pre;
	}
	.index-short-concept .cut:not(3){
		margin-top: 24px;
	}
	/*--collection--*/
	.index-wrap .collection-item-wrap {
    display: flex;
    justify-content: space-around;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
		margin: 0;
}
	.index-wrap .hover {
    width: 100%;
		margin: 4px 0;
	}
	/*--news--*/
	.index-wrap .news-title  {
		font-size: 1.35rem;
		line-height: 2;
		font-weight: 600;
		margin: 0 0 16px 0;
		padding-left: 24px;
	}
	.index-wrap .sub-text  {
		font-weight: 400;
		line-height: 2;
		letter-spacing: .1rem;
	}
	.index-wrap .news li {
    padding-bottom: 16px;
	}
	.index-wrap .sp-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
	}
	.index-wrap .inquiry-type,
	.index-wrap .entry-columns {
    width: 100%;
	}
	.index-wrap .check-btn,
	.index-wrap .inquiry-type {
		padding: 0;
	}
	.index-wrap .inquiry-type label,
	.entry-columns label {
		font-size: 1.2rem;
	}
	.index-wrap .entry-columns {
		padding: 8px 0;
	}
	.index-wrap form {
		width: 92%;
    margin: 0 auto;
    padding-bottom: 0px;
	}
	.index-wrap section {
		margin: 8% 8% 32%;
	}
	/*---------------------
	news.html
	---------------------*/
	.index-wrap .news {
		width: 92%;
		margin: 8% auto 32%;
	}
	.news li {
		padding-bottom: 12%;
	}
	.inner-pagenation {
    padding: 16% 0;
    justify-content: space-evenly;
	}
	.pagenation {
		margin-top: 30px;
	}

	.news .news-title {
    font-size: 1.2rem;
    letter-spacing: .05rem;
		padding-left: 2rem;
	}
	.news .sub-title {
    font-size: 1rem;
	}
/*
	.news ul{
		text-align: left;
	}
	.news time {
		text-align: center;
	}
*/
	/*---------------------
	news_inner
	---------------------*/
	.news-wrap {
    margin: 8% 8% 0;
	}
	.news-inner-title h2 {
    font-size: 1.4rem;
	}
	.news-inner-text {
		font-size: 1.3rem;
    line-height: 2.6;
    padding: 16% 0 0;
    font-weight: 400;
    letter-spacing: .05rem;
    color: rgba(0,0,0,0.8);
	}

	/*---------------------
	contact .html
	---------------------*/
	.inquiry-type,
	.contact .contact-textarea,
	.entry-columns textarea {
		width: 100%;
	}
	.entry-columns input {
		width: 64%;
	}
	.entry-columns textarea {
		height: 240px;
	}
	.sp-columns {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	.inquiry-type, .contact-textarea div {
		margin-bottom: 4%;
	}
	.submit {
		padding: 32px 0 32%;
	}
	.entry-columns input, .entry-columns textarea {
		border-radius: 4px;
	}
	/*---------------------
	thank_you .html
	----------------------*/
	.contents-wrap .side-margin,
	.thnks div {
		width: 100%;
	}
	.thnks p {
		text-align: left;
	}
	/*---------------------
	about .html
	---------------------*/
	.pc-columns {
		display: block;
	}
	.about-me,
	.about-perform {
		margin: 0;
	}
	.about-me p{
		margin-bottom: 16px;
		font-weight: 600;
		color:  rgba(0,0,0,0.7);
	}
	.pd-left {
		padding-left: 8%;
		font-weight: 600;
		color:  rgba(0,0,0,0.7);
	}
	.vertical-text {
		letter-spacing: 0.4rem;
	}
	.container_05 {
		margin-bottom: 56px;
		grid-template-rows: 20px 30px 1fr 1fr 20px;
  	line-height: 1;
	}
	.about-me {
		margin: 0;
		padding-bottom: 80px;
	}
	.Left {
		padding-top: 7px;
	}
	.Center {
		grid-area: center;
		padding-top: 1px;
	}
	.pdtp {
		padding-top: 12px;
	}
	.pdtp2 {
		padding-top: 47px;
	}
	.pd-left {
		padding-left: 12%;
	}
	/*---------------------
	concept .html
	---------------------*/
	.brand-image,
	.brand-concept {
		margin: 0 auto;
		justify-content: center;
		align-items: center;
		text-align: left;
		padding: 0 0 20px;
	}
	.brand-image-inner .st-ft{
		font-size: 1rem;
	}
	.brand-image-inner {
		margin: 0 8%;
	}
	.brand-image-inner .flex {
		flex-direction: column;
		text-align: left;
		width: 100%;
		margin: 32px 0 0;
	}
	.mg::before {
		content: "\A";
		white-space: pre;
	}
	.brand-image-inner .flex p:nth-child(1) {
		margin-bottom: 16px;
	}
	.brand-image-inner .flex p:nth-child(2) {
		margin-bottom: 16px;
	}
	.brand-image-inner .flex p:nth-child(3) {
		margin-bottom: 16px;
	}
	.brand-image-inner > p {
		margin: 8px 0 0;
	}
	.brand-concept-inner p:nth-child(1) {
		margin: 0 0 32px 0;
	}
	.brand-concept-inner p:nth-child(2) {
		margin: 0 0 120px 0;
		text-align: center;
		line-height: 2.5;
	}

	/*---------------------
	collection .html
	---------------------*/
	.collect {
		padding-bottom: 16%;
	}
	.collection-nav {
		display: none;
	}
	.sp-collection-nav {
		width: 100%;
		display: block;
		margin: 0 auto;
		letter-spacing: .13rem;
	}
	.sp-collection-nav ul:first-child{
		margin-bottom:10px;
	}
	.sp-collection-nav ul{
    display: flex;
    font-size: 1.1rem;
		letter-spacing: .1rem;
    font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    font-weight: 400;
    color: rgba(0,0,0,0.6);
		justify-content: space-around;
    align-items: center;
	}
	.collection-main-title {
		font-weight: 600;
		color:  rgba(0,0,0,0.8);
		text-align: center;
		padding: 20% 0 0;
		letter-spacing: 0.15rem;
	}
	.collect .sub-title {
		font-size: 1.3rem;
		font-weight: 400;
		color:  rgba(0,0,0,0.7);
	}
	.collection-item-wrap {
		display: flex;
		width: 100%;
		justify-content: space-between;
		flex-wrap: wrap;
		margin: 8% 0 0;
	}
	.sub-title {
		font-size: 1.1rem;
		font-weight: 400;
		color:  rgba(0,0,0,0.5);
		text-align: center;
	}
	.hover {
		position: relative;
		width: calc(98%/2);
		height: 100%;
		overflow:hidden;
	}
	.hover-text {
	 display: none;
	}
	/*---------------------
	collection_inner .html
	---------------------*/
	.collection-inner-wrap {
		margin: 8% 8% 0;
    padding: 120px 0 32px;
	}
	.collection-inner-title {
		padding: 0 0 5%;
	  color: rgba(0,0,0,0.7);
		line-height: 2.1;
	  letter-spacing: 1.8;
	}
	.collection-inner-title h2 {
		font-weight: 600;
	  font-size: 1.3rem;
		line-height: 2;
    letter-spacing: .15rem;
	}
	.collection-inner-title h3 {
		font-weight: 400;
	  font-size: 1.1rem;
		color: rgba(0,0,0,0.5);
		letter-spacing: .2rem;
		line-height: 1.5;
		margin-bottom: 16px;
	}
	.collction-inner-text {
		display: block;
		margin: 8% 0 16%;
	}
	.material-comment {
		width: 100%;
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 2.3;
    letter-spacing: .8;
    padding: 14px 0 0;
    color: rgba(0,0,0,0.8);
    position: relative;
	}
	.material-details {
		width: 100%;
		font-size: 1.2rem;
		margin-top: 16px;
		letter-spacing: .1rem;
	}
	.sp-mt-flx {
		display: flex;
		align-items: flex-start;
		flex-wrap: wrap;
		font-weight: 600;
		color: rgba(0,0,0,0.5);
		line-height: 2.3;
		margin-top: 4px;
	}

	.material-comment::after {
		position: absolute;
	  content: " ";
	  display: block;
	  border-bottom: solid 1px rgba(0,0,0,0.1);
	  bottom: 0px;
	  width: 100%;
	}
	.material-details span::after {
		width: 2%;
		bottom: 0px;
	}
	.material-details li:nth-child(1) {
		margin: 0;
	}
	.material-details .slash::after {
		content: "/";
		margin: 0 5px;
	}
	.material-details span {
		display: block;
	}
	.collction-inner-image {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.collction-inner-image img {
		width: 100%;
		margin-bottom: 16%;
	}

}