@charset "utf-8";
html {overflow-y: scroll;}

body {
	margin: 0;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	background-color: #ff9600;
}

/*共通*/
@media print {
	.no_print {display: none;}
}

.clear {clear: both;}

.font-small {font-size: .7em;}

.font_orange {color: #FF9600;}

header {
	width: 100%;
	padding: 1% 0 0;
	background-color: #fff;
}

#logo_wrap {
	max-width: 1250px;
	margin: 0 auto;
	display: flex;
}

#logo {max-width: 150px;}
#logo img {
	width: 100%;
	vertical-align: bottom;
}

#title {max-width: 950px;}
#title h1 {
	margin: 0;
	padding: 0
}
#title h1 img {
	width: 100%;
	vertical-align: bottom;
}

#cart {	max-width: 150px;}
#cart img {
	width: 100%;
	vertical-align: bottom;
}
#cart a {transition: .5s all;}

#lead_wrap {
	width: 100%;
	background-color: #fff;
}

/*リード文*/
#lead1 {
	max-width: 900px;
	margin: 0 auto;
	padding: 1.5% 1% .5%;
	text-align: center;
}
#lead1 p {
	font-size: 1.2em;
	font-weight: 700;
	text-decoration: underline;
	margin: 0;
	padding: 0;
}

#lead2 {
	max-width: 850px;
	margin: 0 auto;
	padding: .5% 2% 1.5%;
}
#lead2 p {
	margin: 0;
	padding: 0;
	font-size: .9em;
	font-weight: 700;
	line-height: 1.5em;
}

/*h2*/
.sub_title_wrap {
	width: 100%;
	margin: 3% 0;
}
.sub_title {
	max-width: 650px;
	margin: 0 auto;
	text-align: center;
}
.sub_title h2 {
	font-size: 4em;
	padding: 0 0 1%;
	font-weight: 700;
	background-image: url(/images/h2_back.png);
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: contain;
	margin: 0;
}

