@charset "UTF-8";
/* CSS Document */

/* **************************
  html,body,img
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	body {
		font-size: 16px;
		font-size: 1.6rem;
		background-size: 18%;
	}
}

/* **************************
 Switch Image
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	.img_pc { display: block; }
	.img_sp { display: none; }
}


/* **************************
  Link
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	a:hover { text-decoration: none; }
	a img { opacity: 1; transition: all 0.5s ease 0s; }
	a:hover img { opacity: 0.7; transition: all 0.5s ease 0s; }
	li:before { opacity: 1 !important; }
	.anc {
		position: relative;
		top: -100px;
		display: block;
	}
}

/* --- Over TB --- */
@media screen and (min-width:1200px) {
	.anc {
		position: relative;
		top: -102px;
		display: block;
	}
}


/* **************************
  header nav
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	header {
		border-bottom-width: 4px;
	}
	header nav {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 70px;
		padding-bottom: 2px;
	}
	header nav .inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 94%;
		padding-top: 0;
		height: 70px;
	}
	header nav #nav_link {
		max-width: 700px;
		width: 60%;
		margin-top: 4px;
		display: flex;
		justify-content: space-between;
		font-size: 1.0rem;
		letter-spacing: 0.12em;
		text-align: left;
	}
	header nav #nav_link span {
		display: block;
		font-size: 1.7em;
		margin-bottom: 0.2em;
		margin-right: 12%;
	}
	header #nav_sns {
		display: flex;
		padding: 0;
	}
	header #nav_sns p {
		font-size: 1.2rem;
	}
	header #nav_logo_hottoys {
		position: static;
		max-width: 64px;
		width: 6%;
	}
	/* ハンバーガー */
	#nav_toggle {
		display: none;
	}
}

@media screen and (min-width:1024px) {
	header nav #nav_link span {
		font-size: 1.8em;
	}
}

/* --- Over TB --- */
@media screen and (min-width:1200px) {
	header nav {
		height: 78px;
	}
	header nav #nav_link {
		width: 62%;
		display: flex;
		justify-content: space-between;
		font-size: 1.2rem;
		letter-spacing: 0.15em;
	}
	header #nav_sns {
		font-size: 1.2rem;
	}
	header #nav_logo_hottoys {
		max-width: 70px;
		width: 7%;
		margin: 4px 0 0 4px;
	}
}


/* **************************
  contents
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	#contents {
		padding-top: 100px;
	}
	#contents p {
		line-height: 1.6;
		letter-spacing: 0.2em;
	}
}

/* --- Over TB --- */
@media screen and (min-width:1200px) {
	#contents {
		padding-top: 102px;
		overflow: hidden;
	}
}

/* **************************
  h section title
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	section h2.titles {
		font-size: 54px;
	}
}


/* **************************
  box
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	.box_bkg {
		padding: 30px;
		margin-bottom: 60px;
	}
	body[id*="subpage"] .box_bkg:last-of-type {
		margin-bottom: 0;
	}
}


/* **************************
  subpage
************************** */
@media screen and (min-width:768px) {
	body[id*="subpage"] #subpage_tit_bnr {
		margin-bottom: 40px;
	}
}


/* **************************
  item page
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	ul[class*="items_list"] li {
		width: 23.2%;
		margin-bottom: 2vw;
	}
	ul[class*="items_list"] li.items_img_column3 {
		width: 32.1%;
	}
	ul[class*="items_list"] li.items_img_column2 {
		width: 48%;
	}
	.items_list li[class*="items_ico_exclusive"]:before {
		height: 6vw;
	}
	ul[class*="items_list"] li .item_img {
		margin-bottom: 2vw;
	}
	ul[class*="items_list"] li .item_txt p {
		letter-spacing: 0.2em;
	}
	ul[class*="items_list"] li .item_txt .item_txt_name {
		margin-bottom: 1.5em;
		line-height: 1.4 !important;
	}
	ul[class*="items_list"] li .item_txt .item_txt_price {
		font-size: 1.4rem;
		letter-spacing: 0.15em;
	}
	ul[class*="items_list"] li .item_txt .item_txt_price span {
		font-size: 2.1rem;
	}
	ul[class*="items_list"] li.items_ico_exclusive:before {
		width: 12vw;
		height: 12vw;
		max-width: 150px;
		max-height: 150px;
		background: url(../images/items_ico_exclusive.svg) no-repeat right top;
		background-size: contain;
		top: 0.4vw;
	}
	ul.items_list_column1 li.items_ico_exclusive:before {
		width: 26vw;
		height: 26vw;
		max-width: 220px;
		max-height: 220px;
		top: 1vw;
	}
}

@media screen and (min-width:1024px) {
	#contents ul[class*="items_list"] li .item_ico img {
		max-width: 190px;
		width: 16vw;
		min-width: 170px;
		margin-bottom: 8px;
	}
	ul[class*="items_list"] li.items_ico_exclusive:before {
		top: 7px;
	}
	ul.items_list_column1 li.items_ico_exclusive:before {
		top: 10px;
	}
	#contents ul[class*="items_list"] li .item_ico_new img,
	#contents ul[class*="items_list"] li .item_ico_reserved img {
		max-width: 190px;
		width: 14vw;
		min-width: 170px;
		margin-bottom: 8px;
	}
}

/* --- Over TB --- */
@media screen and (min-width:1200px) {
	ul[class*="items_list"] li .item_img {
		margin-bottom: 20px;
	}
	ul[class*="items_list"] li .item_txt {
		font-size: 14px;
	}
	ul[class*="items_list"] li .item_img img {
		border-radius: 12px;
	}
}

/* **************************
  footer
************************** */
/* --- Over SP --- */
@media screen and (min-width:768px) {
	footer #footer_license {
		font-size: 1.2rem;
	}
	footer #footer_license a {
		width: 60%;
		max-width: 170px;
	}
	footer #footer_license img {
		margin-bottom: 10px;
	}
	footer #footer_copyrightsns {
		height: 130px;
	}
	footer #footer_txt_copyright {
		font-size: 1.2rem;
	}
	footer #footer_sns {
		font-size: 1.2rem;
	}
	footer #footer_sns #footer_sns_tit {
		width: 126px;
	}
}