@charset "UTF-8";

@media only screen and (max-width: 640px) {
	.hero_warp {
		width: 100%;
		height: 100vh;
		background-image: url("../img/1_sp.jpg");
		background-size: cover;
	}

	.main_title_25th {
		margin: 1.5rem 0 7rem;
	}
	.main_title__25th_logo_wht {
		width: 18%;
		padding: 0 1.5rem 0 0;
		margin: 0 0;
		display: block;
	}
	
	.main_title__logo {
		padding: 0rem;
		width: 50%;
		margin: 15% 0 20%;
	}

	.main_title__warp {
		width: 100%;
		padding: 2rem;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	}

	.main_title__h2 {
		font-size: 12px;
		margin: 0;
		line-height: 1.5;
	}

	.main_title__h1 {
		font-size: 24px;
		font-weight: normal;
/*		margin: 0;*/
	}

	.main_title__p {
		font-size: 16px;
		margin: 0 0 7rem;
	}


	.linkButton_top_wht a:before {
		background: #fff;
		content: '';
		display: inline-block;
		height: 0.1px;
		margin-right: 10px;
		transition-duration: 0.3s;
		transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
		vertical-align: 2px;
		width: 5rem;
	}

	.text_title_warp {
		width: 100%;
		margin: 0;
		padding: 10rem 2rem;
	}

	.item_title {
		font-size: 2.4rem;
		width: 100%;
		padding: 10rem 2rem 5rem;
		margin: 0;
	}

	.item_name_main {
		font-size: 20px;
		letter-spacing: 0;
	}

	.text_title_warp h2 {
		font-size: 12px;
		margin: 0 0 2%;
	}

	.text_title_warp h1 {
		font-size: 24px;
		margin: 0;
	}

	.item_story__name {
		font-size: 16px;
		margin: 0 0 2%;
	}

	.item_story__title {
		width: 100%;
		margin: 0;
		padding: 0 2rem 10rem;
	}

	.item_story_warp {
		width: 100%;
		margin: 0 auto;
		display: block;
	}

	.item_story__texttitle {
		width: 100%;
		margin: 0;
		padding: 0rem 2rem 10rem;
	}


	.item_story__texttitle_main .item_story__texttitle_sub {
		line-height: 1.5;
	}

	.gender_warp {
		padding: 2rem;
	}

	.gender {
		width: 100%;
		padding: 10rem 0;

	}

	.gender_en {
		margin: 0 0 5rem;
	}

	.gender_men_img {
		margin: 0;
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 20px;
	}
	
	.gender_men {
		color: #232323;
		font-size: 14px;
		font-weight: normal;
		margin: 0 0 2rem;
	}

	.gender_men span
	{
		font-size: 14px;
		font-weight: 100;
		margin: 0rem 0rem 2rem 2rem;
		letter-spacing: 0.05rem;
	}

	.gender_women {
		color: #232323;
		font-size: 14px;
		font-weight: normal;
		margin: 0 0 2rem;
	}
	.gender_women span {
		font-size: 14px;
		font-weight: 100;
		margin: 0rem 0rem 2rem 2rem;
		letter-spacing: 0.05rem;
	}

	.gender_women_img {
		margin: 20px 0;
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		/* grid-template-columns: 1fr 1fr 1fr; */
		grid-gap: 20px;
	}

	.linkButton {
		font-size: 1.6rem;
		margin: 1rem 0;
	}

	.look_warp {
		width: 100%;
		padding: 0 2rem;
		margin: 5rem 0;
	}

	.look_no {
		margin: 0 0 2rem;
		padding: 5rem 0 2rem;
	}

	.look_co {
		line-height: 1.5;
		margin: 0;
		padding: 0 0 5rem;
	}


	.look_img_warp {
		width: 100%;
		display: block;
	}

	.look_img_warp li {
		width: 100%;
		padding: 0;
		margin: 0;
	}


	
	.waer_warp {
		width: 100%;
		margin: 7rem auto;
	}
	.waer_warp li {
		font-size: 12px;
		margin: 0.5rem 0;
		border-bottom: 1px solid #f1f1f1;
		padding: 5px 0;
		letter-spacing: 0.1rem;
	}
	.waer_warp_item {
		display: block;
		width: 100%;
	}
	
	.waer_class {
		font-size: 14px;
		width: 100%;
		margin: 15px 0 0;
		padding: 0;
	}

	.waer_item {
		padding: 0;
		margin: 5px 0 15px;
	}
	
	.btn {
		background-color: #707070;
		border: 1px solid transparent;
		border-radius: 2px;
		color: #fff;
		display: inline-block;
		font-size: 12px;
		font-weight: 100;
		max-width: 100%;
		padding: 10px 0px;
		text-align: center;
		width: 100%;
		margin: 5px 0;
	}
	
	.item__buyBtn {
		text-align: center;
		display: inline-block;
		width: 100%;
		font-size: 12px;
		color: #232323;
		padding: 5px 10px;
		background-color: #f6f6f6;
		border: solid 0.5px #f6f6f6;
	}


	.item_text_warp {
		width: 100%;
		margin: 0 auto;
		padding: 0 0rem 10rem;
		display: flex;
		flex-direction: column;
		flex-flow: column-reverse;
	}

	.item_warp {
		padding: 10rem 2rem 0;
	}

	.item_title_warp {
		width: 100%;
		margin: 0 auto;
		padding: 0;
	}

	.item_detail_warp {
		padding: 0;
		width: 100%;
	}

	.item_img_warp {
		width: 100%;
		margin: 0;
		padding: 1rem;
	}

	.item_price span {
		width: 5rem;
	}

	.item_size {
		padding: 0 0 5rem;
	}

	.item_size span {
		width: 5rem;
	}


	.item_supplement_title {
		font-size: 1.4rem;
		letter-spacing: 0.05rem;
		margin: 2rem 0;
	}

	.item_supplement_warp {
		padding: 0 0 5rem;
	}

	.content {
		margin: 0;
	}


	.Brand_page_warp {
		width: 100%;
		margin: 10rem auto;
	}

	shop_list_bg {
		width: 100%;
	}

	.shop_list_warp {
		width: 100%;
		margin: 5rem auto;
		padding: 2rem;
	}

	.shop_list_warp {
		width: 100%;
	}

	.shoplist_block_warp {
		display: block;
	}

	.shoplist_block {
		width: 100%;
		margin: 1rem 0;
		padding: 0 2rem;
		background: #fff;
	}

	.shop_name {
		margin: 0 0 2rem;
		padding: 2.5rem 0;
		font-size: 1.6rem;
		font-weight: bold;
		line-height: 2.5rem;
		border-bottom: 1px solid #707070;
	}

	.shoplist_block .to_page {
		text-align: left;
		padding: 2.5rem 0;
		font-size: 1.2rem;
	}

	footer {
		margin: 0 auto;
	}

	footer .logo {
		width: 5rem;
		text-align: center;
		margin: 0 auto;
	}

	footer .copy {
		text-align: center;
		margin: 5rem auto;
		font-size: 1.2rem;
	}

	.toggle_btn {
		display: block;
		position: fixed;
		top: 30px;
		right: 30px;
		width: 30px;
		height: 30px;
		transition: all .5s;
		cursor: pointer;
		z-index: 1000;
		opacity: 0.9;
	}
	.Hero__itemName {
		font-size: 20vw;
		margin: 0 -0.8rem 5rem;
		line-height: 0.8;
	}
	

	.start {
		background: #000;
		position: fixed;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		z-index: 11000;
	}

	.start p {
		position: fixed;
		color: #fff;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		display: none;
		z-index: 9999;
		width: 350px;
		padding: 20px;
	}

}