/*コンテンツ*/
#content_top_wrap {
	width: 100%;
	background-image: url(/images/content_back.png);
	background-color: #ff9600;
	padding: 2% 0;
	background-size: cover;
	background-position: center top;
}
.content_top {
	max-width: 960px;
	padding: 0 1%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.content_ama,
.content_pro {
	width: 44%;
	padding: 2%;
	border-radius: 10px;
	border: 3px solid #000;
	margin-bottom: 2%;
	background-color: #f9f9f9;
}

.content_ama a {
	text-decoration: none;
	color: #000;
}
.content_pro a {
	text-decoration: none;
	color: #000;
}
.content_top h3 {
	font-size: 1.3em;
	font-weight: 700;
	margin: 0;
	padding: 2% 3% 1%;
	text-align: center;
}

.content_top h3 img {
	max-width: 45px;
	width: 100%;
	vertical-align: bottom;
}
.catch_img {
	max-width: 400px;
	margin: 0 auto;
}
.catch_img img {
	width: 100%;
	vertical-align: bottom;
}
.content_img {
	max-width: 400px;
	margin: 0 auto;
	overflow: hidden;
}
.content_img img {
	width: 100%;
	vertical-align: bottom;
	transition: .5s all;
}

/*名前*/
.content_name {
	max-width: 250px;
	margin: 2% auto 0;
	text-align: center;
}
.content_name p {
	margin: 0;
	font-size: 1.2em;
	padding: 3% 0 0;
	font-weight: 700;
}

.content_name p a {
	text-decoration: none;
	color: #000;
}
/*抜粋インタビュー*/

.content_sum {
	max-width: 400px;
	min-height: 250px;
	margin: 1% auto;
	background-image: url(/images/content_sum_back.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}
.content_sum p {
	margin: 0;
	font-size: .9em;
	line-height: 1.3em;
	padding: 15%;
}

/*アーカイブ*/
.content_archive_wrap {
	width: 100%;
	background-color: #F6F5F0;
	padding: 2% 0;
	border-top: 3px dotted #999;
	border-bottom: 3px dotted #999;
	background-image: url(/images/archive_back.png);
	background-repeat: no-repeat;
	background-position: center top;
}

.content_archive {
	max-width: 1000px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	padding: 1%;
}

.archive_img {
	width: 25%;
}

.archive_img img {
	width: 100%;
	vertical-align: bottom;
}
.archive_catch_wrap {
	width: 100%;
	display: flex;
	padding: 5% 0;
}
.archive_button {
	width: 18%;
}
.archive_button img {
	width: 100%;
}
.archive_catch {
	width: 98%;
	padding: 1%;
}
.archive_catch p {
	font-size: .9em;
	margin: 0;
}

/*ショップバナー*/
.banner_wrap {
	width: 100%;
	background-color: #000;
	padding: 1% 0;
	margin-top: 3%;
	border-top: 3px dotted #999;
	border-bottom: 3px dotted #999;
}
.banner {
	max-width: 800px;
	margin: 0 auto;
	padding: .2% 0;
	position: relative;
	overflow: hidden;
}

.banner a {
	transition: .5s all;
}
/*光る*/
.reflection {
	height : 100%;
	width : 30px;
	position : absolute;
	top : -180px;
	left : 0;
	background-color: #fff;
	opacity : 0;
	transform: rotate(45deg);
	animation: reflection 5s ease-in-out infinite;
	-webkit-transform: rotate(45deg);
	-webkit-animation: reflection 5s ease-in-out infinite;
	-moz-transform: rotate(45deg);
	-moz-animation: reflection 5s ease-in-out infinite;
	-ms-transform: rotate(45deg);
	-ms-animation: reflection 5s ease-in-out infinite;
	-o-transform: rotate(45deg);
	-o-animation: reflection 5s ease-in-out infinite;
}
@keyframes reflection {
	0% {
	transform: scale(0) rotate(45deg);
	opacity: 0;
	}
	80% {
	transform: scale(0) rotate(45deg);
	opacity: .5;
	}
	81% {
	transform: scale(4) rotate(45deg);
	opacity: 1;
	}
	100% {
	transform: scale(50) rotate(45deg);
	opacity: 0;
	}
}
@-webkit-keyframes reflection {
	0% {
	-webkit-transform: scale(0) rotate(45deg);
	opacity: 0;
	}
	80% {
	-webkit-transform: scale(0) rotate(45deg);
	opacity: .5;
	}
	81% {
	-webkit-transform: scale(4) rotate(45deg);
	opacity: 1;
	}
	100% {
	-webkit-transform: scale(50) rotate(45deg);
	opacity: 0;
	}
}
@-moz-keyframes reflection {
	0% {
	-moz-transform: scale(0) rotate(45deg);
	opacity: 0;
	}
	80% {
	-moz-transform: scale(0) rotate(45deg);
	opacity: .5;
	}
	81% {
	-moz-transform: scale(4) rotate(45deg);
	opacity: 1;
	}
	100% {
	-moz-transform: scale(50) rotate(45deg);
	opacity: 0;
	}
}
@-ms-keyframes reflection {
	0% {
	-ms-transform: scale(0) rotate(45deg);
	opacity: 0;
	}
	80% {
	-ms-transform: scale(0) rotate(45deg);
	opacity: .5;
	}
	81% {
	-ms-transform: scale(4) rotate(45deg);
	opacity: 1;
	}
	100% {
	-ms-transform: scale(50) rotate(45deg);
	opacity: 0;
	}
}
@-o-keyframes reflection {
	0% {
	-o-transform: scale(0) rotate(45deg);
	opacity: 0;
	}
	80% {
	-o-transform: scale(0) rotate(45deg);
	opacity: .5;
	}
	81% {
	-o-transform: scale(4) rotate(45deg);
	opacity: 1;
	}
	100% {
	-o-transform: scale(50) rotate(45deg);
	opacity: 0;
	}
}

.banner img {
	width: 100%;
	vertical-align: bottom;
}
/*フッター*/
footer {
	width: 100%;
	padding: 3% 0 0;
	background-color: #ff9600;
}

.footer_menu {
	max-width: 1200px;
	padding: 0 2%;
	margin: 0 auto;
	display: flex;
}

.footer_vol,
ul.f_menu>span {
	width: 25%;
}
.footer_vol p {
	font-weight: 700;
	text-align: center;
	color: #fafafa;
	text-decoration: underline;
	font-size: 1em;
	margin: 0;
	padding: 0 0 5%;
}
.footer_vol ul {
	margin: 0;
	padding: 0;
}
#copy_wrap p {
	margin: 0;
	padding: 0;
}

/*.footer_vol ul li,*/
ul.f_menu>span li {
	font-weight: 700;
	font-size: .95em;
	text-decoration: none;
	line-height: 1.8em;
	text-align: left;
	white-space: nowrap;
}
.footer_vol ul li a,
ul.f_menu>span li a {
	color: #000;
	text-decoration: none;
	transition: .5s all;
}

/*SNSロゴ*/
#sns_wrap {
	max-width: 160px;
	margin: 0 auto;
	display: flex;
}
#fb {
	max-width: 80px;
}
#fb img {
	width: 100%;
	vertical-align: bottom;
}
#insta {
	max-width: 80px;
}
#insta img {
	width: 100%;
	vertical-align: bottom;
}

/*コピーライト*/
#copy_wrap {
	width: 100%;
	text-align: center;
	padding: 1% 0;
}
/*ANTY'Sロゴ*/
#footer_logo_wrap {
	width: 100%;
	background-color: #000;
	padding: 1% 0;
}

#footer_logo {
	max-width: 240px;
	margin: 0 auto;
}

#footer_logo img {
	width: 100%;
	vertical-align: bottom;
}
#footer_logo a {
	transition: .5s all;
}

/*ページトップボタン*/
#page-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 40px;
	height: 40px;
}