@media only screen and (min-width: 640px) and (max-width: 1024px) {
	.hero_warp {
		width: 100%;
		height: 100vh;
		background-image: url("../img/1_pad.jpg");
		background-size: cover;
	}

	.main_title__warp {
		width: 100%;
		margin: 0 auto;
		display: flex;
		flex-flow: column;
		position: absolute;
		justify-content: space-between;
		padding: 10rem;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #fff;
	}
	
	.main_title__h2 {
		font-size: 16px;
		font-weight: 100;
		margin: 0 0 3em;
		letter-spacing: 0.2rem;
	}
	
	.main_title__logo {
		width: 50%;
		padding: 5rem 0 10rem 0;
	}
	
	.main_title__h1 {
		font-size: 32px;
		font-weight: normal;
		margin: 0 0 1.5rem;
		padding: 0 0 10rem 0;
	}
	
	.main_title__p {
		font-size: 20px;
		font-weight: 100;
		margin: 0;
		padding: 1rem;
		letter-spacing: 0.15rem;
	}
	

	.text_title_warp {
		width: 100%;
		padding: 2rem;
		margin: 20rem auto;
	}
	
	.item_story_warp {
		width: 100%;
		margin: 0 auto 20rem;
		padding: 2rem;
		display: flex;
	}
	
	.item_story__texttitle_sub {
		line-height: 1.5;
	}
	
	.gender {
		width: 70%;
	}
	
	.linkButton {
		font-size: 1.6rem;
	}
	
	.look__men_warp {
		padding: 2rem;
	}
	
	.look_warp {
		width: 100%;
		margin: 0 auto;
		padding: 10rem 0;
	}
	
	.look_img_warp {
		width: 100%;
		display: flex;
		flex-flow: row wrap;
		justify-content: center;
	}
	
	.look_img_warp li {
		width: 50%;
	}
	.look_img_warp li {
		padding: 0px;
		margin: 0 0 50px;
	}
	
	
	.waer_warp {
		width: 100%;
		margin: 0 auto;
	}
	
	
	
	.item_warp {
		padding: 2rem;
	}
	.item_title_warp {
		width: 100%;
		margin: 0 auto;
		padding: 18rem 0 0;
	}
	
	.item_text_warp {
		width: 100%;
		margin: 0 auto;
		padding: 0 0 10rem;
		display: flex;
		flex-flow: column-reverse;
	}
	
	.item_img_warp {
		width: 70%;
		margin: 0 auto;
		padding: 5rem;
	}
	
	.item_detail_warp {
		width: 70%;
		margin: 0 auto;
		padding: 2rem 0;
	}
	
	.Brand_page_warp {
		width: 100%;
		margin: 20rem auto;
	}
	
	.shop_list_warp {
		max-width: 1100px;
		margin: 0 auto;
		padding: 10rem 2rem;
	}
	
}