#page-top a {
	display: block;
	line-height: 40px;
	font-size: 32px;
	background-color: #000;
	font-weight: bold;
	text-align: center;
	color: #ff9600;
	border: 1px solid #fff;
	text-decoration: none;
	transition: all .2s;
}
.fade-up {
	transition: opacity .7s;
	-moz-transition: opacity .7s;
	-webkit-transition: opacity .7s;
	-o-transition: opacity .7s;
	transition: transform .9s;
	-moz-transition: transform .7s;
	-webkit-transition: transform .7s;
	-o-transition: transform .7s;
}

@media screen and (min-width: 769px) {
	.Pc_dis,
	.f_menu span+br {display: none}

	.f_menu li>p,
	.f_menu a>span {margin: 0 .5em 0 0;}
	.f_menu a>span {font-size: small;}

/*メニュー*/
	#menu_wrap,
	.menu p a,
	ul.f_menu {width: 100%;}

	#menu_wrap {
		margin: auto;
		background-color: #000;
		padding: .5% 0;
		border-top: 3px dotted #fff;
		border-bottom: 3px dotted #fff;
		text-align: center;
	}

	#menu_wrap p {
		margin: 0;
		padding: .5%;
		color: #fff;
		font-weight: 700;
		font-size: .8em;
	}

	.menu {
		max-width: 1000px;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		box-sizing: border-box;
	}

	#menu_wrap .menu_ama,
	#menu_wrap .menu_pro {
		min-width: 106px; 
		width: 12.5%;
		min-height: 50px;
		background-image: url(/images/menu_ama_back.png);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: contain;
		box-sizing: border-box;
	}
	#menu_wrap .menu_pro {
		background-image: url(/images/menu_pro_back.png);
	}
	.menu p {
		font-size: .85em;
		margin: 0;
		font-weight: 700;
		line-height: 1.4em;
		color: #000;
	}
	.menu p a {
		display: block;
/*		width: 100%;*/
		padding: 7% 0 0;
		text-decoration: none;
		color: #000;
		transition: .5s all;
	}

	ul.menu,ul.f_menu {
		padding: 0;
		list-style: none;
	}
	/* menu_wrap 読込用 */
	.menu li{
		display: block;
	  }
	  .menu li.is-hidden {
		display: none;
		height: 0;
		margin: 0;
	  }
	  .list-btn {
		margin-top: 20px;
	  }
	  .list-btn.is-btn-hidden{
	  display:none;
	  } 
	  .list-btn button {
		background-color: #333;
	  	color:#fff;
		border: none;
		cursor: pointer;
		outline: none;
		padding: 0;
		height: 32px;
		line-height: 32px;
		width: 120px;
		font-weight: 600;
	}
		header {height: 100px;}

	.content_img img:hover {
		transform: scale(1.2) rotate(.0001deg);
	}

	.menu p a:hover {color: #999;}

	.content_pro a:hover,
	.content_ama a:hover {opacity: .7;}

	#cart a:hover,
	.content_name p a:hover,
	.footer_vol ul li a:hover,
	#footer_logo a:hover,
	#page-top a:hover {opacity: .5;}

	.banner a:hover {opacity: .8;}
}
@media screen and (max-width: 768px) {
	.Sp_dis,
	.menu,
	.footer_menu {display: none;}

	.fat-nav__wrapper>ul {width: 100%;}
	.fat-nav__wrapper>ul li>p {margin: 0;}

	header {
		margin: 0 auto;
		padding-top: 2.5%;
	}

	.content_top,
	#logo_wrap {display: block;}
	#logo {
		width: 120px;
		margin: 0 auto;
	}

	#title {
		max-width: 480px;
		margin: 0 auto;
	}

	#lead1 p {font-size: .85em;}

	#lead2 p {
		font-size: .8em;
		line-height: 1.3em;
		font-weight: 500;
	}

	#menu_wrap {
		padding: .5% 0 0;
		border: none;
		display: none;
	}
	#menu_wrap p {
		padding: .8%;
		font-size: .75em;
	}

	.sub_title h2 {
		font-size: 2.5em;
		width: 90%;
		margin: 0 auto;
	}

	.content_ama,
	.content_pro {
		width: 92%;
		margin: 0 auto 2.5%;
	}

	.content_archive_wrap {
		background-image: url(/images/archive_back_sp.png);
		background-repeat: no-repeat;
		background-position: center top;
	}

	.content_archive {
		max-width: 500px;
		display: block;
	}

	.archive_img {
		width: 50%;
		float: left;
	}

	.banner {width: 96%;}

	footer {padding: .5% 0 0;}


	#footer_logo_wrap {padding: 2% 0;}
}

@media screen and (max-width: 480px) {
	.sub_title h2 {
		font-size: 1.8em;
		padding-bottom: 3%
	}

	.content_top h3 {font-size: 1.2em;}

	.content_name p {font-size: .95em;}

	.content_sum p {
		font-size: .8em;
		padding: 22% 8% 0;
	}

	.archive_catch p {font-size: .8em;}

	#footer_logo {max-width: 120px;}

	#page-top {
		bottom: 15px;
		right: 5px;
	}
}